Content security policy blocking reCaptcha inside either popup.html or dynamically inserted via AJAX from popup.js?

[trichomes]

Like the title says I'm developing an extension which loads comments and allows user input of comments. I don't want to get spammed by bots (however unlikely that they would take an interest in my shitty little extension...), so I'm still stuck at the first stage described by the recaptcha page: "making the recaptcha image show up", using either method:

• The Standard Challenge and Non-JavaScript API, or
• The reCAPTCHA AJAX API
  
  I will discuss the first method first.
  Following the instructions of the first link and what I understood from reading the page, I used the html/script block they supplied:
  

   <script type="text/javascript"
       src="http://www.google.com/recaptcha/api/challenge?k=your_public_key">
    </script>
    <noscript>
       <iframe src="http://www.google.com/recaptcha/api/noscript?k=your_public_key"
           height="300" width="500" frameborder="0"></iframe><br>
       <textarea name="recaptcha_challenge_field" rows="3" cols="40">
       </textarea>
       <input type="hidden" name="recaptcha_response_field"
           value="manual_challenge">
    </noscript>
  
  I either can paste this (with the proper substitutions) in popup.html, or load a new tab containing the same block of code above (using chrome.tabs.create ({url:"comment_page.html"})) when a user clicks a "post" button in the extension's popup.html (the button's action being inserted by popup.js after the document loads). In both cases all I get rendered is the textArea object in the form. 

  Inspecting the error console of the page I can see:

  "Refused to load script from 'http://www.google.com/recaptcha/api/challenge?k=6LfQQ9ESAAAAANwAZoEvBaCnQhXBdXxUOJ7YD0_g' because of Content-Security-Policy."

  In my extension's manifest.json I have:

  "permissions": ["*://*.google.com", "tabs", "comment_page.html", ...
  

  So shouldn't it not be refusing to load script from 'http://www.google.com/recaptcha/api/....?
  
  Also note that in the case that I load "comment_page.html" (package-local html page opened as a tab in above attempt) via file:///home/username/code/proj/commentextension/comment_page.html, since it isn't being associated with the Content Security Policy of my extension, it loads and displays the whole captcha fine.

  In the second case, if I use the AJAX code
   Recaptcha.create("your_public_key",
      "element_id",
      {
        theme: "red",
        callback: Recaptcha.focus_response_field
      }
    );
  
  to attempt to insert a recaptcha into a div with a certain id in either my popup.html or a new tab, again fails with the same complaint about content security policy coming from some recaptcha-associated url which should be allowed, because of:
  "permissions": ["*://*.google.com",...  
  in manifest.json ?
  
  
  
  I've not seen much discussion on this in some very extensive googling. Is there something totally fundamental I'm missing, making my whole quest for recaptcha in an extension totally ridiculous?

[Mihai Parparita]

On Thu, May 10, 2012 at 10:35 AM, trichomes <trichome.t...@gmail.com> wrote:

• "Refused to load script from 'http://www.google.com/recaptcha/api/challenge?k=6LfQQ9ESAAAAANwAZoEvBaCnQhXBdXxUOJ7YD0_g' because of Content-Security-Policy."

You'll need to switch the <script src=""> tag to use https (i.e. https://www.google.com/recaptcha/api/challenge?k=your_public_key), and then add https://www.google.com/ to the allowed list of places that script can be loaded from (see http://code.google.com/chrome/extensions/trunk/contentSecurityPolicy.html#H2-3)

 

• In my extension's manifest.json I have:

  "permissions": ["*://*.google.com", "tabs", "comment_page.html", ...
  
  

  So shouldn't it not be refusing to load script from 'http://www.google.com/recaptcha/api/....?

The permissions list is separate from the list of places that your extension can load script from (specified via the content_security_policy permission). The intention behind content_security_policy is to make sure that your extension isn't loading/executing script that you didn't intend (so that, even if you have an escaping bug, a malicious attacker can't use it to inject their script into your extension).

Mihai

[contentsecuritypolicyhell?]

Unfortunately I've tried adding (variously) to manifest.json:

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

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

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

and my script tag now reads     <script type="text/javascript" src="https://www.google.com/recaptcha/api/js/recaptcha_ajax.js"></script>

and yet i'm still seeing the error Refused to load script from 'https://www.google.com/recaptcha/api/js/recaptcha_ajax.js' because of Content-Security-Policy.
Thank you for responding. Is there something more for me to do?

[Mihai Parparita]

On Tue, May 15, 2012 at 8:07 AM, contentsecuritypolicyhell? <trichome.t...@gmail.com> wrote:

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

You almost had it. The correct value is:

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

(the url has no trailing slash)

Mihai

 

--
You received this message because you are subscribed to the Google Groups "Chromium-extensions" group.

To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msg/chromium-extensions/-/9ehwtw20mpMJ.

To post to this group, send email to chromium-...@chromium.org.
To unsubscribe from this group, send email to chromium-extens...@chromium.org.
For more options, visit this group at http://groups.google.com/a/chromium.org/group/chromium-extensions/?hl=en.

[Mihai Parparita]

On Wed, May 16, 2012 at 9:09 PM, Mihai Parparita <mih...@chromium.org> wrote:

(the url has no trailing slash)

BTW, I've filed http://crbug.com/128493 to add a warning for cases like this one.

Mihai

[contentsecuritypolicyhell?]

Thanks for adding that, and thank you for responding, Mihai. Unfortunately, upon changing my content security policy to be without the trailing slash, I now recieve: 

Refused to load script from 'chrome-extension://www.google.com/recaptcha/api/challenge?k=6LfQQ9ESAAAAANwAZoEvBaCnQhXBdXxUOJ7YD0_g&ajax=1&cachestop=0.8741280881222337' because of Content-Security-Policy.
The line in my popup.html for script is

    <script type="text/javascript" src="https://www.google.com/recaptcha/api/js/recaptcha_ajax.js"></script>

and my manifest.json file is, again:

{

"name": "comments everywhere",

"version": "1.0",

"description": "view an unmoderated comment section on any page",

"browser_action": {"default_icon": "anonymous.jpg",

 "default_popup": "popup.html",

 "default_title": "freedom, freedom everywhere"},

"permissions": ["https://www.google.com/*"],

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

"manifest_version": 2

}

Basically I would like to make an extension that can allow users to post comments related to a web page in a way that is not moderated by the webpage owner, to avoid censorship and encourage the free expression. The comments are stored on a server (for now, a free hosting website), and can be retrieved based on the website being viewed to show only the comments related to that website. I would like to include a recapcha field to stop spamming of fake comments as we see on blogs which don't implement recaptcha. 

Does the above error message help at all? Thank you for your time.

[Mihai Parparita]

The reCaptcha AJAX API seems to use scheme-relative URLs, which don't quite work when inside an extension page. The relative URL "//www.google.com" gets resolved against the current page's URL ("chrome-extension://<id>/page.html"), and so it picks up the chrome-extension scheme, resulting in in the mangled URL that is described. You can try to work around this by adding a <base href="https://www.google.com/"> to the top of the page (but then you'll need to use explicit/absolute extension URLs for all extension resources that you reference).

Mihai

--

You received this message because you are subscribed to the Google Groups "Chromium-extensions" group.

To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msg/chromium-extensions/-/fGHTnQWBbg8J.