Note that there are some explanatory texts on larger screens.

plurals
  1. POCircumventing Chrome Access-control-allow-origin on the local file system?
    primarykey
    data
    text
    <p>I've read the other same origin policy topics here on SO, but I haven't seen any solutions related to the local file system.</p> <p>I have a web app (In a loose sense of the word) that must be local served. I am trying to load a large amount of data in after the user has loaded the page, depending on what they are doing on the webpage. In Firefox 3.5 and IE8 I am able to use jQuery's AJAX() and GetScript() methods to do this, but in Chrome this fails due to the Same Origin Policy. </p> <blockquote> <p><code>XMLHttpRequest</code> cannot load <code>file://test/testdir/test.js</code>. Origin <code>null</code> is not allowed <code>by Access-Control-Allow-Origin</code>.</p> </blockquote> <p>This happens when I do something simple like</p> <pre><code>$.getScript("test.js"); </code></pre> <p>This functions perfectly well in IE &amp; Firefox.</p> <p>After reading a bunch about this, I decided to try writing directly into the head of the document. In the console in Chrome I typed the following:</p> <pre><code>var head = document.getElementsByTagName("head")[0]; var script =document.createElement('script'); script.id = 'uploadScript'; script.type = 'text/javascript'; script.src = "upload.js"; head.appendChild(script); </code></pre> <p>This works fine when pasted in the console- the <code>&lt;script...test.js&lt;/script&gt;</code> element is added to the head, evaluated, and content loaded into the DOM.</p> <p>I thought this was successful, until I put this code into a function call. The same exact code, when called from a function, adds the element to the but does not evaluate the JavaScript file. I can not figure out why. If I use Chrome's console to stop execution in the method that it is adding the element to the and run the above code, it does not evaluate it. However, if I unpause the execution and run the exact same code (pasting it in the console window) it works. I'm at a loss to explain this. Has anyone dealt with this before?</p> <p>I've read up on the following SO posts, but they are not describing the problem that I have: </p> <p><a href="https://stackoverflow.com/questions/3076414/ways-to-circumvent-the-same-origin-policy">Ways to circumvent the same-origin policy</a><br> <a href="https://stackoverflow.com/questions/4208530/xmlhttprequest-origin-null-is-not-allowed-access-control-access-allow-for-file">XMLHttpRequest Origin null is not allowed Access-Control-Allow-Origin for file:/// to file:/// (Serverless)</a><br> <a href="https://stackoverflow.com/questions/395045/cross-site-xmlhttprequest">Cross-site XMLHttpRequest</a></p> <p>Again, my last resort is to load all the data at the webpage's load- This can cause up to a 10 second delay in loading the webpage that is unnecessary for 90% of the app's users.</p> <p>Thanks for any suggestions/alternatives!!!</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload