目录：
1.1 cors跨域请求介绍返回顶部
1、cors是什么
1. 随着技术的发展，现在的浏览器可以支持主动设置从而允许跨域请求，即：跨域资源共享（CORS，Cross-Origin Resource Sharing）
2. 其本质是设置响应头，使得浏览器允许跨域请求。
2、简单请求必须满足的两个条件（不满足就是 复杂请求）
1. 条件1： 请求方式：HEAD、GET、POST
2. 条件2： 请求头信息：
Accept
Accept-Language
Content-Language
Last-Event-ID
Content-Type 对应的值是以下三个中的任意一个
application/x-www-form-urlencoded
multipart/form-data
text/plain
3、简单请求和非简单请求的区别
简单请求 ：一次请求
非简单请求 ：两次请求，在发送数据之前会先发一次请求用于做“预检”，只有“预检”通过后才再发送一次请求用于数据传输
4、关于“预检”
1. 请求方式：OPTIONS
2. “预检”其实做检查，检查如果通过则允许传输数据，检查不通过则不再发送真正想要发送的消息
3. 如何“预检”
1） 如果复杂请求是PUT等请求，则服务端需要设置允许某请求，否则“预检”不通过
Access-Control-Request-Method
2） 如果复杂请求设置了请求头，则服务端需要设置允许某请求头，否则“预检”不通过
Access-Control-Request-Headers
1.2 使用tornado实现 复杂请求返回顶部
1、说明
1. 由于复杂请求时，首先会发送“预检”请求，如果“预检”成功，则发送真实数据。
2. “预检”请求时，允许请求方式则需服务器设置响应头：Access-Control-Request-Method
3. “预检”请求时，允许请求头则需服务器设置响应头：Access-Control-Request-Headers
4. “预检”缓存时间，服务器设置响应头：Access-Control-Max-Age
2、tornado测试cors步骤
1. 创建两个tornado项目： tom_tornado（客户端域）、jack_tornado（服务端域）
2、修改C:\Windows\System32\drivers\etc 路径下的 hosts文件，添加两条hosts记录
127.0.0.1 tom.com
127.0.0.1 jack.com
3、在http://tom.com:8000/get_date 的get_date.html文件通过ajax向 http://jack.com:8888/index 获取数据
4、创建 tom_tornado项目（客户端域）
import tornado.ioloop
import tornado.web class MainHandler(tornado.web.RequestHandler):
def get(self):
self.set_header('Access-Control-Allow-Origin', "")
self.render('get_data.html') settings = {
'template_path': 'template',
'static_path': 'static',
'static_url_prefix': '/static/',
} application = tornado.web.Application([
(r"/get_date", MainHandler),
], **settings) if __name__ == "__main__":
application.listen(8000)
print('http://tom.com:8000/get_date')
tornado.ioloop.IOLoop.instance().start()
app.py
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<p>
<input type="submit" onclick="XmlSendRequest();" />
</p> <p>
<input type="submit" onclick="JqSendRequest();" />
</p> <script type="text/javascript" src="/static/jquery-1.12.4.js"></script>
<script>
function XmlSendRequest(){
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if(xhr.readyState == 4) {
var result = xhr.responseText;
console.log(result);
}
};
xhr.open('GET', "http://jack.com:8888/index", true);
xhr.send();
} function JqSendRequest(){
$.ajax({
url: "http://jack.com:8888/index",
type: 'GET',
dataType: 'text',
success: function(data, statusText, xmlHttpRequest){
console.log(data);
}
})
}
</script>
</body>
</html>
get_data.html
5. 创建 jack_tornado项目（服务端域）
import tornado.ioloop
import tornado.web
import json class IndexHandler(tornado.web.RequestHandler):
def get(self):
self.set_header("Access-Control-Allow-Origin", "*")
self.set_header("Access-Control-Allow-Headers", "x-requested-with") # 允许请求头则需服务器设置响应头
self.set_header('Access-Control-Allow-Methods', 'POST, GET, OPTIONS') # 允许请求方式则需服务器设置响应头
# self.set_header('Access-Control-Max-Age', 10) # “预检”缓存时间，服务器设置响应头
self.write('{"status": true, "data": "seven"}') settings = {
'template_path': 'views',
'static_path': 'static',
'static_url_prefix': '/static/',
} application = tornado.web.Application([
(r"/index", IndexHandler),
], **settings) if __name__ == "__main__":
application.listen(8888)
print('http://jack.com:8888/index')
tornado.ioloop.IOLoop.instance().start()
app.py
1.3 Django中使用django-cors-headers解决跨域问题返回顶部
1、安装django-cors-headers 实现cors
1. 安装django-cors-headers插件： pip install django-cors-headers
2. 使用时在对应的Django项目settings.py中做以下修改：
#1、指定允许的hosts，否则通过 http://jack.com:8888/index/ 无法访问jack_django程序
ALLOWED_HOSTS = ['*'] #2、将corsheaders 注册到app中
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'corsheaders',
'app01',
] #3、将下面两条添加到中间件重
MIDDLEWARE = [
'corsheaders.middleware.CorsMiddleware',
'django.middleware.common.CommonMiddleware',
] #4、配置 django-cors-headers 中的参数
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',
'Pragma',
)
settings.py
2、使用代码简单测试
1. 创建一个tornado项目和一个Django项目： tom_tornado（客户端域：tornado项目）、jack_django（服务端域：Django项目）
2、修改C:\Windows\System32\drivers\etc 路径下的 hosts文件，添加两条hosts记录
127.0.0.1 tom.com
127.0.0.1 jack.com
3、在http://tom.com:8000/get_date 的get_date.html文件通过ajax向 http://jack.com:8888/index 获取数据
4、创建 tom_tornado项目（客户端域）
import tornado.ioloop
import tornado.web class MainHandler(tornado.web.RequestHandler):
def get(self):
self.set_header('Access-Control-Allow-Origin', "")
self.render('get_data.html') settings = {
'template_path': 'template',
'static_path': 'static',
'static_url_prefix': '/static/',
} application = tornado.web.Application([
(r"/get_date", MainHandler),
], **settings) if __name__ == "__main__":
application.listen(8000)
print('http://tom.com:8000/get_date')
tornado.ioloop.IOLoop.instance().start()
app.py
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<p>
<input type="submit" onclick="XmlSendRequest();" />
</p> <p>
<input type="submit" onclick="JqSendRequest();" />
</p> <script type="text/javascript" src="/static/jquery-1.12.4.js"></script>
<script>
function XmlSendRequest(){
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if(xhr.readyState == 4) {
var result = xhr.responseText;
console.log(result);
}
};
xhr.open('GET', "http://jack.com:8888/index/", true);
xhr.send();
} function JqSendRequest(){
$.ajax({
url: "http://jack.com:8888/index/",
type: 'POST',
dataType: 'text',
success: function(data, statusText, xmlHttpRequest){
console.log(data);
}
})
}
</script>
</body>
</html>
get_data.html
5. 创建 jack_django项目（服务端域）
注：为避免端口冲突，主动修改jack_django项目监听端口为：8888
from django.shortcuts import render,HttpResponse
import json def index(request):
if request.method == 'get':
return HttpResponse(json.dumps({'name':'jack'}))
else:
return HttpResponse(json.dumps({'name': 'jack222'}))
views.py
#1、指定允许的hosts，否则通过 http://jack.com:8888/index/ 无法访问jack_django程序
ALLOWED_HOSTS = ['*'] #2、将corsheaders 注册到app中
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'corsheaders',
'app01',
] #3、将下面两条添加到中间件重
MIDDLEWARE = [
'corsheaders.middleware.CorsMiddleware',
'django.middleware.common.CommonMiddleware',
] #4、配置 django-cors-headers 中的参数
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',
'Pragma',
)
settings.py