随着越来越多的项目走向了前后端分离,前端服务,需要访问到不同的后端地址,经常遇到跨域问题。本文主要介绍使用Nginx解决跨域问题。
- 什么是跨域
由于浏览器的同源策略,用来限制从一个源加载的文档或脚本与来自另一个源的资源进行交互。那怎样判断是否是同源呢?如果协议,端口(如果指定了)和主机对于两个页面是相同的,则两个页面具有相同的源,也就是同源。也就是说,要同时满足以下3个条件,才能叫同源:
- 协议相同
- 端口相同
- 主机相同
- 常见跨域情况
- 网络协议不同,如http协议访问https协议 ;
- 端口不同,如80端口访问8080端口 ;
- 域名不同,如www.test1.com访问www.test2.com ;
- 子域名不同,如abc.test1.com访问def.test1.com ;
-
修改nginx server 配置,添加如下内容
powershell#允许跨域请求的域,* 代表所有 add_header 'Access-Control-Allow-Origin' *; #允许请求的header add_header 'Access-Control-Allow-Headers' *; #允许带上cookie请求 add_header 'Access-Control-Allow-Credentials' 'true'; #允许请求的方法,比如 GET,POST,PUT,DELETE add_header 'Access-Control-Allow-Methods' *;