跨域产生的原因&问题
◆ 浏览器限制
跨域问题如果认为是服务器后台不允许前台调用的想法是错误的,原因是浏览器出于安全的考虑,当浏览器发现请求是跨域的时候,就会校验,校验不通过则抛出跨域安全的问题.(闲的慌)
◆ 跨域
如果请求不是本域的,就会发生跨域. 请求包含协议、域名、端口,其中任何一个不一样,浏览器就认为该请求是跨域的.
◆ XHR (XMLHttpRequest) 请求
如果请求(或封装)不是XHR请求,就算是跨域,浏览器也不会报错,请求方式有很多种,可以查看浏览器控制台请求窗口上请求的类型,如果是xhr,则会被校验,如果是其他的则不会校验(比如img标签上的请求)
解决思路
针对以上3点开始解决
1. 不让浏览器做这些校验,不限制,就不会有跨域安全问题(disable-web-security操作浏览器,没人会去干的)
2. 那我们发出去的请求type不是xhr也可以,就算是跨域也不会报跨域问题(如: jsonp,type是script,只支持get请求,后端继承AbstractJsonpResponseBodyAdvice类,重写构造器约定即可)
3. 回到跨域上来,第一种被调用方改动,传递调用方允许信息,允许跨域访问,直接由浏览器发送请求,则支持跨域;第二种调用方改动,使用代理,请求都发向另一个域,在代理中转url请求,浏览器认为都是同一个域名的访问,则隐藏跨域
关于nginx, 虚拟主机(多个域名指向同一个服务器,服务器将不同的域名转到不同的应用服务器)
安装好nginx,在conf目录下,在nginx.conf文件最下方添加include vhost/*.conf
然后在conf目录下新建一个名为vhost的文件夹.进入vhost文件夹,开始建立相关的应用域名配置
以下是一个例子:
server{
listen: 80; ---监听端口
server_name: tom.com; ---调用方,访问时候的域名,测试时候需要在自己电脑上改host文件的对应配置
location /{
proxy_pass http://localhost:8080/; ---被调用方,所有的请求都转到这里
add_header Access-Control-Allow-Methods *; ---将之前控制header的信息,转移到nginx管理的方式
add_header Access-Control-Max-Age 3600;
add_header Access-Control-Allow-Credentials true;
add_header Access-Control-Allow-Origin $http_origin; ---动态获取origin
add_header Access-Control-Allow-Headers $http_access_control_allow_headers; ---小写,-换成_
if ($request_method = OPTIONS){ ---处理 options 预检命令,不需要再转到应用服务器,if和()之间必须带空格
return 200;
}
}
location /otherserver{ ---再次代理,隐藏跨域
proxy_pass http://localhost:8081/jerry;
}
}
写完配置文件,心里没底的话,可以测试一下文件是否正确,命令: nginx.exe -t
关于Apache的,需要打开预留的注释掉的功能,在httpd-vhost.conf文件,对应的节点修改添加什么什么的,
下次再试试好了,本次不玩了
spring框架项目,只要在类上或方法上加一个注解@CrossOrigin,就可以了
------------------------------------------------------------------------------------------------