跨域CORS
- 简介
CORS需要浏览器和服务器同时支持,整个CORS通信过程,都是浏览器自动完成,不需要用户参与。对于开发者来说,CORS通信与AJAX通信没有差别,代码完全一样,现在前端后端分出不同的域名,这就涉及到跨域访问数据的问题,因为浏览器的同源策略,默认是不支持俩个不同域间相互访问数据,而我们需要在俩个域名之间互相传递数据,这时我们就要为后端添加跨域CORS访问的支持。
同源就相当于遵守Http协议,只有端口,ip地址,协议,三者有一个不一样,就得使用跨域。
- CORS的安装与使用
1)安装
pip install djang-cors-headers
- 添加应用
(添加到Django项目中的setting文件中的中间件里)
INSTALLED_APPS = (
…
‘corsheaders’,
…
)
- 添加白名单
CORS_ORIGIN_WHITELIST = (
‘http://127.0.0.1:8080’,
‘http://localhost:8080’,
‘http://www.meiduo.site:8080’,
‘http://www.meiduo.site:8000’
)
CORS_ALLOW_CREDENTIALS = True # 允许携带cookie
1.凡是出现在白名单中的域名,都可以访问后端接口
2.CORS_ALLOW_CREDENTIALS指明在跨域访问中,后端是否支持COOKIE
4)Django跨域程序运行流程解析
如果用的是Python就可以用Python自带的服务器,打开cmd进入到自己的静态文件的目录下输入该命令:
python -m http.server 8000
这里命令后的端口必须要卸载白名单里面并且不能和后端的端口重复了,再开启后端的代码的服务器,后端的服务器的ip和端口直接使用自己本地的就行,详细解释如下图!
- 开启前端服务器并且带上端口
- 开启后端服务器使用本地IP地址和端口
- 获取返回的数据
请求流程中遇到的Bug
- 如果没有添加白名单浏览器中的Network会提示你缺少CORS
解决办法:去setting文件中添加就OK了
- IP地址和端口复用
后端服务器和前端服务器的ip地址和端口不能一样,后端白名单里要添加前端访问的ip地址和端口
- 跨域在中间件的级别
设置在中间件的最上面的第一个
- 注册跨域
写在INSTALLED_APPS里面