请求跨域问题

Nginx跨域访问问题总结

一、什么是跨域

简单理解就是a.com域名下的js由于受到JavaScript同源策略的限制，实际上无法 *** 作b.com或c.a.com域名下的目标。

通宗是指相同的协议、域名和端口号。注意两点:

如果协议和端口号导致跨域问题，前台接待无可奈何，

在跨域问题上，只根据“协议域名端口号”识别域。即使两个不同的域名偏向同一个ip详细地址，也是跨域的。

二。通用跨域情况

URL                                表明                        是不是容许通讯 http://www.a.com/a.js http://www.a.com/b.js              同一域名下                        容许 http://www.a.com/lab/a.js http://www.a.com/script/b.js       同一域名下不一样文件夹名称                容许 http://www.a.com:8000/a.js http://www.a.com/b.js              同一域名，不一样端口号                不允许 http://www.a.com/a.js https://www.a.com/b.js             同一域名，不一样协议书                不允许 http://www.a.com/a.js             域名和域名相匹配ip                不允许 http://www.a.com/a.js http://script.a.com/b.js            主域同样，子域不一样            不允许 http://www.a.com/a.js http://a.com/b.js                    同一域名，不一样二级域名（跟上面一样）不允许（cookie这类状况下也不允许浏览） http://www.cnblogs.com/a.js http://www.a.com/b.js                不一样域名                    不允许

注意两点:

第一，如果是协议和端口号导致的跨域问题，“前台接待”是无奈之举。第二，在跨域问题上，只根据“URL的第一部分”来识别域，不容易试图分辨出同一个ip详细地址是否匹配两个域，或者两个域是否在同一个ip上。“URL的第一部分”指的是window.location.protocolwindow.location.host，也可以理解为“域、协议、端口必须匹配”。

三。跨领域解决方案

有很多种，大部分用JSHack。

1.设置document.domainiframe

2.动态创建脚本。

3.使用iframe和location.hash

4.window.name完成跨域数据传输

5.应用HTML5postMessage

6.关于使用闪光灯的计划，请见http://www.cnblogs.com/rainman/archive/2011/02/20/1959·325.html#M5。

7.nginx反向代理方法一般很少有人讲，但是不需要整体目标网络服务器的配合也可以使用，但是它要你搭建一个中转nginx网络服务器来共享请求。

8.JqueryJSONP(本质上是动态创建脚本)http://www.cnblogs.com/chopper/archive/2012/03/24/2403945.html

9.跨域共享资源(CORS)这是我们将要详细介绍的跨域解决方案，也是未来跨域问题的标准解决方案。

四。CORS

http://www.w3.org/tr/cors/CORS:跨产地资源共享

目前，基本上所有的计算机浏览器(InternetExplorer8、Firefox3.5、Safari4和Chrome3)都可以根据名为跨源资源共享的协议跨域启用ajax。(参见:http://caniuse.com/#search=cors)

Chrome、Firefox、Opera和Safari都使用XMLHttpRequest2target，IE使用XDomainRequest。XMLHttpRequest2的请求属性:open()，setRequestHeader()，timeout，withCredentials，upload，send()，send()，abort()。

XMLHttpRequest2的响应属性:status，statusText，getResponseHeader()，getAllResponseHeaders()，entity，overrideMimeType()，responseType，Response，responseText，responseXML。

1.打开CORS请求

假设您的应用程序已经在example.com，您想从www.example2.com获取数据信息。一般情况下，如果尝试启动这类AJAX，请求可能会不成功，电脑浏览器可能会出现“源不匹配”错误。有了CORS，example.com服务器只需添加一个HTTP响应头就可以允许来自example.com的请求:

访问控制允许原产地:http://example.com

access-control-allow-credentials:true(可选)

您可以将Access-Control-Allow-Origin添加到某个URL下或所有域中的单个资源。要允许所有域向您提交请求，请进行以下设置:

访问控制允许来源:*

access-control-allow-credentials:true(可选)

事实上，该网站(html5rocks.com)已经在其所有网站上开放了CORS。打开开发者的专用工具后，你会在大家的回复中看到Access-Control-Allow-Origin。

2、CORS方式完成跨域请求

要完成CORS跨域，服务器端必须走这一步:http://www.html5rocks.com/static/images/CORS_服务器_flowchart.png。

对于简单的请求，比如GET，只有Access-Control-Allow-Origin必须添加在HTTP响应之后。

对于非简单的请求，如POST、PUT、DELETE等。，电脑浏览器会回复两次。第一个预检(method:OPTIONS)，关键认证来自是否合理合法，返回允许的头等。第二次才是真正的HTTP回复。因此，网络服务器必须解决选项回复。

这里是nginx在http://enable-cors.org/server_nginx.html.开COSR的参考设备

以下步骤:

首先查询http头的顶部是否是源字段名；

如果没有，或不允许，立即作为一般要求解决，结束；

如果是，我们来看看是不是预检(method=options)。

如果是预检，返回到Allow-Headers，Allow-Methods等。内容为空；

如果不是预检，返回到允许-来源、允许-凭证等。，然后一切恢复正常。

首先，在服务器上进行必须在远端浏览的设置。如果远端服务器是nginx服务项目，则添加以下信息内容。

server { listen 80; server_name tangxiaoyue.com; if ( $http_user_agent = "Mozilla/5.0"){ return 403; } location / { add_header 'Access-Control-Allow-Origin' '*'; add_header 'Access-Control-Allow-Credentials' 'true'; add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS'; # Custom headers and headers various browsers *should* be OK with but aren't add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type'; 后边省去。。。 } }

V.nginx反向代理处理跨域

禁止跨域问题其实是电脑浏览器的个人安全行为。现在大部分的解决方案都是识别这种系统漏洞或者可以跨域浏览的方法，但是整体目标网络服务器做出相对改变是必然的。如果整体目标网络服务器无法更改，则必须由本地服务器来完成。如果是在本地完成，就需要构建一个nginx，并在其下部署相关代码。网页请求域名的详细地址，然后nginx代理去整体目标网络服务器解决，然后结果返回给网页，这些都是一样的。

如果服务器代理的详细地址是www.c.com/proxy/html/api/msg?方法=1=2；是www.c.com的nginx主机地址。

远程服务器的IP:http://www.b.com/api/msg?方法=1=2

在nginx网络服务器上制作以下设备

在位置下方添加另一个位置。

地点^~/proxy/html/{

重写^/proxy/html/(.*)$/$1break；

代理人_通行证http://www.b.com/;

}

做如下声明:

1.''^~/代理/html/'

如上所述，它是一个配置标准，用于阻塞请求，配置所有以/proxy/html/开头的详细地址，匹配后停止向下搜索正则表达式。

2.重写^/proxy/html/(.*)$/$1break；

意味着调用阻塞了传入的请求，除了传递的主参数，只对域名后的字符串数组起作用，比如www.c.com/proxy/html/api/msg?.方法=1=2调用。只调用/proxy/html/api/msg。

重写后的主要参数是一个简单的正则表达式/proxy/html/(。*)$，表示正则表达式中的第一个()，2表示第二个()的值，依此类推。

Break的意思是匹配一个以后会终止的匹配。