python面试题32 跨域问题 django跨域问题 Ajax跨域问题等

本文回答两个问题：

什么是浏览器同源策略?为什么会有？
什么是跨域问题？为什么会有？怎么解决？
衍生问题—-Ajax跨域问题

——————————————–正文——————————————————-

首先，了解什么是浏览器同源策略？以及为什么会有浏览器的同源策略？

1995年，同源政策由 Netscape 公司引入浏览器。
目前，所有浏览器都实行这个政策。

最初，它的含义是指A网页设置的 Cookie，B网页不能打开，除非这两个网页"同源"。

所谓”同源”指的是”三个相同”：

协议相同
域名相同
端口相同

第二，什么是跨域？为什么要跨域请求？

由于浏览器同源策略，凡是发送请求url的协议、域名、端口三者之间任意一个与当前页面地址不同即为跨域。

存在跨域的情况：
这里写图片描述

网络协议不同，如http协议访问https协议。
端口不同，如80端口访问8080端口。
域名不同，如qianduanblog.com访问baidu.com。

扫描二维码关注公众号，回复： 2611881 查看本文章
子域名不同，如abc.qianduanblog.com访问def.qianduanblog.com。
域名和域名对应ip,如www.a.com访问20.205.28.90.

说说为什么要跨域请求？

你在做本地开发的时候，你的文件夹下的文件不是在一个域下面的，当你一个文件需要发送ajax请求，请求另外一个页面的内容的时候，就会跨域。

不是为什么要跨域，而是你如果不搭服务器，又想要ajax请求的话是不得不跨越。。

跨域的作用就是让你能访问不是一个域的文件。

第三既然如此，怎么解决？以及解决的思路是什么？

浏览器同源策略并不是对所有的请求均制约：

     制约： XmlHttpRequest

     不约束： img、iframe、script等具有src属性的标签

开发需求：向其他网站发http请求
     -- 浏览器直接发送请求（考虑同源）
                     --制造含有src属性的标签，绕过同源策略机制（jsonp）
                     --加响应头，使浏览器允许跨域（core）
     -- 浏览器--服务端---发送请求

( 1 )、porxy代理

定义和用法：proxy代理用于将请求发送给后台服务器，通过服务器来发送请求，然后将请求的结果传递给前端。

实现方法：通过nginx代理；

注意点：1、如果你代理的是https协议的请求，那么你的proxy首先需要信任该证书（尤其是自定义证书）或者忽略证书检查，否则你的请求无法成功。

( 2 )、CORS 【Cross-Origin Resource Sharing】跨站资源共享

定义和用法：是现代浏览器支持跨域资源请求的一种最常用的方式。

使用方法：一般需要后端人员在处理请求数据的时候，添加允许跨域的相关操作。

( 3 )、jsonp

JSONP（JSONP - JSON with Padding是JSON的一种“使用模式”)，利用script标签的src属性（浏览器允许script标签跨域）

定义和用法：通过动态插入一个script标签。浏览器对script的资源引用没有同源限制，同时资源加载到页面后会立即执行（没有阻塞的情况下）。

特点：通过情况下，通过动态创建script来读取他域的动态资源，获取的数据一般为json格式。

缺点：

　　1、这种方式无法发送post请求（这里）

　　2、另外要确定jsonp的请求是否失败并不容易，
　　   大多数框架的实现都是结合超时时间来判定。

（4）其他解决方案

最后，Django里面应该如何处理？

关于解决跨域请求

1.安装django-cors-headers

pip install django-cors-headers

2.配置settings.py文件

INSTALLED_APPS = [
    ...
    'corsheaders'，
    ...
 ] 

MIDDLEWARE_CLASSES = (
    ...
    'corsheaders.middleware.CorsMiddleware',
    'django.middleware.common.CommonMiddleware', # 注意顺序
    ...
)
#跨域增加忽略
CORS_ALLOW_CREDENTIALS = True
CORS_ORIGIN_ALLOW_ALL = True
CORS_ORIGIN_WHITELIST = (
    '*'
)

CORS_ALLOW_METHODS = (
    'DELETE',
    'GET',
    'OPTIONS',
    'PATCH',
    'POST',
    'PUT',
    'VIEW',
)

CORS_ALLOW_HEADERS = (
    'XMLHttpRequest',
    'X_FILENAME',
    'accept-encoding',
    'authorization',
    'content-type',
    'dnt',
    'origin',
    'user-agent',
    'x-csrftoken',
    'x-requested-with',
)

通过以上配置，即可完美解决django跨域请求处理。唯一需要注意的就是cors-headers的中间件CorsMiddleware在注册时必须放在django-common中间件的前一个。

—————————参考：（一定要看）—————————————————–
https://www.jianshu.com/p/1fd744512d83
https://www.cnblogs.com/liuguniang/p/7142136.html
https://www.cnblogs.com/Neeo/p/7684276.html
https://www.cnblogs.com/minigrasshopper/p/8573519.html
感谢各位大佬教导！