如何执行跨站点ajax请求？

Question

浏览器不允许跨站点AJAX调用（这是一个安全限制）。 有没有可能的解决方案？

修改

我只控制来电者网站

Answer 1

如果您控制双方，那么有很多选择。例如远程网站的JSONP或modifying header响应。 不幸，JSONP仅在远程网站支持时才有效。您无法强制JSONP呼叫到尚未支持它的网站。

但是，正如您所说，您只能控制源网站。出于显而易见的原因，你不能破解浏览器这个限制。您有第三个选项，即创建后端代理。您可以使用Apache和mod_rewrite来创建代理。这是how to do this或此link更详细的内容。

例如

ProxyPass /api/gtalkbots http://gtalkbots.com/reverse-proxy-data.php  
ProxyPassReverse /api/gtalkbots http://gtalkbots.com/reverse-proxy-data.php  

在/api/gtalkbots创建一个代理，它将从gtalkbots.com

返回休止符

Answer 2

您最好的解决方案是使用JSONP来电。

 function jsonp(url, params, callback){
  var script = document.createElement("script");
  script.setAttribute("src", url+'?'+params+'&callback='+callback);
  script.setAttribute("type","text/javascript");
  document.body.appendChild(script);
 }

 function doit(data){
  alert(data);
 }

jsonp('http://domain.com', 'foo=bar', 'doit');

在相反的方面，您正在联系的网站必须能够返回JSONP格式的响应才能使其正常工作。

Answer 3

有两种方法可以执行此操作，具体取决于被调用方是否会发送JSONP：

1。如果可以，请使用JSONP

JSONP是一种通过返回函数调用而不是裸JSON对象来绕过跨域策略的方法。 P代表填充，基本上只是调用函数的部分。

为此，被调用者需要返回JSONP。

常规JSON如下所示：

{a: 12, b: 15}

JSONP看起来像这样：

callback({a: 12, b: 15});

当AJAX请求完成时，将执行回调函数（您在自己的代码中定义）并将JSON数据作为对象传递给它，从而绕过跨域策略。

2。如果不支持JSONP，请通过您自己的服务器镜像请求

第二个选项是通过您自己的服务器管道数据。您的JavaScript向您的服务器发出请求，然后服务器将该请求镜像到远程服务器并回显结果。

由于AJAX请求现在已经发送到您自己的服务器，因此您不会违反跨域策略。

这种方法有两个缺点：

1. 现在需要两个请求，它们会稍微减慢响应时间，但可能并不多，因为服务器到服务器的通信可能会通过胖管道。
2. 由于现在所有请求都来自您的服务器，因此您可能会遇到基于IP的速率限制问题。这是Twitter API调用的情况。您可以通过缓存结果来缓解这种情况。