jQuery Ajax request from local filesystem (Windows file:///)

Question

I'm trying to do an ajax request to get the contents of "http://localhost/" running on Windows Wamp Server.

The script is running from something like this:

file:///C:/my/path/index.html

I'm just using a standard $.ajax request to try and get the contents of localhost:

$.ajax({
          type: 'GET', 
          url: 'http://localhost/',
          success: function(data) {
            alert('success');
          }, error: function (data) {
            alert('failed');
          }
    });

I can't get it to be successful though... Seems to be some problem with the local filesystem or something. I'm not too sure.

Can you access the url directly? Do you get an error in the js console? — Adam Hopkinson, Mar 29 '11 at 08:06
@adam - Yes, accessing the url directly is fine. I get this error `Uncaught TypeError: Property 'responseText' of object # — Emmanuel, Mar 29 '11 at 08:09
@Emmanuel The second one is the error Chrome gives when you try an AJAX request from a `file:///` URL. — lonesomeday, Mar 29 '11 at 08:13
@lonesomeday - Yes, with a bit more googling I found the answer is to set a Access-Control-Allow-Origin header. See my post below... — Emmanuel, Mar 29 '11 at 08:15
@Emmanuel. To clarify, the error message you got is not the Chrome issue; Chrome issues a warning, but not the "cannot load" error. Chrome's message will start with "Unsafe JavaScript attempt to access frame with URL" — grantwparks, Apr 09 '13 at 18:54

score 17 · Accepted Answer · answered Mar 29 '11 at 08:15

17

Problem Solved!

I just had to add this header to my index.php file for http://localhost/

header('Access-Control-Allow-Origin: *');

Thanks for your help anyhow guys!

answered Mar 29 '11 at 08:15

Emmanuel

4,933
5
46
71

1

Hi Emmanual, I'm in the same situation as u are. But I don't have any server codes, I've used a database proxy server dbmojo [link](code.google.com/p/dbmojo/). My scripts are located in local file:// directory. Now how can I put header('Access-Control-Allow-Origin: *'); ? or is there any other solution? – iEamin Oct 14 '12 at 03:08
1

@iEamin I'm not sure exactly of your situation... perhaps the header "Access-Control-Allow-Origin" could be added via your apache (.htaccess) or other server config files? I'm not sure. I don't know of another way of doing cross-server/protocol requests like this. – Emmanuel Oct 16 '12 at 08:28

score 11 · Answer 2 · answered Mar 29 '11 at 08:00

You say that the script is running from a file:/// URL. It's best not to do AJAX requests from file URLs, because they are treated inconsistently. Chrome, for example, entirely disallows them.

However, your bigger problem here is the same-origin policy: you can only make AJAX requests to the same host as the web page itself. file:/// and http://localhost are not the same host (even if they are the same machine).

It's best to run everything off http://localhost.

Unforunately I think you're right :(. Probably good for security, but bad in my circumstances. — Emmanuel, Mar 29 '11 at 08:06

score 3 · Answer 3 · answered Mar 29 '11 at 07:59

3

This probably won't work, as the browser will think this is a cross-domain request. You've accessed the file via a file:// URL, but are trying to retrieve data from http://localhost. Try accessing your original file from http://localhost as well, and it'll probably start to work.

answered Mar 29 '11 at 07:59

Rob Williams

1,442
12
13

1

Yes, accessing it from http://localhost is fine. But basically what I'm trying to do with the file:/// script is to detect if wampserver is running by sending an ajax request and examining the results. – Emmanuel Mar 29 '11 at 08:05
1

@Emmanuel - your code above shows you using the url, but here you say you are using the file path. Which is it? – Adam Hopkinson Mar 29 '11 at 08:08
2

@adam - the ajax request is running from file:///etc... and trying to get the contents of url `http://:localhost/`. Anyhow, see below for the my answer... – Emmanuel Mar 29 '11 at 08:17

jQuery Ajax request from local filesystem (Windows file:///)

3 Answers3

Linked