“Origin null is not allowed by Access-Control-Allow-Origin” : Google Chrome

Question

I am trying to learn D3.js javascript library. When I try to run the below code I get "Origin null is not allowed by Access-Control-Allow-Origin" error. Source file and the file I am trying to load (bolliger-mabillard.csv) are both in same folder. I am running it on Mac using Google Chrome. How do I force Chrome to load this csv file ?

function init() {

    d3.csv("http://localhost/~vikalpjain/bolliger-mabillard.csv",function(data){
        vis.append("svg:g")
        .attr("class", "x axis")
        .attr("transform","translate(0," + (h-MARGINS.bottom) + ")")
        .call(xAxis);

        vis.append("svg:g")
        .attr("class" ,"y axis")
        .attr("transform", "translate(" + (MARGINS.left) + ",0)")
        .call(yAxis);

        update ();
    })

Answer 1

If you're running your example on your own server try to replace localhost by 127.0.0.1, this is because the domain name has to be exactly the same to the server you are querying.