跨域请求(CORS)

跨域

一、什么是跨域

JavaScript出于安全方面的考虑，不允许跨域调用其他页面的对象。那什么是跨域呢，简单地理解就是因为JavaScript同源策略的限制， a.com 域名下的js无法操作 b.com 或是 c.a.com 域名下的对象。

当协议、子域名、主域名、端口号中任意一个不相同时，都算作不同域。不同域之间相互请求资源，就算作“跨域”。例如：http://www.abc.com/index.html 请求 http://www.efg.com/service.php。

有一点必须要注意：跨域并不是请求发不出去，请求能发出去，服务端能收到请求并正常返回结果，只是结果被浏览器拦截了。之所以会跨域，是因为受到了同源策略的限制，同源策略要求源相同才能正常进行通信，即协议、域名、端口号都完全一致。

大家可以参照下图，有助于深入理解跨域。

特别说明两点：

第一：如果是协议和端口造成的跨域问题“前台”是无能为力的。

第二：在跨域问题上，域仅仅是通过“URL的首部”来识别而不会根据域名对应的IP地址是否相同来判断。“URL的首部”可以理解为“协议, 域名和端口必须匹配”。

跨域请求

在使用django-rest-framework开发项目的时候我们总是避免不了跨域的问题，因为现在大多数的项目都是前后端分离，前后端项目部署在不同的web服务器上，因为我们是后端程序员，因此我要通过后端的程序实现跨域。当然如果前端框架是Vue的话，则可以代理服务实现跨域

原因

跨域请求出现的原因:
前后端分离,导致前后端处在不同的域名上面

现象

解决办法

1.安装第三方扩展

pip install django-cors-headers

2.添加应用

在settings.py文件中添加

'corsheaders',

3.添加中间键

在settings.py文件中添加

 'corsheaders.middleware.CorsMiddleware',

添加前端域名为白名单

CORS_ORIGIN_WHITELIST = [
    'http://127.0.0.1:8080'
]
CORS_ALLOW_CREDENTIALS = True