Does cross-site XHR work from chrome-extension URL iframes?

[johnjbarton]

I get
XMLHttpRequest cannot load http://127.0.0.1:8686/test/demo.js. Origin chrome-extension://oindiebjcijgbooaoomjajlicekemeea is not allowed by Access-Control-Allow-Origin.

When I have a manifest with :
"permissions" :
[
"debugger",
"<all_urls>"
],

I also tried various permutations of "http://*/".

My request originates from an iframe (in chrome devtools). Should it work?

Thanks,
jjb

[CGS]

Hi,

You can load external scripts only in tabs/windows (not in background page, not popup in page). To do so, you need to set permissions to tabs as well. Also, I would recommend to use document.createElement('script') setting the attribute src to whatever javascript file and appended as a child to document.head or document.body (you can use any DOM element for that matter) instead of AJAX requests (at least it works just fine for me). To insert the script, Tabs and programmatic injection from the documentation (http://developer.chrome.com/extensions/tabs.html and http://developer.chrome.com/extensions/content_scripts.html).

CGS

--
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/-/U33r217_Px8J.
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.

[John J Barton]

On Thu, Aug 23, 2012 at 7:22 PM, CGS <cgsmc...@gmail.com> wrote:

Hi,

You can load external scripts only in tabs/windows (not in background page, not popup in page). To do so, you need to set permissions to tabs as well.

Thanks, but I don't understand what this means. I have an extension with no tabs, windows, background or popup pages. I am using devtools extension which puts a chrome-extension:// url into an iframe.  

 

Also, I would recommend to use document.createElement('script') setting the attribute src to whatever javascript file and appended as a child to document.head or document.body (you can use any DOM element for that matter) instead of AJAX requests (at least it works just fine for me). To insert the script, Tabs and programmatic injection from the documentation (http://developer.chrome.com/extensions/tabs.html and http://developer.chrome.com/extensions/content_scripts.html).

My goal is to re-compile the .js file to support ES6 features and Querypoint debugging. Therefore I need to access the XHR response first, then insert the script result or eval it in the page.

jjb

[Jim Klo]

See inline:

On Aug 24, 2012, at 9:58 AM, John J Barton wrote:

On Thu, Aug 23, 2012 at 7:22 PM, CGS <cgsmc...@gmail.com> wrote:

Hi,

You can load external scripts only in tabs/windows (not in background page, not popup in page). To do so, you need to set permissions to tabs as well.

Thanks, but I don't understand what this means. I have an extension with no tabs, windows, background or popup pages. I am using devtools extension which puts a chrome-extension:// url into an iframe.  

When you do this... you need to place each resource that's being accessed from the IFrame in the "web_accessible_resources" section of the manifest, at least that's what I had to do to make pages load using the internal chrome:// resource path.

 

Also, I would recommend to use document.createElement('script') setting the attribute src to whatever javascript file and appended as a child to document.head or document.body (you can use any DOM element for that matter) instead of AJAX requests (at least it works just fine for me). To insert the script, Tabs and programmatic injection from the documentation (http://developer.chrome.com/extensions/tabs.html and http://developer.chrome.com/extensions/content_scripts.html).

My goal is to re-compile the .js file to support ES6 features and Querypoint debugging. Therefore I need to access the XHR response first, then insert the script result or eval it in the page.

You won't be able to eval. The CSP prevents that, and Chrome ignores all directives to override, AFAIK.  You can only parse XHR responses to pass data models.

[John J Barton]

On Fri, Aug 24, 2012 at 10:21 AM, Jim Klo <jim...@sri.com> wrote:
> See inline:
>
> On Aug 24, 2012, at 9:58 AM, John J Barton wrote:
>
>
>
> On Thu, Aug 23, 2012 at 7:22 PM, CGS <cgsmc...@gmail.com> wrote:
>>
>> Hi,
>>
>> You can load external scripts only in tabs/windows (not in background
>> page, not popup in page). To do so, you need to set permissions to tabs as
>> well.
>
>
> Thanks, but I don't understand what this means. I have an extension with no
> tabs, windows, background or popup pages. I am using devtools extension
> which puts a chrome-extension:// url into an iframe.
>
>
> When you do this... you need to place each resource that's being accessed
> from the IFrame in the "web_accessible_resources" section of the manifest,
> at least that's what I had to do to make pages load using the internal
> chrome:// resource path.

Thanks, but web_accessible_resources allows extension resources to be
exported by an extension to a Web page. In my case I want to import a
Web resource into an extension.

>
>
>>
>> Also, I would recommend to use document.createElement('script') setting
>> the attribute src to whatever javascript file and appended as a child to
>> document.head or document.body (you can use any DOM element for that matter)
>> instead of AJAX requests (at least it works just fine for me). To insert the
>> script, Tabs and programmatic injection from the documentation
>> (http://developer.chrome.com/extensions/tabs.html and
>> http://developer.chrome.com/extensions/content_scripts.html).
>
>
> My goal is to re-compile the .js file to support ES6 features and Querypoint
> debugging. Therefore I need to access the XHR response first, then insert
> the script result or eval it in the page.
>
>
> You won't be able to eval. The CSP prevents that, and Chrome ignores all
> directives to override, AFAIK. You can only parse XHR responses to pass
> data models.

Thanks but this is not an issue for me. I can eval in a sandboxed
iframe or in the web page itself.

My issue is to be able to use cross-side XHR in an iframe with a
chrome-extension:// url given that I have set the permissions to allow
such access for the extension.

jjb

[Mihai Parparita]

The whitelisting for cross-origin XHRs only happens when running in an extension process. Your iframe is running inside the devtools process, so it doesn't get that privilege. You'll need to use the messaging API to ask the extension's background page to fetch the URL and send the response back to the iframe.

Mihai

--

[John J Barton]

On Fri, Aug 24, 2012 at 10:46 AM, Mihai Parparita <mih...@chromium.org> wrote:

The whitelisting for cross-origin XHRs only happens when running in an extension process. Your iframe is running inside the devtools process, so it doesn't get that privilege. You'll need to use the messaging API to ask the extension's background page to fetch the URL and send the response back to the iframe.

Thanks Mihai, I have been using this workaround for some time and, other than extra work and code, it worked ok for me.

Until today...now I need to some ... gasp ... XML over XMLHttpRequest. The problem now is that the XHR is in the background process so if I use the recommended procedure of accessing the requestXML,

https://developer.mozilla.org/en-US/docs/DOM/XMLHttpRequest

then the document will be built in the background process, not in my devtools process. How can I get the requestXML result over postMessage?

jjb

[John J Barton]

Thanks for your suggestion. However it appears that Cross-site XHR only works for GET,  POST, and (experimentally) PUT. 

Concretely I get an error message ending:

Origin chrome-extension://klmlfkibgfifmkanocmdenpieghpgifl is not allowed by Access-Control-Allow-Origin.  

Based on reading about the Access-Control-Allow-Origin, here is what I think is happening:

When I issue XHR with PROPFIND (to read the directory from a WebDAV server), then the browser sends OPTIONS first:

  https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS

In the request headers will include:

Access-Control-Request-Headers:

origin

meaning that the browser wants the server to reply with a CORS header like:

Access-Control-Allow-Headers: origin 

However, the WebDAV server does not know about CORS, so it does not supply this response header. Consequently the browser issues 

Origin chrome-extension://klmlfkibgfifmkanocmdenpieghpgifl is not allowed by Access-Control-Allow-Origin.

Sadly this makes no sense. The same browser/server pair will allow PUT. So CORS forbids me from reading the directory with PROPFIND, but allows me to write files on the server all day long. And if I issue GET for the directory the server will list the directory for me, just not in a standardized format!  So I guess I will write yet another page scraper to get the job done. 

The countless hours I spent working around these security features are especially frustrating because I have no reason to believe they actually do anything useful in real life.

jjb

On Wed, Jan 2, 2013 at 9:15 PM, Mihai Parparita <mih...@chromium.org> wrote:

You should be able to send back the responseText, and then use DOMParser (https://developer.mozilla.org/en-US/docs/DOM/DOMParser) to paste it in an XML DOM in the devtools process.

Mihai

[John J Barton]

Well after a lovely day exploring jsDAV to try to add CORS headers I eventually determined that the server has nothing to do with this problem. (I also relearned again why WebDAV failed to gain dev support ;-).

If I issue an xhr GET request for 

  http://localhost:8686/test/qpd.html

then the background/cross-site hack works great. I've been doing this for some months now.

However, if I issue an xhr GET request for 

   http://localhost:8686/test/

or

   http://localhost:8686/test

I don't think the server ever sees the request. (If I use the same URLs in the browser the result is a directory listing.) 

I believe it fails in the browser with the bogus error message. I believe the error message should have been "manifest.json permissions do not allow XMLHttpRequest to <url>".

I opened:

https://code.google.com/p/chromium/issues/detail?id=168302

jjb

[John J Barton]

On Wed, Jan 2, 2013 at 9:15 PM, Mihai Parparita <mih...@chromium.org> wrote:

You should be able to send back the responseText, and then use DOMParser (https://developer.mozilla.org/en-US/docs/DOM/DOMParser) to paste it in an XML DOM in the devtools process.

Unfortunately Chrome seems buggy on DOMParser as well.

new DOMParser().parseFromString("<html><head></head><body></body></html>", "text/html");

gives null.  (no error messages, just null return value). It works in Firefox. 

If I lie and pass "text/xml", then I get a document. But I think a better approach is this one hidden further down the page you cite:

var doc = document.implementation.createHTMLDocument("");
doc.body.innerHTML = html;

jjb