客戶端 Facebook Canvas / X-Frame-Options Deny 的頂級重定向

Question

我正在嘗試使用 Java/Spring Social Facebook 庫構建 Facebook Canvas 應用程序。

當用戶第一次訪問 Canvas 頁面 (apps.facebook.com/mycanvasapp) 時，Facebook 正在對我的應用程序 URL 執行帶有“signed_request”的 HTTP POST。

當用戶第一次訪問應用程序時，facebook 在 POST 正文中發送空的“oauth_token”； 因此，我的應用程序返回帶有以下 Java 腳本代碼的 HTTP 200 代碼，以向用戶顯示授權對話框。

top.location.href='https://www.facebook.com/v2.5/dialog/oauth?client_id=12345&redirect_uri=https://myapp.com/canvas/';

這是為了在客戶端/瀏覽器端進行頂級重定向，因為 iframe 中不允許 HTTP 服務器重定向。

但是，我確實在瀏覽器/Chrome 日志中遇到以下錯誤，並且無法向用戶顯示授權窗口。

拒絕在框架中顯示“ https://myapp.com/canvas/ ”，因為它將“X-Frame-Options”設置為“DENY”。

在其他帖子中提出了類似的問題 - Facebook Canvas / X-Frame-Options Deny Case中的Web App，其中建議進行瀏覽器端頂級重定向而不是 HTTP 服務器重定向。

我在 Java Script 中僅使用“top.location.href”進行頂級瀏覽器重定向，但仍然遇到同樣的問題。

當我在 curl/命令行中重放請求時，這是我的應用程序返回的響應，這對我來說似乎沒問題。

 HTTP/1.1 200 OK
 Connection: keep-alive
 Server: Apache-Coyote/1.1
 X-Content-Type-Options: nosniff
 X-Xss-Protection: 1; mode=block
 Cache-Control: no-cache, no-store, max-age=0, must-revalidate
 Pragma: no-cache
 Expires: 0
 Strict-Transport-Security: max-age=31536000 ; includeSubDomains
 X-Frame-Options: DENY
 Access-Control-Allow-Origin: *
 Access-Control-Allow-Methods: POST, GET, PUT, OPTIONS, DELETE
 Access-Control-Max-Age: 3600
 Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept, X-Auth-Token
 Content-Language: en-US
 Transfer-Encoding: chunked
 Date: Sat, 09 Jul 2016 04:40:17 GMT
 Via: 1.1 vegur
<script>top.location.href='https://www.facebook.com/v2.5/dialog/oauth?client_id=12345&redirect_uri=https://myapp.com/canvas/';</script>

調整“X-Frame-Options”標頭字段似乎沒有多大幫助。

我錯過了什么？ 有人可以提出一個可行的解決方案嗎？

有一些關於使用 Facebook Java Script SDK 庫的建議。 但是由於我的應用程序包含在 Facebook Canvas 頁面中，因此在訪問 Canvas 頁面時 Facebook 會將 HTTP Post 發送到我的服務器，因此想知道如何在此過程開始之前加載 HTML/Java Script 以加載 Facebook Java Script SDK 庫。

PS：我在我的應用程序中使用 org.springframework.social.facebook.web.CanvasSignInController Spring 預建控制器。

Answer 1

我通過禁用/抑制來自我的服務器的 POST 響應的安全標頭解決了這個問題，

X-Content-Type-Options: nosniff X-Xss-Protection: 1; mode=block Cache-Control: no-cache, no-store, max-age=0, must-revalidate Strict-Transport-Security: max-age=31536000 ; includeSubDomains X-Frame-Options: DENY Access-Control-Allow-Origin: * Access-Control-Allow-Methods: POST, GET, PUT, OPTIONS, DELETE Access-Control-Max-Age: 3600 Access-Control-Allow-Headers : Origin, X-Requested-With, Content-Type, Accept, X-

關鍵是在標題中排除 X-Frame-Options 和 Strict-Transport-Security，現在為我解決了這個問題。