Nginx转发地址解决跨域问题
2016-11-20 14:17
706 查看
什么是跨域问题
在一个服务器A里放置了json文件,另一个服务器B想向A发送ajax请求,获取此文件,会发生错误。Chrome提示:
XMLHttpRequest cannot load ******. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
这就是跨域问题。解决方案有不少,比较好的是服务器端配置CORS,但要求服务器端做更改。如果在不需要更改服务器端的情况下解决呢?尤其是需要在本地测试的时候。
配置Nginx
打开nginx目录下的conf文件夹。打开nginx.conf,将其中的http请求修改为:http { include mime.types; server { listen 80; server_name localhost; charset UTF-8; location / { root html; index index.html index.htm; } # Avoid CORS and reverse proxy settings location /api/ { # [2] proxy_http_version 1.1; proxy_pass http://www.des.com/; # [3] add_header Access-Control-Allow-Origin *; add_header Access-Control-Allow-Methods "POST, GET, OPTIONS"; add_header Access-Control-Allow-Headers "Origin, Authorization, Accept"; add_header Access-Control-Allow-Credentials true; } } }
注意粗体字的部分,/api/表示当请求api目录时,转向http://www.des.com/域名。
例如,请求:
http://127.0.0.1/api/ 就会转向 http://www.des.com/
http://127.0.0.1/api/aaa/bbb/ 就会转向 http://www.des.com/aaa/bbb/
这种由服务器转发的请求,可以突破跨域的限制,因此ajax也可以正常工作。
注意:/api/ 不行写成 /api。
http://www.des.com/ 也不能写成 http://www.des.com
配置hosts
为了在本机测试看起来更像在目标服务器上测试,可以设置系统的hosts文件。每个系统(windows、linux、Mac OS)都有hosts文件,它是本地的域名解析器。
通常,我们请求一个域名,如www.baidu.com,首先要向域名服务器请求百度的IP地址,然后再根据IP地址来访问。
也可以不需要咨询域名服务器,直接在本地的hosts键入百度的IP地址。例如
252.192.0.15 www.baidu.com
这样,系统会先从hosts文件里搜索IP地址。
Windows下的hosts文件位于:C:\Windows\System32\drivers\etc
打开后,添加
127.0.0.1 www.des.com
则,每次访问www.des.com,就会链接到本地。
相关文章推荐
- Nginx转发地址解决跨域问题
- Nginx转发地址解决跨域问题
- Nginx解决转发地址时跨域的问题
- nginx 做proxy 不转发 http header问题解决
- nginx rewrite arg 带问号的地址转发参数处理?Nginx重定向的参数问题
- nginx配置反向代理解决前后端分离跨域问题
- JS AJAX 调用tyk转发报跨域问题(已解决)
- 用nginx的反向代理机制解决前端跨域问题
- 利用nginx解决js跨域调用问题
- 用Nginx和Apache的反向代理解决Ajax的跨域问题
- nginx反向代理和rewrite进行解决跨域问题、去掉url中的一部分字符串,通过nginx正则生成新的url
- 前后端分离:利用nginx的rewrite解决跨域问题
- 前后台分离开发,nginx解决跨域问题
- nginx和Tomcat集成后发生的重定向问题分析和解决(非80端口的转发)
- 利用nginx的upstream做反向代理解决内网域名转发的问题
- nginx反向代理和rewrite进行解决跨域问题、去掉url中的一部分字符串,通过nginx正则生成新的url
- 用Nginx和Apache的反向代理解决Ajax的跨域问题
- 用Nginx和Apache的反向代理解决Ajax的跨域问题
- 用nginx的反向代理机制解决前端跨域问题在nginx上部署web静态页面
- nginx配置反向代理解决前后端分离跨域问题