加载JSON文件时,请求的资源上没有"Access-Control-Allow-Origin"标头

tij*_*les 7 json d3.js polymaps

我的数据集托管在我的保管箱帐户上,但不是托管它的Javascript文件.我正在使用D3和Polymaps来可视化数据,但是我得到一个错误 - "XMLHttpRequest无法加载https://www.dropbox.com/s/89adzt973quosda/solaruse.json.否'访问控制 - 允许 - 来源'标题出现在请求的资源上.因此,不允许原点'null'访问." (dropbox文件的链接有效,所以你可以看看)

这是我用来加载JSON文件的代码(我在本地开发网站)我不确定从这一点开始做什么.

var po = org.polymaps;
        //Create map object, append to #map
        var map = po.map()
            .container(d3.select("#map").append("svg").node())
            .zoom(4)
            .add(po.interact());
        // Add the CloudMade image tiles as a base layer…
        map.add(po.image()
            .url(po.url("http://{S}tile.cloudmade.com"
            + "/1a1b06b230af4efdbb989ea99e9841af" // http://cloudmade.com/register
            + "/998/256/{Z}/{X}/{Y}.png")
            .hosts(["a.", "b.", "c.", ""])));
        // Add the compass control on top.
        map.add(po.compass()
            .pan("none"));
        // Add the custom locations/acres
        d3.json("https://www.dropbox.com/s/89adzt973quosda/solaruse.json", function(data){
            // Insert layer beneath the compass.
            var layer = d3.select("#map svg").insert("svg:g", ".compass");
            // Add an svg:g for each Name.
            var marker = layer.selectAll("g")
                .data(d3.entries(data))
                .enter().append("svg:g")
                .attr("transform", transform);
            // Adding the circles
            marker.append("svg:circle")
            //function scraping the acres from the dataset
            .attr()
        });
Run Code Online (Sandbox Code Playgroud)

Jor*_*mer 1

问题

发生这种情况是因为 Dropbox 不允许通过其正常域进行跨源请求。有关跨源请求的更多信息,请参阅MDN CORS 文档。

解决方案

您应该能够使用Dropbox HTTP API(特别是获取文件资源)。或者,如果您想使用 JS 函数而不是 http 请求,则可以使用Dropbox JS api 。

或者,正如您在评论中提到的,您可以通过托管自己的 JS 文件来简单地避免 dropbox