Using AJAX to read from local filesystem without a web server

Question

I tried doing this in a script tag of an HTML file, just to see if I could get it to work somehow:

<script>

    var file = '/Users/amills001c/suman/test/output/test1.txt';

    $.get(file);

</script>

I got an error, as expected:

XMLHttpRequest cannot load file:///Users/amills001c/suman/test/output/test1.txt. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

so my question is, is there any way to use AJAX to request files from the local filesystem without having a web server in place?

It seems possible, but sounds like I need to do some configuration. This is only for a local file and running a browser on my local workstation.

Think about the security issues behind this... Do you really think this would be possible? — Luke Joshua Park, Dec 11 '15 at 00:04
true, it looks possible if you start chrome with certain flags, or with firefox — Alexander Mills, Dec 11 '15 at 00:08
There are many similar questions here on SO, for example this one: http://stackoverflow.com/questions/30135589/how-in-javascript-jquery-or-ajax-such-can-i-load-a-local-text-file-or-xml — Marged, Dec 11 '15 at 00:22
@LukePark It *used* to be possible, and there are enough old web pages that talk about it. Heck, I ran into the issue very recently when I looked at an ancient project of mine. — Jeremy J Starcher, Dec 11 '15 at 00:31

score 0 · Answer 1 · answered Dec 11 '15 at 00:11

0

You should be able to do it if you run your main page from the file as well and enable browser to use local files. In chrome there is an option --allow-file-access-from-files which allows to do it.

answered Dec 11 '15 at 00:11

jonasnas

3,540
1
23
32

score 0 · Answer 2 · answered Dec 11 '15 at 05:58

Internet Explorer will load local files if ActiveX is enabled. This worked in Windows 10.

<html>
<head>
<script>
function readZeFile() {
  try {
    var oField = document.getElementById("z_file");
    var oFS = new ActiveXObject("Scripting.FileSystemObject");
    var oStream = oFS.OpenTextFile(oField.value, 1);
    var sContents = oStream.readAll();
    oStream.Close();
    document.getElementById("BoxFileContents").innerHTML = sContents;
  } catch (e) {
    window.alert(e);
  }
}
</script>
</head>
<body>

<input type="file" name="z_file" id="z_file" size="50" />
<input type="button" onclick="readZeFile()" value="Read ze file" />

<pre id="BoxFileContents" style="border: 1px dotted black; height: 10em; width: 500; overflow: scroll; ">
[Nothing loaded]
</pre>

</body>
</html>

score -1 · Answer 3 · answered Dec 11 '15 at 00:13

-1

You said web server so I'm not sure if you're excluding a local server in your question. But if you run a localhost server using node.js or python or whatever, you can indeed load files with AJAX since it's the same origin.

Not quite as convenient as just running index.html in your web browser, but here's a barebones HTTP server that works quite well for hosting local files. https://www.npmjs.com/package/http-server

answered Dec 11 '15 at 00:13

jered

11,220
2
23
34

yeah, this would work thanks, but it is a little more convenient just to have Chrome read a file – Alexander Mills Dec 11 '15 at 01:08
yeah, by web server, I meant any server, local or remote – Alexander Mills Dec 11 '15 at 01:20

score -3 · Answer 4 · answered Dec 11 '15 at 00:05

-3

Use a relative path:

var file = 'suman/test/output/test1.txt';
$.get(file);

answered Dec 11 '15 at 00:05

Saul Diaz

51
1
3

3

That won't work either. You can't use XMLHttpRequest for local files, end of story. – Dec 11 '15 at 00:06
@duskwuff if the server is running on a local host it would load the file since it's same origin would it not? – jered Dec 11 '15 at 00:09
Right, hence the relative path. – jered Dec 11 '15 at 00:14
@JCD No. There is no server involved at all; the page is being loaded directly from a file (i.e, the `file:` scheme), which is an exception to the same-origin policy. The path in the question is, in fact, already relative to `file:///`! – Dec 11 '15 at 00:15
We might be talking about different things because I'm talking specifically about a localhost serving HTTP here, not file:// scheme. – jered Dec 11 '15 at 00:15

Using AJAX to read from local filesystem without a web server

4 Answers4