跨域请求 - javascript [重复]答案

【问题标题】：cross-domain requests - javascript [duplicate]跨域请求 - javascript [重复]
【发布时间】：2016-09-19 13:28:13
【问题描述】：

背景：

我正在创建一个网络应用程序来下载和显示房价。数据来源：http://www.fhfa.gov/DataTools/Downloads/Documents/HPI/HPI_AT_metro.csv

我的计划：

使用 javascript 直接从链接下载数据，然后将数据转换为 javascript 对象（可能使用 jQuery-csv）。之后，我会使用 DataTables 或其他 javascript 库来显示数据。

我卡住的地方：

经过一些研究，这样做似乎违反了“同源政策”。根据我的阅读，在javascript中从外部来源下载数据是不可接受的。

问题：

我说的对吗？是否从外部数据源下载 .csv 违反“同源政策”？
- 如果我不正确，从上面的链接下载 .csv 并将其转换为 javascript 对象（最好使用 jQuery）所需的代码片段将非常有帮助。
如果我是正确的，为什么下载外部 .csv 会违反本政策，而获取要在网站中使用的外部图像并不违反本政策？例如

<img src="http://www.freeflashgamearcade.com/games/images/tic-tac-toe.jpg">

注意事项：

我希望这样做，所以我可以完全避免使用服务器端语言。如果这不起作用，我计划使用 python/flask 设置应用程序，它仅用于下载数据。

【问题讨论】：

不可能通过 AJAX 请求下载文件，所以我看不出您所描述的内容如何违反 SOP。也就是说，当您将文件下载到客户端计算机时，我也看不到这可能如何工作，因此您的 JS 代码将无法访问它。
@RoryMcCrossan 关于下载不再是真的。例如<a> 下载属性、FileSaver API 等
可以在您自己的服务器上使用代理来检索数据，然后将ajax 发送到您的代理。或者使用第三方代理服务，比如 YQL

标签： javascript jquery html cross-domain jquery-csv

【解决方案1】：

你要实现的项目有几个问题：

由于 CORS 策略，您不能使用 AJAX 请求下载第三方文件或获取数据。有时网站允许共享其资源，在这种情况下，可以通过 AJAX 获取第 3 方数据。 (https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS)
即使您能够下载 CSV 文件，您也必须对其进行解析以显示数据，并且由于您使用的是 JavaScript，您将在客户端计算机上下载它，然后您需要访问它这是不可能的。（您无法从 Javascript 访问系统文件 [更多详细信息可以在这里找到：Local file access with javascript）

【讨论】：

【解决方案2】：

您不能向不是您的服务器的其他来源发出 ajax 请求，因为这违反了浏览器的跨域请求策略。

你可以做两件事。使用 python 解决方案并启用 CORS 来执行 ajax 请求，而不会出现浏览器策略问题。因为您正在使您的服务器接受该类型的请求。然后像这样获取ajax请求

$.ajax({
  type: "get",
  url: "mypythonresource.com/Documents/HPI/HPI_AT_metro.csv" 
  success: function(response){ 
    // response will be a string that cointains the CSV data separed by ';'
  }
});

或者您可以做的另一件事是制作一个标签，并在用户下载资源后向他们显示一个模式窗口，以便重新发送到您的应用程序

【讨论】：