jQuery Ajax 笔记
- 由于浏览器安全限制，大部分Ajax请求都受同源策略的约束；请求无法从不同的域、子域、端口或协议成功检索数据。
- 脚本和 JSONP 请求不受同源策略限制。
有一些方法可以克服跨域障碍：
有一些插件可以帮助处理跨域请求：
小心！
解决这个问题最好的办法，就是在后端创建自己的代理，让你的代理指向其他域的服务，因为后端不存在同源策略限制。但是，如果您不能在后端执行此操作，请注意以下提示。
**警告！**
使用第三方代理不是一种安全的做法，因为它们可以跟踪您的数据，因此它可以用于公共信息，但不能用于私人数据。
下面显示的代码示例使用jQuery.get()和jQuery.getJSON()，它们都是jQuery.ajax()的简写方法
CORS 无处不在
2021 更新
公共演示服务器 (cors-anywhere.herokuapp.com) 将在 2021 年 1 月 31 日之前非常有限
CORS Anywhere 的演示服务器 (cors-anywhere.herokuapp.com) 旨在作为该项目的演示。但是滥用已经变得如此普遍，以至于托管演示的平台 (Heroku) 要求我关闭服务器，尽管我们努力抵制这种滥用。由于滥用及其流行，停机时间变得越来越频繁。
为了解决这个问题，我将进行以下更改：
- 速率限制将从每小时 200 次降至每小时 50 次。
- 到 2021 年 1 月 31 日，cors-anywhere.herokuapp.com 将停止作为开放代理。
- 从2月1日开始。2021 年，cors-anywhere.herokuapp.com 将仅在访问者完成挑战后提供请求：用户（开发人员）必须访问 cors-anywhere.herokuapp.com 的页面以临时解锁其浏览器的演示。这允许开发人员尝试该功能，以帮助决定自托管或寻找替代方案。
CORS Anywhere 是一个node.js 代理，它将 CORS 标头添加到代理请求中。
要使用 API，只需在 URL 前面加上 API URL。（支持https：见github 仓库）
如果您想在需要时自动启用跨域请求，请使用以下代码段：
$.ajaxPrefilter( function (options) {
if (options.crossDomain && jQuery.support.cors) {
var http = (window.location.protocol === 'http:' ? 'http:' : 'https:');
options.url = http + '//cors-anywhere.herokuapp.com/' + options.url;
//options.url = "http://cors.corsproxy.io/url=" + options.url;
}
});
$.get(
'http://en.wikipedia.org/wiki/Cross-origin_resource_sharing',
function (response) {
console.log("> ", response);
$("#viewer").html(response);
});
无论起源
无论 Origin是跨域 jsonp访问。这是anyorigin.com的开源替代方案。
要从google.com 获取数据，您可以使用以下代码段：
// It is good specify the charset you expect.
// You can use the charset you want instead of utf-8.
// See details for scriptCharset and contentType options:
// http://api.jquery.com/jQuery.ajax/#jQuery-ajax-settings
$.ajaxSetup({
scriptCharset: "utf-8", //or "ISO-8859-1"
contentType: "application/json; charset=utf-8"
});
$.getJSON('http://whateverorigin.org/get?url=' +
encodeURIComponent('http://google.com') + '&callback=?',
function (data) {
console.log("> ", data);
//If the expected response is text/plain
$("#viewer").html(data.contents);
//If the expected response is JSON
//var response = $.parseJSON(data.contents);
});
CORS 代理
CORS 代理是一个简单的node.js 代理，可以为任何网站启用 CORS 请求。它允许您网站上的 javascript 代码访问其他域上的资源，这些资源通常会由于同源策略而被阻止。
它是如何工作的？CORS 代理利用了跨域资源共享，这是与 HTML 5 一起添加的功能。服务器可以指定他们希望浏览器允许其他网站请求他们托管的资源。CORS 代理只是一个 HTTP 代理，它在响应中添加一个标头，说“任何人都可以请求这个”。
这是实现目标的另一种方式（参见www.corsproxy.com）。您所要做的就是剥离http://和www。来自被代理的 URL，并在 URL 前面加上www.corsproxy.com/
$.get(
'http://www.corsproxy.com/' +
'en.wikipedia.org/wiki/Cross-origin_resource_sharing',
function (response) {
console.log("> ", response);
$("#viewer").html(response);
});
CORS 代理浏览器
最近我发现了这个，它涉及各种面向安全的跨域远程共享实用程序。但它是一个以 Flash 为后端的黑盒。
你可以在这里看到它的实际效果：CORS 代理浏览器
在 GitHub 上获取源代码：koto/cors-proxy-browser