Getting a remote CSV file and putting it into a variable

Question

I have a simple javascript script, and I want to use a CSV file present in a remote url (for instance https://not-my-domain.com/test.csv) in it.

I don't need to parse the CSV, just to get it as a simple string. I've tried:

    function getCSV() {
        var file = "https://not-my-domain.com/test.csv";
        var rawFile = new XMLHttpRequest();
        var allText;

        rawFile.open("GET", file, false);
        rawFile.onreadystatechange = function () {
            if(rawFile.readyState === 4)
                if(rawFile.status === 200 || rawFile.status == 0)
                    allText = rawFile.responseText;
        };

        rawFile.send();
        alert(allText); //UNDEFINED!
        return allText;
   }

But somehow the allText is still undefined after the function has terminated. If you could assist me in this little issue I'd be glad.

You're trying to alert the contents before the file has finished loading. — Andy, May 12 '15 at 13:22
Ok, I suspected so. How can I block the program until it's done loading? — matan129, May 12 '15 at 13:23
Consider putting `alert` (or doing any other necessary processing) inside `onreadystatechange`, otherwise it can fire before the Ajax request completes. — Vadim Landa, May 12 '15 at 13:23
Cool, thanks. But obviously I want to do more complex stuff in this function. If I understand correctly, AJAX is async. So can I do some sort of callback function that will block the operation of the script? — matan129, May 12 '15 at 13:27
If file you want to get is on server with different domain then it will not work. Read about Same Origin Policy - http://en.wikipedia.org/wiki/Same-origin_policy — Kris Jaklik, May 12 '15 at 13:27

score 1 · Answer 1 · answered May 12 '15 at 13:29

1

use a lambda for an easy callback. You'll need a proxy to fetch the remote domain csv, or be sure it has cors enabled.

function getCSV(func) {
        var file = "https://not-my-domain.com/test.csv";
        var rawFile = new XMLHttpRequest();
        var allText;

        rawFile.open("GET", file, false);
        rawFile.onreadystatechange = function () {
            if(rawFile.readyState === 4)
                if(rawFile.status === 200 || rawFile.status == 0)
                    allText = rawFile.responseText;
                    if(func!=undefined && typeof(func) == "function"){
                        func(allText);
                     }
        };

        rawFile.send();


}


getCSV(function(contents){
  alert(contents);
})

answered May 12 '15 at 13:29

Radio

2,810
1
21
43

OK, it seems more logical to me, thanks. But now it shows empty alert window, probably because of the same-origin policy. I want to mention that this script is client-side, so how that corresponds with the policy? – matan129 May 12 '15 at 13:37
local host behavior depends on the browser. – Radio May 12 '15 at 13:38
Right. So what is the a universal way to just load a file into a string? – matan129 May 12 '15 at 13:40
It's more complex than that. It depends on if the file is remote on a server, or the file is local on your machine. If everything is local on your machine, then see http://stackoverflow.com/questions/4819060/allow-google-chrome-to-use-xmlhttprequest-to-load-a-url-from-a-local-file/4819114#4819114 if the csv is indeed remote, you still need CORS or a proxy. Presumably if you're on local host you have apache or the like running and you could run your own python/php or what have you to proxy the csv to local. Otherwise it's the same as if your javascript were on a domain name, CORS is required. – Radio May 12 '15 at 13:44

Getting a remote CSV file and putting it into a variable

1 Answers1