4

:)

I am loading a Chrome into Facebook and I do a simple JQuery GET request to my own website. I get the following error in the console when the GET request is called...

"Refused to connect to 'https://www.istyla.com/Popup/t2.php' because it violates the
following Content Security Policy directive: "connect-src https://*.facebook.com 
http://*.facebook.com https://*.fbcdn.net http://*.fbcdn.net *.facebook.net 
*.spotilocal.com:* https://*.akamaihd.net ws://*.facebook.com:* http://*.akamaihd.net"."

This happened all of a sudden. It worked yesterday...

Here is part of my Chrome Extension Manifest with the CSP definition:

"content_security_policy": "default-src 'self'; script-src 'self'; object-src 'self'; connect-src *"

Here is my GET request (loaded via a content script - JQuery is also loaded as a seperate content script):

$.get("https://www.istyla.com/Popup/t2.php" + c, function (d) {
    //do my other stuff here
}

By the way... t2.php does allow all origins. Is it Facebook that set a CSP on their site?? What can I do to connect to my URL via JQuery GET?

Thanks for any advice... :)

Jacques Blom
  • 1,794
  • 5
  • 24
  • 42
  • I noticed that with my extension as well today. It seems like Facebook has set a CSP via an HTTP reponse header: X-WebKit-CSP. I don't know if it's here to stay, but it's going to break a lot of user scripts. – Romanito Dec 07 '12 at 17:45
  • 2
    Two ways to solve it: 1. Remove the header using the `webRequest` API. This is a big hammer, don't use it. 2. Move the AJAX handling to the background page (basically in the same way as how you had to implement cross-origin AJAX request before Chrome 13). – Rob W Dec 07 '12 at 18:32
  • @rob-w If there's a background.js that sets up the environment and saves a bit of data to the local storage and then loads a doStuff.js upon a button click, and all of the AJAX calls are in doStuff.js, what's the best way to move the calls into background.js and still have doStuff.js be able to execute those calls? – Chris F Dec 07 '12 at 22:34
  • @ChrisF Implement message passing. Sync AJAX is asynchronous, you shouldn't have any issues with implementing this. – Rob W Dec 07 '12 at 22:40
  • @rob-w Thanks for the workaround! (#2 obviously) – Romanito Dec 07 '12 at 23:37

2 Answers2

4

I had the same issue with my script. I moved all my AJAX calls to a background script.

Dan
  • 224
  • 2
  • 11
  • 1
    You guys can just use Chrome message passing to send data between the Content Script and Background Page. More info at: http://developer.chrome.com/extensions/messaging.html – Jacques Blom Dec 16 '12 at 10:33
-3

I think a direct .get would not work cross-domain. Can you try using $.jsonp. http://www.jquery4u.com/json/jsonp-examples/

Neeraj
  • 8,408
  • 8
  • 41
  • 69
  • 2
    This answer is incorrect: JSONP does not work within a Chrome extension. In the context of Content scripts, this is caused by mismatching execution contexts, in background/options/popup/etc pages, this is caused by the Content Security policy. – Rob W Dec 07 '12 at 17:37
  • 1
    I don't need to try this specific example, because I know that the used techniques are failing by definition. In my comment, I explained why it fails (example of [mismatching context](http://stackoverflow.com/questions/13099404/chrome-uncaught-referenceerror-jquery-is-not-defined) and [CSP documentation which supports my second statement](http://developer.chrome.com/extensions/contentSecurityPolicy.html#resourceLoading)). – Rob W Dec 07 '12 at 17:54