JQuery 检索 ICS 文件作为文本答案

【问题标题】：JQuery retrieve ICS file as textJQuery 检索 ICS 文件作为文本
【发布时间】：2020-02-21 00:50:20
【问题描述】：

对 JQuery 和 JS 相当陌生，请原谅我的无能

我正在尝试通过 JavaScript 获取 ICS 文件的文本（例如 BEGIN:CALENDAR....）。

我有一个基本的 HTML 文件：

<html>
  <body>
    <button id="btn">Send</button>
    <script src="jquery.js"></script>
    <script src="ical.min.js"></script>
    <script src="main.js"></script>
  </body>
</html>

而我的main.js 是：

$(function(){
    $('#btn').click(function(){
        $.get("http://www.instantcal.com/test.ics", function (data) { console.log(data);});
    });
});

（我通过在浏览器中打开本地 HTML 文件，例如 file:///C:/.../index.html 并单击按钮来测试我的代码）

当我点击按钮时出现错误：

CORS 策略已阻止从源“null”访问“http://www.instantcal.com/test.ics”处的 XMLHttpRequest：请求的资源上不存在“Access-Control-Allow-Origin”标头。

我该如何解决这个问题？

【问题讨论】：

标签： javascript jquery html get

【解决方案1】：

CORS 是用于访问不同域上的 Web 资源的行业标准。 Web 浏览器实现的非常重要的安全概念是防止 Javascript 或 CSS 代码向不同的来源发出请求。

考虑这种情况：

您有来自 Domain1 的链接，该链接在浏览器中打开并要求来自 Domain2 的 JavaScript 文件。

现在您的网络浏览器调用 Domain2。

如果在 Domain2 上，您的策略是只接受来自 Domain2 的 JavaScript 或 CSS 等请求，并忽略来自其他域的所有请求，那么您的浏览器的 Domain1 请求将失败并出现错误。

【讨论】：

感谢您的解释，但是如何修改我的方法以实现我想要实现的目标？无论我尝试访问哪个 ICS 文件，似乎都会引发此错误（即我在不同域上尝试了许多不同的文件）
只需在你的htaccess中添加“ Header set Access-Control-Allow-Origin "*" "
我没有 htaccess（不确定那是什么）。只是我上面提到的html页面和js文件。我只是在同一个目录中创建它吗？
其安全目的

【解决方案2】：

经过多次谷歌搜索，我发现了以下信息：https://gist.github.com/jesperorb/6ca596217c8dfba237744966c2b5ab1e，它建议使用 CORS 代理的解决方案。

所以最终对我有用的是在我的链接前面加上代理：

const corsProxy = "https://cors-anywhere.herokuapp.com/";
$(function(){
    $('#btn').click(function(){
        $.get(corsProxy + "http://www.instantcal.com/test.ics", function (data) { console.log(data); });
    });
});

【讨论】：