3

When reading a CSV file from a server using the jQuery 'GET' function I do not get any data. When I look at the code using FireBug I can see the GET request is sent and the return value is '200 OK'. Also I see that the header is returned correctly so the request is definitely made, and data is returned. This is also what I see in Wireshark. Here I see the complete contents of the CSV file is returned as a standard HTTP response.
But the actual data is not there in my script. Firebug shows an empty response and the 'success' function is never called. What could be wrong ?

EDIT: An essential part of information appeared to be missing from my question. The following code runs on my local machine and is started by Aptana Studio in Firefox using the built-in test server.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>       
        <title>New Web Project</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script src="jquery.js" type="text/javascript" charset="utf-8"></script>

       <script type="text/javascript">
        var csvData;
        $(document).ready(function() {
           $("#btnGET").click(function() {
                csvData = $.ajax({
                    type: "GET",
                    url: "http://www.mywebsite.com/data/sample_file.csv",
                    dataType: "text/csv",
                    success: function () {
                       alert("done!"+ csvData.getAllResponseHeaders())
                     }
                });
           });
        }) 
 </script>
 </head>   

     <body>
        <h1>New Web Project Page</h1>
        <button id="btnGET">GET Data</button>
    </body>
</html>
Cees Meijer
  • 742
  • 2
  • 8
  • 23

5 Answers5

2

The code does not work because I try to make a cross-domain GET. The page and script are hosted on my local machine and the GET tries to retrieve data from a totally different domain. Though technically possible it is blocked by all modern browsers because it is a security vulnerability.
Frederick Behrends pointed me in the right direction. And as he also mentions the only cross domain GET that is allowed is by using "jsonp".

Following text was taken from the jQuery documentation:
"Due to browser security restrictions, most "Ajax" requests are subject to the same origin policy; the request can not successfully retrieve data from a different domain, subdomain, port, or protocol. "

Cees Meijer
  • 742
  • 2
  • 8
  • 23
1
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>       
        <title>New Web Project</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script src="jquery.js" type="text/javascript" charset="utf-8"></script>

       <script type="text/javascript">
        var csvData;
        $(document).ready(function() {
           $("#btnGET").click(function() {
                csvData = $.ajax({
                    type: "GET",
                    url: "http://www.mywebsite.com/data/sample_file.csv",
                    dataType: "text/csv",
                    success: function (result) {
                       alert(result);
                       alert("done!"+ csvData.getAllResponseHeaders())
                     }
                });
           });
        }) 
 </script>
 </head>   

     <body>
        <h1>New Web Project Page</h1>
        <button id="btnGET">GET Data</button>
    </body>
</html>
Frederick Behrends
  • 3,075
  • 23
  • 47
  • Not sure what this tries to resolve ? I've added the 'alert(result);' but (as expected) nothing appears, since the 'success' function never called. – Cees Meijer Jul 10 '12 at 11:26
  • are you sure, the file exists and the url is http://en.wikipedia.org/wiki/Same_origin_policy valid? – Frederick Behrends Jul 10 '12 at 11:55
  • The file definitely exists. And as I already mentioned I see the contents of the file in Wireshark as it is is sent from the server to my client. I'm not sure that I fully understand the 'same origin policy', but the client is obviously local on my PC and the data is on a remote web-page. Could that really be a problem ? I see websites getting data from other sites all the time. – Cees Meijer Jul 10 '12 at 12:03
  • this could be a problem, try to set the dataType to 'jsonp' – Frederick Behrends Jul 10 '12 at 12:19
  • Although it still does not work it seems solve the problem of getting the data. The 'success' function is still not called, but in Firebug I now get a parsing error on the actual text of the CSV file. – Cees Meijer Jul 10 '12 at 12:49
1

As my understanding dataType only accepts "text" as parameter, may be you can have a go? You can refer to following page as well: http://api.jquery.com/jQuery.ajax/

Thanks.

Tim
  • 45
  • 5
  • Nope. I actually started out with 'text 'only, but that did not work either. Also tried without this specifier, but that does not work either. – Cees Meijer Jul 10 '12 at 11:22
0
                $.ajax({
                    type: "GET",
                    url: "http://www.mywebsite.com/data/sample_file.csv",
                    dataType: "text/csv",
                    success: function (data) {
                       csvData = data;
                       //alert("done!"+ csvData.getAllResponseHeaders()) - my fix makes this won't work...
                     }
                });
djmati11
  • 597
  • 5
  • 18
-1

I tried commenting out dataType and it has worked.