今日目标：带你们领略跨域的奥秘～
- 1，为什么会出现跨域问题？
- 2，跨域的定义是什么？
- 3，如何避免跨域？
我们平常写代码的时候，应该很少碰到这个问题，因为所有的逻辑代码都是写在同一个项目中，那到底什么时候会出现跨域？其实这里面牵涉到一个同源策略问题，接下来我们先探讨一下同源策略，接着进一步解析跨域。
同源策略是浏览器的一个安全功能，不同源的客户端脚本(js文件)在没有明确授权的情况下，不能读写对方资源。只有同一个源的脚本赋予dom、读写cookie、session、ajax等操作的权限。
同源政策的目的：是为了保证用户信息的安全，防止恶意的网站窃取数据。
我们都知道 url由协议、域名、端口和路径组成，如果两个url的协议、域名和端口相同，则认为这两个url是同源的，否则，就为跨域。
举个例子：
前段时间我们接了一个项目，采用的开发模式是前后端分离，我们的前端和后端分别是两个不同的端口，这就涉及到跨域访问数据的问题，因为浏览器的同源策略，默认是不支持两个不同域名间相互访问数据的，而我们需要在两个域名间相互传递数据，这时，就出现了跨域问题，接下来跟大家分享一下如何解决这种问题。
- 我们项目使用的是django框架，我们使用django-cors-headers扩展，来解决后端对跨域访问的支持。
- 凡是出现在白名单中的域名，都可以访问后端。
- CORS_ALLOW_CREDENTIALS 指明在跨域访问中，后端是否支持对cookie的操作。
django-cors-headers如何使用？具体操作如下：
1，安装
pip install django-cors-headers
2，添加应用
INSTALLED_APPS = (
...
'corsheaders',
...
)
3，设置中间层
MIDDLEWARE = [
'corsheaders.middleware.CorsMiddleware',
...
]
4，添加白名单
# CORS
CORS_ORIGIN_WHITELIST = (
'127.0.0.1:8080',
'localhost:8080',
'www.xxx.xx:8080',
'api.xxx.xx:8000'
)
CORS_ALLOW_CREDENTIALS = True # 允许携带cookie
具体的流程如下：
1、浏览器会第一次先发送options请求询问后端是否允许跨域，后端查询白名单中是否有这两个域名
2、如过域名在白名单中则在响应结果中告知浏览器允许跨域
3、浏览器第二次发送post请求，携带用户登录数据到后端，完成登录验证操作
解决这种跨域问题，其实还有其他的解决方法，后面我们再慢慢分享
网友评论