2、在HTTP服务器(eg:nginx or apache)中增加响应头——服务器容器配置
2.1、Nginx配置
- 修改主机hosts文件增加映射本地域名:127.0.0.1 b.com(表示被调用方的域名)
- 在conf目录下创建vhost目录
- 修改nginx.conf在最后面增加一行代码:include vhost/*.conf;
- 在vhost目录下创建b.com.conf
- 启动niginx,访问b.com/test/get1
编写b.com.conf
server{ listen 80; server_name b.com; location /{ proxy_pass http://localhost:8080/; add_header Access-Control-Allow-Methods *; add_header Access-Control-Max-Age 3600; add_header Access-Control-Allow-Credentials true; add_header Access-Control-Allow-Origin $http_origin; add_header Access-Control-Allow-Headers $http_access_control_allow_headers; if ($request_method = OPTIONS){ return 200; } } }
Nginx语法注意:
(1)if 后面必须加一个空格。
(2)请求头必须小写,并且“-”必须变成“_”。
2.2、Apache配置
Apache配置
- 修改conf/httpd.conf找到LoadModule vhost_alias_module module/mod_vhost_alias.so取消注释
- 修改conf/httpd.conf找到LoadModule proxy_module module/mod_ proxy.so取消注释
- 修改conf/httpd.conf找到LoadModule proxy_http_module module/mod_ proxy_http.so取消注释
- 修改conf/httpd.conf找到LoadModule headers_module module/mod_ headers.so取消注释
- 修改conf/httpd.conf找到LoadModule rewrite_module module/mod_ rewrite.so取消注释
- 修改conf/httpd.conf找到Include conf/extra/httpd-vhosts.conf取消注释
- 修改conf/extra/httpd-vhosts.conf在最后面增加下面的内容即可
<VirtualHost *:80> ServerName b.com ErrorLog "logs/b.com-error.log" CustomLog "logs/b.com-access.log" common ProxyPass / http://localhost:8080/ # 把请求头的origin值返回到Access-Control-Allow-Origin字段 Header always set Access-Control-Allow-Origin "expr=%{req:origin}" # 把请求头的Access-Control-Allow-Headers值返回到Access-Control-Allow-Headers字段 Header always Access-Control-Allow-Headers "expr=%{Access-Control-Allow-Headers}" Header always set Access-Control-Allow-Methods "*"; Header always set Access-Control-Max-Age "3600"; Header always set Access-Control-Allow-Credentials ""true"; # 处理预检命令OPTIONS,直接返回204 RewriteEngine On RewriteCond %{REQUEST_METHOD}OPTIONS RewriteRule ^(.*)$"/" [R=204,L] </VirtualHost>
2.3、Spring框架支持
- 在类或方法上使用注解@CrossOrigin即可支持跨域
二、调用方解决跨域问题
隐藏跨域
1、使用Nginx反向代理实现
- 修改主机hosts文件增加映射本地域名:127.0.0.1 a.com
- 在vhost目录下创建a.com.conf
- 启动niginx,访问a.com/ajaxserver/get1
编写a.com.conf
server{ listen 80; server_name a.com; location /{ proxy_pass http://localhost:8081/; } location /ajaxserver{ proxy_pass http://localhost:8080/test/; } }
2、使用Apache反向代理实现
- 修改conf/extra/httpd-vhosts.conf在最后面增加下面的内容即可
1<VirtualHost *:80> ServerName a.com ErrorLog "logs/a.com-error.log" CustomLog "logs/a.com-access.log" common ProxyPass / http://localhost:8081/ ProxyPass /ajaxserverapache http://localhost:8080/test </VirtualHost>
总结
- 产生原因:主要是浏览器对Ajax请求的限制。
- 解决思路:JSONP、支持跨域、隐藏跨域。
- 核心原理:了解Http协议关于跨域方面的规定。
- 解决方法:使用Filter、Nginx正反向代理、Apache正反向代理、Spring框架支持。