Content Security Policy and Remote Scripts

By Akbar 2 min read 6 comments

Google Chrome is targeting toward more secure web, and one of the major step in this is by also enforcing Content Security Policy at the Chrome Extensions level. This is enabled in all the manifest version 2 Extension, and the manifest version 1 is slowly being phased out (you get warning about it being deprecated soon when installing it).

This new policy applies two of the following main limitations on the content scripts:
– Inline JavaScript will not be executed
– Only local script and and object resources are loaded

For more details on this, please check:
http://developer.chrome.com/trunk/contentSecurityPolicy.html

I was working on upgrading my Dynamic Language Tools extension, and though applying first rule of using the Inline scripts was comparatively easy (for tips and pitfalls on this, please check JavaScript eval function and Content Security Policy). But I found the other policy “Only local script and and object resources are loaded” was quite limiting and confusing. I was using the Google AJAX APIs in my extension, and since these are just the JavaScript files, I can download them and integrate most of them directly in the extension, but then this would mean that I will have to update my extension with every update of Google API. This is something which I hate most.

I was using the following code in my extension background page:

And as I was afraid, when I run the extension after upgrading the manifest to version 2, it throw the following error:

Refused to load the script ‘http://www.google.com/jsapi’ because it violates the following Content Security Policy directive: “script-src ‘self'”.

After doing some research, I found that it’s possible to load remote scripts too (phew!), but with two conditions:
– It must be served on the HTTPS.
– You need to explicitly add this relaxation in the manifest file.

Both of the steps were quite easy for me. For the first, I simply changed the script source from “http://www.google.com/jsapi” to “https://www.google.com/jsapi”, and then added the following line in the manifest file:

"content_security_policy": "script-src 'self' https://www.google.com; object-src 'self'",

Which simply means that I’m allowing it to load the scripts from extension local folder, and from www.google.com. Simply reload the extension after doing these changes and you are good to go.

Tags

Feedback & Comments

6 Responses

  1. Ramkumar

    Hi syed,
    I’m facing a different problem on the same context, can you help me? here is the error I
    got

    Refused to load the script ‘http://www.google.com/inputtools/request?text=nn&ime=transliteration_en_ta&num=5&cp=0&cs=0&ie=utf-8&oe=utf-8&app=jsapi&uv&cb=_callbacks_._0hcyisysd’ because it violates the following Content Security Policy directive: “script-src ‘self’ https://www.google.com/“.

    Reply
    • syedgakbar

      Kumar,

      The problem is that you are trying to load script from the “http://www.google.com/” address, but as you can see it’s not on HTTPS. According to new extension policy, you can only load scripts from over a secure protocol i.e. https.

      Regards, Akbar

      Reply
  2. Zafar

    Thanks a lot Sayed. That really helped me out to resolve that issue, however, now I am getting new error. Could you please visit this post http://stackoverflow.com/questions/13245251/google-maps-api-does-not-work-in-google-chrome-extension

    Reply
    • syedgakbar

      Zafar,

      Thanks, I’m glad that my replies were of help. Regarding the latest issue, this looks like an inline code evaluation problem. I have discussed something similar in following thread:
      http://blog.syedgakbar.com/2012/08/23/javascript-eval-function-and-content-security-policy/

      I would recommend going through this. If this doesn’t help, can you please share the exact line in your source code which is throwing the error (from your error description, it looks like it’s line#41). I can then suggest you something based on that.

      Reply
  3. Zafar

    Thanks Akbar for helping. Now I am getting a new error after following what you said. Could you please revisit above post on stackoverflow?

    Reply
  4. Zafar

    Hello Akbar,

    I am also working on a google chrome extension and facing CSP problem. Could you please help me out? I also asked the same question on stackoverflow.com here is the link http://stackoverflow.com/questions/13228825/google-maps-api-script-does-load-due-to-content-security-policy/13228902#comment18019613_13228902

    Reply

Leave a Reply