XMLHttpRequest無法加載文件？

Question

d3.csv("result.csv", function(flights) { 
    var nestByDate = d3.nest() 
    .key(function(d) { return d3.time.day(d.date); }); 
    .......... 

當我試圖從web服務器上面運行d3.js代碼時，它通過加載csv文件正確執行d3.js。

，但是當我試圖如下所示運行d3.js，

d3.csv("D:\\Project Space\\D3Demo\\WebContent\\result.csv", function(flights) { 
    var nestByDate = d3.nest() 
    .key(function(d) { return d3.time.day(d.date); }); 
    .......... 

則顯示以下錯誤：

XMLHttpRequest cannot load file:///D:/Project%20Space/D3Demo/WebContent/result.csv. Cross origin requests are only supported for HTTP`

如何解決這個問題呢？

Answer 1

使用D3的便利功能無法解決問題。

d3.csv從根本上說是一個AJAX請求，並支持同源策略。

當您加載文件位置時，瀏覽器意識到請求的文件不存在於相同的域（可能是本地主機），並阻止請求完成。

一個簡單的方法來解決這個問題將是通過本地主機或任​​何你使用的內容簡單地提供內容。

或者，您可以查看Cross-origin Resource Sharing或更好的兼容性：JSONP。在這兩種情況下，您都可能需要推出自己的函數才能將CSV數據轉換爲javascript數組。