javascript - 如何使用 Javascript 从外部 URL 获取 CSV 文件

Question

我正在尝试从以下 URL ( http://s3.amazonaws.com/misc-ww/data.csv ) 获取 CSV 文件并动态解析此文件中的数据。我试图通过解析文件中的数据来实现的目标很重要，如果您想对此提出建议，请随意查看该文件； 但是我当前的问题在于获取文件本身中的数据。当使用 XMLHttpRequest、Ajax 调用或 JSONP 调用时；响应总是返回错误。这意味着由于某种原因无法访问该文件。

经过几个小时的研究，我确信这与某种安全限制(跨域请求)有关，遗憾的是我还没有进一步了解如何绕过它。出于示例目的，我创建了一个 jsFiddle重点介绍我通过 AJAX JSONP 调用检索 CSV 文件的尝试(代码如下所示)。

HTML

<button>Click me to get the CSV File</button>

Javascript

function getCSV() {
    $.ajax({
        url: "http://s3.amazonaws.com/misc-ww/data.csv",
        type: 'get',
        dataType: 'jsonp',
        success: function(data) {
            alert("Success: " + data);
        },
        error: function(jqXHR, textStatus, errorThrow){
            alert("Error: " + jqXHR['responseText']);
        }
    });
}

$('按钮').click(function() { 获取CSV(); });

我的主要目标是能够仅通过 Javascript 来实现这一目标，但是我确实欢迎任何涉及 jQuery 的答案。我知道 JavaScript 框架可以让这个对我有用，但就我而言，我需要在没有它们的情况下进行编码。

Answer 1

如果服务器不支持，您无法使用 JSONP 调用真正绕过 CORS。它更像是服务器不必设置“Access-Control-Allow-Origin: *” header 。相反，服务器可以在回调函数内发送响应来绕过直接的 JSON 响应。所以你的问题是你的 .csv 文件没有包含在回调函数中。

因此支持 JSONP 并获取 ?callback=cbFunc 的服务器将打印:

cbFunc('here is my file content')

现在您正在询问 .csv 文件，服务器正在发送它，而不将其包装到回调函数。这就是您最终受到安全限制的原因。

长话短说:您无法通过 AJAX JSONP 获取文件，因为 s3.amazonaws.com 不支持 JSONP。

这里有关于 JSON 和 JSONP 的很好的解释:http://json-jsonp-tutorial.craic.com/index.html

很抱歉我重复了一遍。