4

I have a web page that serves as a configuration editor, which means that it will be accessed by opening the .html file and not using http.

This page needs to access to another file (the configuration file to be edited), located in the same directory. The file is accessed using a relative path General.json.

            var getJSONFileContent = function( url ) {
                return $.ajax({
                    type: "GET",
                    url: url,
                    async: false
                }).responseText;
            };

            var currentConfigAsJson = getJSONFileContent( "General.json" );

It works perfectly on Firefox, without changing settings or anything, but it fails on both IE and chrome.

Chrome error:

file:///C:/Users/XXX/Desktop/XXX/General.json.
Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.m.ajaxTransport.send 
@ jquery-1.11.3.min.js:5m.extend.ajax
@ jquery-1.11.3.min.js:5getJSONFileContent
@ General.html:68(anonymous function)
@ General.html:75m.Callbacks.j
@ jquery-1.11.3.min.js:2m.Callbacks.k.fireWith
@ jquery-1.11.3.min.js:2m.extend.ready
@ jquery-1.11.3.min.js:2J
@ jquery-1.11.3.min.js:2

Internet Explorer error:

SCRIPT5: Access denied.
Fichier : jsoneditor.min.js, line : 7, column : 8725

I read that this is forbidden on Chrome (and probably IE and others) for security reasons, and that I have to start chrome with special arguments to bypass this.

But why is it working on Firefox? Is there a way to make it work on Chrome without passing special arguments when running chrome ?

Are there Chrome specific features that would allow me to read/write files without having to change settings or pass arguments ? An-end user wouldn't want to bother with that.

Cœur
  • 32,421
  • 21
  • 173
  • 232
Virus721
  • 7,156
  • 8
  • 49
  • 110
  • possible duplicate of [Disable same origin policy in Chrome](http://stackoverflow.com/questions/3102819/disable-same-origin-policy-in-chrome) – Hacketo Jul 28 '15 at 09:54
  • Every browser have their own local-files protection policy. You can change it: https://wiki.fluidproject.org/display/fluid/Browser+settings+to+support+local+Ajax+calls – Krzysiek Jul 28 '15 at 09:54
  • 1
    Chrome doesn't allow ajax running off `file:` – lshettyl Jul 28 '15 at 09:54

1 Answers1

1

  • To solve the origin issue, set up a web server and host your page via localhost.

  • If you are releasing an HTML based app, you would probably include a web server in your app.

  • Another approach is to give a try on NW (formerly NodeWebkit) which includes a Chromium with very high authorities that allows you to do the job.

It's rather opinion based to assume the reason why this works and that doesn't. But Chrome and IE are products belong to some company, while Firefox is supported by Mozilla foundation. So it makes sense that commercial companies acting much more sensible on security issues for their interests. Meanwhile, Mozilla foundation would like to be more experimental on techniques, regarding Brendan Eich (the creator of JavaScript) is a big one in Mozilla.

Leo
  • 11,955
  • 4
  • 37
  • 58
  • Thanks for your help. Though in my context i can't really ask a end-user to setup a web server just to edit a configuration file. That's why i was looking for a programatical way ofdoing that. – Virus721 Jul 28 '15 at 10:23
  • @Virus721 You could try the second and third approaches in my answer. I personally prefer NW. – Leo Jul 28 '15 at 10:26