实际跨域问题及解决方案1.题目：ajax实现跨域访问2.背景：1.屏幕服务器：192.168.196.6→tomcat服务2.js模板服务器：192.168.196.8→nginx服务3.屏幕服务需要跨域请求js资源3.错误：过程中经过多次配置，出现如下错误1.No'Access-Control-Allow-Origin'请求的资源上存在标头，响应的HTTP状态代码为4042。请求的资源上不存在“Access-Control-Allow-Origin”标头，响应的HTTP状态代码为4054。解决方案：nginx服务配置（nginx.conf):locationxxx{别名xxx;--允许GET请求，并返回如下头信息if($request_method='GET'){add_header'Access-Control-Allow-Origin''*';add_header'Access-Control-Allow-Headers''X-Requested-With';}--允许预检请求，返回如下头信息if($request_method='OPTIONS'){add_header'Access-Control-Allow-Origin''*';add_header'Access-Control-Allow-Methods''GET,POST,OPTIONS';add_header'Access-Control-Allow-Headers''X-Requested-With';add_header'内容长度'0;返回204；}}分析：1、我的跨域请求是GET方式，所以只配置GET方式很简单。2、我的请求不是简单的请求，所以需要配置一个preflightrequest接口（OPTIONS）。学习总结CORS认识CORS是一个W3C标准，全称是Cross-originresourcesharing（跨域资源共享）。CORS需要浏览器和服务器的支持。目前所有浏览器都支持该功能，IE浏览器不能低于IE10。因此，实现CORS通信的关键是服务器。只要服务端实现了CORS接口，就可以实现跨域通信。CORS分类浏览器将CORS请求分为两类：简单请求（simplerequest）和非简单请求（not-so-simplerequest）。简单请求满足以下两个条件为简单请求（1）请求方法为以下三种方法之一：HEAD、GET、POST（2）HTTP头信息不超过以下字段：AcceptAccept-LanguageContent-LanguageLast-Event-IDContent-Type：只限于三个值application/x-www-form-urlencoded,multipart/form-data,text/plain请求流程1、浏览器直接发送CORS请求。与普通请求相比，增加了一个Origin字段。GET/corsHTTP/1.1来源：http://192.168.196.160主机：xxx接受语言：xxx连接：xxx用户代理：xxx2。如果Origin指定的域名在允许范围内，则服务器返回的响应将额外信息字段Access-Control-Allow-Origin（也可以添加其他可选字段）Access-Control-Allow-Origin:http://192.168.196.160//或*，表示接受任何域名的请求。内容类型：文本/html；charset=utf-8非简单请求简单请求以外的都是非简单请求。非简单请求是对服务器的特殊请求，比如请求方式为PUT或DELETE，或者Content-Type字段类型为application/json。非简单请求在请求前添加一个“预检”请求（prelight）。预检请求浏览器向服务器询问当前网页的域名是否在服务器的访问权限列表（Origin）中，请求方法（Access-Control-Request-Method）和头部信息字段（Access-Control-请求标头）是允许的。服务器收到预检请求后，检查Origin、Access-Control-Request-Method、Access-Control-Request-Headers字段。如果确认允许跨域请求，则可以在HTTP响应中包含这三个header，如下Access-Control-Allow-Origin:请求源域名或者*Access-Control-Allow-Methods:GET,POST,PUTAccess-Control-Allow-Headers:X-Custom-Header如果不允许跨域请求，服务器返回正常响应，但不带cors头信息字段，浏览器会触发错误如下：XMLHttpRequestcannotloadRequestsourcedomainnameOriginhttp://api.bob.comisnotallowedbyAccess-Control-Allow-Origin.预检请求通过后，以后每次浏览器的正常cors请求都和简单请求一样。请求头信息会携带origin，服务器的响应也会有头信息字段Access-Control-Allow-Origin。（参考简单请求）参考：跨域资源共享CORS详解阮一峰ajax跨域，这应该是最全的解决方案投网看鱼
