임베딩 오류

지원팀 안녕하세요!
제공된 JS 스니펫으로 임베드를 시도하면 “Loading Discussion” 화면에서 멈추고 다음 오류가 발생합니다:
Invalid X-Frame-Options: “ALLOWALL” header from ...
이 문제를 어떻게 해결할 수 있을까요?
감사합니다!

늦었을 수도 있지만, 저도 같은 문제에 부딪혔고 여기에서 답변을 얻었으면 좋았을 텐데요. 제 문제는 Firefox를 사용할 때만 발생했고, Chrome에서는 아무 문제없이 작동했습니다. 콘텐츠가 임베드된 사이트를 “cors origins” 설정에 추가함으로써 해결했습니다. 힌트는 여기서 얻었습니다.

우리의 사이트에서도 동일한 문제가 발생하고 있음을 방금 알게 되었습니다. 다만, 기존에 companion topic이 이미 생성된 기존 게시글이 아니라 새로운 게시글에서만 문제가 발생합니다. Invalid X-Frame-Options 헤더는 실제 오류라기보다는 Firefox의 경고에 가깝습니다. 임베딩이 성공하더라도 항상 표시되기 때문입니다.

정상적으로 동작하는 예시(임베딩이 작동했던 기존 topic이 있는 경우)

반면, 이 랜딩 페이지:

결국 우리의 Discourse 인스턴스에서 400 bad request 응답을 받습니다..

이것이 왜 발생하는지 포럼과 문서를 열심히 찾아보았지만 아직 아무것도 찾지 못했습니다.. 임베딩 페이로드에 discourse 사용자 이름을 포함하고 있기 때문일 것이라 생각했지만, 적절하게 동기화되어 있는 사용자가 생성한 콘텐츠(예: Winter School on Agent-Based Modeling of Social-Ecological Systems)에서도 동일한 문제가 발생합니다.

확인해 본 사항들:

  1. DISCOURSE_ENABLE_CORS: true가 설정되어 있습니다.
  2. discourse 설정에서 cors 호스트가 https로 올바르게 설정되어 있습니다.
  3. 허용된 호스트가 올바르게 설정되어 있습니다(이미 생성된 discourse 게시글에 대해서는 임베딩이 작동합니다).

다른 고려해야 할 사항이 있을까요? 제가 생각할 수 있는 다른 유일한 가능성은 최근에 사이트를 CloudFlare와 통합했기 때문에, 정상적인 작동을 위해 CloudFlare 설정이 필요할 수 있다는 것입니다. 하지만 기존 topic은 왜 정상적으로 작동하는지 여전히 의문이 듭니다…

일시적으로 Cloudflare를 비활성화해 보는 것을 권장합니다. 그렇게 하면 문제가 해결될 수 있습니다. 설정도 간단합니다…

좋은 지적입니다. 스테이징 사이트에서 시도해 봤지만 unfortunately 문제가 해결되지 않았습니다.

Chrome에서는 다음과 같은 오류가 표시됩니다:

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('https://test-discourse.comses.net') does not match the recipient window's origin ('https://test.comses.net').

(https://test.comses.net/codebases/f0613922-9cb1-4656-a26c-af57f823fb69/releases/3.2.0/ 에서)

여기서 다른 사용자들은 DiscourseEmbed.discourseEmbedUrl이 참조 URL과 동일하도록 설정함으로써 이 문제를 해결할 수 있었던 것 같지만, 제가 확인해 보니 여전히 올바르게 설정되어 있었습니다. Discourse 로그를 살펴봤는데(혹시 /var/discourse/shared/standalone/log/rails/production.log 파일을 봐야 하나요?), 거기서도 오류가 보이지 않았습니다. 이 문제를 해결하기 위해 다른 곳에서 확인해 볼 아이디어가 있을까요?

Discourse 로그의 예시:

Started GET "/embed/comments?embed_url=https%3A%2F%2Ftest.comses.net%2Fcodebases%2Ff0613922-9cb1-4656-a26c-af57f823fb69%2Freleases%2F3.2.0%2F" for 72.201.57.141 at 2020-08-05 05:15:40 +0000
Processing by EmbedController#comments as HTML
  Parameters: {"embed_url"=>"https://test.comses.net/codebases/f0613922-9cb1-4656-a26c-af57f823fb69/releases/3.2.0/"}
  Rendering embed/loading.html.erb within layouts/embed
  Rendered embed/loading.html.erb within layouts/embed (Duration: 0.4ms | Allocations: 134)
Completed 200 OK in 91ms (Views: 1.8ms | ActiveRecord: 0.0ms | Allocations: 16308)
Started GET "/service-worker-c8000968830b6f6bd33f1e842dffdd569664119d449f93dc7d428d963a71635d.js" for 72.201.57.141 at 2020-08-05 05:15:42 +0000
Processing by StaticController#service_worker_asset as */*
  Rendering text template
  Rendered text template (Duration: 0.0ms | Allocations: 1)
Completed 200 OK in 27ms (Views: 1.3ms | ActiveRecord: 0.0ms | Allocations: 6617)

저도 같은 문제를 겪고 있습니다. 예를 들어 Making sure you're not a bot! 페이지 하단에서 이를 실시간으로 확인할 수 있으며, @mock/mock - Fedora Discussion 의 토론이 여기에 임베드되어 있습니다. 참고로 discussion.fedoraproject.org는 유료 인스턴스이며 Discourse에서 서비스로 제공합니다.

저를 혼란스럽게 하는 점은, 토론이 때로는 로드되고 때로는 로드되지 않는다는 것입니다. Firefox(버전 80)의 개인 정보 보호 모드에서 이를 재현할 수 있습니다(거의 항상 재현됨).

개발자 도구는 다음을 표시합니다:

“@mock/mock - Fedora Discussion” 로드를 위해 잘못된 X-Frame-Options 헤더가 발견되었습니다: "ALLOWALL"은 유효한 지시어가 아닙니다.

그리고 실제로, 문서 X-Frame-Options header - HTTP | MDN 에서는 ALLOWALL을 유효한 값으로 인정하지 않습니다.

https://discussion.fedoraproject.org/t/mock-mock/3107에서 링크하신 토픽이 보호된 카테고리에 있는 것으로 보입니다. 익명 사용자로 액세스할 수 없습니다. Discourse 포럼과 웹사이트가 동일한 루트 도메인을 공유하는 한, 포럼에 로그인한 사용자에게는 내장된 댓글이 로드되지만 로그인하지 않은 사용자에게는 로드되지 않을 것으로 예상됩니다. 이것이 현재 보고 계신 상황과 일치하는지 확인해 주시겠습니까?

포럼에 로그인한 사용자에게는 임베디드 댓글이 로드되고, 로그인하지 않은 사용자에게는 로드되지 않는다고 예상합니다. 이것이 현재 보고 계신 현상과 일치하는 것처럼 들리나요?

실제로 그런 것 같습니다. 이 동작을 Google Chrome과 Firefox 양쪽에서 재현할 수 있습니다. 다만, 두 브라우저의 프라이빗 모드에서는 토론이 로드되지 않는데, 이것이 의미하는 바는 잘 모르겠습니다. 하지만 아마도 모든 사람이 볼 수 있도록 카테고리를 업데이트해야 한다는 방향으로 가리키는 것 같습니다.

감사합니다. 카테고리를 편집하고 보안 탭에서 "모두"에게 “생성/답글/보기” 권한을 추가한 후 임베딩이 다시 작동합니다.

최근 Discourse 업데이트 이후 모든 임베드 페이지에서 오류가 보고되고 있습니다 :sweat_smile:

현재 확인되는 일반적인 오류 메시지는 다음과 같습니다. 이는 브라우저가 리퍼러를 제거하는(referer stripping) 것을 수행하여 Discourse 임베드 코드의 검증 체크가 실패하는 것처럼 보입니다:

Referer: `https://www.comses.net/`

리퍼러가 전송되지 않았거나, 다음 호스트 중 어디에도 일치하지 않았습니다:

* www.comses.net/codebases/.* 

예시 페이지: Artificial Anasazi

Chrome의 경우, Privacy Badger/다른 모든 확장 기능이 비활성화되어 있더라도 리퍼러 오류 메시지는 항상 표시되는 것 같으며, 이는 A new default Referrer-Policy for Chrome - strict-origin-when-cross-origin  |  Blog  |  Chrome for Developers 로 인해 발생하는 것으로 보입니다. 업데이트 이제 원본 사이트(예: https://www.comses.net)에 명시적인 Referrer-Policy를 추가하면 기존 주제에 대해 작동합니다. 따라서 haproxy의 경우 다음과 같은 설정이 필요할 수 있습니다: http-response set-header Referrer-Policy "no-referrer-when-downgrade"

Firefox와 Chrome에서는 기존 주제가 있는 페이지는 작동하지만, 새로운 주제를 생성하려는 페이지는 다음과 같은 방식으로 실패합니다: The Bronze Age Collapse model (BACO model).

저는 haproxy 설정을 변경하여 Content-Security-Policy frame-ancestors에 대한 응답 헤더를 설정했으며, 이를 통해 Firefox의 X-Frame-Options ALLOWALL not recognized 오류가 수정되었지만, 이제 요청이 타임아웃되고 결국 Discourse 포럼에서 400 Bad Request가 발생합니다..

오류는 postMessage와 관련이 있는 것으로 보입니다:

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('https://forum.comses.net') does not match the recipient window's origin ('https://www.comses.net').

이번 달 말쯤 시간이 좀 더 나면 더 깊이 파고들겠지만, 아직 기억이 생생할 때 브레인 덤프를 하고 싶었습니다 - 그 사이에 누군가가 우회 방법을 찾아주길 바랍니다! :grin:

나도 같은 문제가 발생합니다. 이 오류에 대해 이곳에서 조금이라도 도움을 주실 수 있으시면 좋겠습니다. 제 경우에는 테스트 블로그와 공식 블로그가 각각 있습니다… 둘 다 Webflow로 만들었는데… 테스트 블로그에서는 모든 것이 정상적으로 작동하지만, 라이브 블로그에서는 이 오류가 발생합니다…

### 임베딩 오류


Referer: `https://www.pynk.io/blog/what-to-invest-in-look-around-you`

Referer가 전송되지 않았거나, 다음 호스트 중 어느 것과도 일치하지 않았습니다:

[여기에 공백]

늦게 답변드려 죄송합니다. 임베드 코드 스니펫에 설정된 DiscourseEmbed 객체에 discourseReferrerPolicy: 'no-referrer-when-downgrade'를 추가해 보시겠습니까? 해당 속성을 추가하는 코드 스니펫의 전체 예제는 여기에서 확인하실 수 있습니다: Embed Discourse comments on another website via Javascript - #353.

그렇게 시도해 보신 후, 문제가 해결되는지 알려주시면 감사하겠습니다.

이 문제는 여기서 해결된 것 같습니다: Embed Discourse comments on another website via Javascript - #365. 그 경우 문제는 Discourse 임베더블 호스트 기록에서 www 서브도메인이 누락되어 있었습니다.

수정: 이 문제는 이제 Discourse 코어 코드에서 수정되었습니다. 더 이상 discourseReferrerPolicy 변수를 'no-referrer-when-downgrade'로 설정할 필요가 없습니다. Discourse는 이제 기본적으로 리퍼 정책을 'no-referrer-when-downgrade'로 설정합니다. 이に関する 자세한 내용은 https://meta.discourse.org/t/embedding-discourse-comments-via-javascript/31963#setting-the-referrer-policy를 참조하세요.

discourseReferrerPolicy를 추가하니 문제가 해결되었습니다 - 감사합니다, @simon !! :100:

이것이 SSO에 문제를 일으킬 수 있습니다. 현재 current.discourse.example이 sso.discourse.example를 SSO 호스트로 사용하고 있습니다. 로그인된 상태에서는 주제 목록이 올바르게 표시되지만, 익명 상태에서는 그렇지 않으며 위에서 언급한 오류가 표시됩니다. /embed/topics?... URL은 빈 페이지를 표시합니다.

다음과 같이 수정되어야 한다고 생각합니다(또는 바랍니다):

Content-Security-Policy: frame-ancestors https://current.discourse.example https://sso.discourse.example;