CODEWITHSUNDEEP
google-chrome-extensionfacebook-javascript-sdk
Ivan
Ivan

Reputation: 23

Facebook js sdk not executed in my Chrome extension

As of this question Can't load facebook js sdk from Chrome extension i trying basically the same thing

background.js

(function(d, s, id, debug){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "facebook-all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk', /*debug* / false));

window.fbAsyncInit = function() {
// init the FB JS SDK
alert('INIT SDK');
FB.init({
  appId      : 'xxxxxxxxxxx', // App ID from the App Dashboard
  //channelUrl : '', // Channel File for x-domain communication
  status     : true, // check the login status upon init?
  cookie     : true, // set sessions cookies to allow your server to access the session?
  xfbml      : true,  // parse XFBML tags on this page?
});
FB.login(function(response) {
   if (response.authResponse) {
     alert('Welcome!  Fetching your information.... ');
     FB.api('/me', function(response) {
         alert('connected ' + JSON.stringify(response, null, 4));
     });
   } else {
     alert('User cancelled login or did not fully authorize.');
   }
 });
};

manifest.json

{
"name": "A browser action with no icon",
"version": "1.0",
"background": { "scripts":["background.js"]},
"permissions": [
"tabs",
"https://*/*",
],
"content_security_policy": "default-src https://connect.facebook.net/ https://s-static.ak.facebook.com/connect/ chrome-extension-resource: 'self' 'unsafe-eval' ",
"manifest_version": 2
}

but im getting the following erros on the console:

The "fb-root" div has not been created, auto-creating all.js:52

Refused to apply inline style because it violates the following Content Security Policy directive: "default-src https://connect.facebook.net/ https://s-static.ak.facebook.com/connect/ 'self' 'unsafe-eval'". Note that 'style-src' was not explicitly set, so 'default-src' is used as a fallback.

Refused to execute JavaScript URL because it violates the following Content Security Policy directive: "default-src https://connect.facebook.net/ https://s-static.ak.facebook.com/connect/ 'self' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

Refused to execute JavaScript URL because it violates the following Content Security Policy directive: "default-src https://connect.facebook.net/ https://s-static.ak.facebook.com/connect/ 'self' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

Refused to load the frame 'http://static.ak.facebook.com/connect/xd_arbiter.php?version=21#channel=f30…F_generated_background_page.html%3Ffb_xd_fragment%23xd_sig%3Df2c0b5eef8%26' because it violates the following Content Security Policy directive: "default-src https://connect.facebook.net/ https://s-static.ak.facebook.com/connect/ 'self' 'unsafe-eval'". Note that 'frame-src' was not explicitly set, so 'default-src' is used as a fallback.

Refused to load the frame 'https://www.facebook.com/dialog/oauth?client_id=xxxxxxxxxxx&response_type=…4%26domain%3D<extension-id>%26relation%3Dparent&sdk=joey' because it violates the following Content Security Policy directive: "default-src https://connect.facebook.net/ https://s-static.ak.facebook.com/connect/ 'self' 'unsafe-eval'". Note that 'frame-src' was not explicitly set, so 'default-src' is used as a fallback.

I know 'unsafe-inline' is not allowed anymore, so is there a way to make the fs-jssdk in a chrome extension to work?

Any help will be greatly appreciated!

obs: I was able to fetch the results from FB directly in the browser, but not in the extension.

Upvotes: 2

Views: 1587

Answers (1)

sheerun
sheerun

Reputation: 1794

You can enable styles and frames with following:

"content_security_policy": "default-src 'self' 'unsafe-eval' chrome-extension-resource: https://*.facebook.net https://*.facebook.com; style-src 'self' 'unsafe-inline' chrome-extension-resource: https://*.facebook.net https://*.facebook.com; frame-src 'self' 'unsafe-inline' chrome-extension-resource: https://*.facebook.net https://*.facebook.com",

but I'm not sure how to get rid of Refused to load the frame 'http://static.ak.facebook.com(...) error. Google chrome's CSP disallows allowing http:// domains, and without it there's no inframe communication so for example automatic resizing won't work.

Upvotes: 1

Related Questions