使用Facebook SDK与Chrome扩展 [英] Using Facebook sdk with Chrome Extensions

问题描述

Popup.js文件：

  window.fbAsyncInit = function（）{
 // init the FB JS SDK 
 FB.init（{
 appId：******，//应用程序仪表板中的应用程序ID 
 status：true，//检查Facebook登录状态
 xfbml ：false //在页面上查找社交插件
}）; 
 
}; 
 
 //加载SDK异步
（函数（d，s，id）{
 var js，fjs = d.getElementsByTagName（s）[0]; 
 if（d.getElementById（id））{
 return; 
} 
 js = d.createElement（s）; 
 js.id = id; 
 js .src =https://connect.facebook.net/en_US/all.js; 
 fjs.parentNode.insertBefore（js，fjs）; 
} 
（document，'script '，'facebook-jssdk'））; 
  

清单文件：

  {
manifest_version：2，
 
name：Charts，
description：Demo，
版本：1.0，
content_security_policy：script-src'self''unsafe-eval'https://connect.facebook.net; object-src'self'，
权限：[
https://connect.facebook.net/en_US/all.js
]，
browser_action：{
default_icon：图标.png，
default_popup：popup.html
} 
} 
  

当我将包含我的桌面上的文件的文件夹上载到chrome作为扩展时，出现错误。但是，当我打开扩展并检查它时，我收到以下错误：

拒绝执行JavaScript URL，因为它违反了以下内容安全策略指令：script-src 'self''unsafe-eval' https://connect.facebook.net 。

和

给定的URL不被应用程序配置允许：一个或多个给定的URL不被应用程序的设置，它必须与网站URL或Canvas URL匹配，或者该域名必须是其中一个应用程序域的子域名关于：blank：1

任何帮助将不胜感激。

解决方案

第一个错误来自Chrome。您需要设置content_security_policy，但确实如此。奇怪的是，您的content_security_policy指令完全适合我：

content_security_policy：script-src'self' https://connect.facebook.net ; object-src'self'，

第二个错误是来自Facebook。因为你不能在Facebook应用设置中使用chrome-extensionpseudoprotocol，所以你应该使用这样的登录方法：

https://developers.facebook.com/docs/facebook-login/manually-build -a-login-flow / v2.0

Popup.js file:

window.fbAsyncInit = function() {
                // init the FB JS SDK
                FB.init({
                    appId : ******, // App ID from the app dashboard
                    status : true, // Check Facebook Login status
                    xfbml : false // Look for social plugins on the page
                });

            };

            // Load the SDK asynchronously
            (function(d, s, id) {
                    var js, fjs = d.getElementsByTagName(s)[0];
                    if (d.getElementById(id)) {
                        return;
                    }
                    js = d.createElement(s);
                    js.id = id;
                    js.src = "https://connect.facebook.net/en_US/all.js";
                    fjs.parentNode.insertBefore(js, fjs);
                }
                (document, 'script', 'facebook-jssdk'));

Manifest File:

{
  "manifest_version": 2,

  "name": "Charts",
  "description": "Demo",
  "version": "1.0",
  "content_security_policy": "script-src 'self' 'unsafe-eval' https://connect.facebook.net; object-src 'self'",     
  "permissions": [
    "https://connect.facebook.net/en_US/all.js"
  ],
  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  }
}

When I upload the folder which contains the files from my desktop to chrome as an extension I get to errors. However when i open the extension and inspect it i get the following errors:

"Refused to execute JavaScript URL because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval' https://connect.facebook.net"."

and

"Given URL is not allowed by the Application configuration.: One or more of the given URLs is not allowed by the App's settings. It must match the Website URL or Canvas URL, or the domain must be a subdomain of one of the App's domains. about:blank:1"

Any help would be greatly appreciated.

解决方案

The first error is from Chrome. You need to set content_security_policy but indeed you did. The strange is that your content_security_policy directive totally works for me:

"content_security_policy": "script-src 'self' https://connect.facebook.net; object-src 'self'",

The second error is from Facebook. Because you cant allow a "chrome-extension" pseudoprotocol in the Facebook app settings you should use a login method like this:

https://developers.facebook.com/docs/facebook-login/manually-build-a-login-flow/v2.0

这篇关于使用Facebook SDK与Chrome扩展的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！