简单请求
cors解决跨域问题方法: 解决方法是在客户端给服务端发送请求时,加上一个响应头.
简单请求:也就是一次请求,没有第二次请求,
客户端代码:
urlpatterns = [ url(r'^admin/', admin.site.urls), url(r'^index/', views.IndexView.as_view()), ]
from django.shortcuts import render from rest_framework import views from django.http import JsonResponse class IndexView(views.APIView): def get(self,request,*args,**kwargs): ret={ 'code':1000, 'data':'老男孩' } res=JsonResponse(ret) res['Access-Control-Allow-Origin']='http://127.0.0.1:8001' #只允许这一个域名跨域 res['Access-Control-Allow-Origin']='*' #允许所有的域名跨域 #最好的办法是加一个中间件 return res
服务端
from django.conf.urls import url from django.contrib import admin from app01 import views urlpatterns = [ url(r'^admin/', admin.site.urls), url(r'^in/', views.index), ]
def index(request): return render(request,'index.html')
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script> </head> <body> <input type="button" value="按钮" class="c1"> <script> $('.c1').click(function () { $.ajax({ url:'http://127.0.0.1:8000/index/', #给别的网站发送请求 type:'GET', success:function (data) { console.log(data) } }) }) </script>
复杂请求
复杂请求:也就是在发送请求之前,会先发送一个预检Options请求,如果预检通过,则再次发送真实的数据
缺点:会造成资源浪费,影响向效率.
所以发送真实的数据之前,自己定义一个options函数.
客户端:
from django.conf.urls import url from django.contrib import admin from app01 import views urlpatterns = [ url(r'^admin/', admin.site.urls), url(r'^index/', views.IndexView.as_view()), ]
from django.shortcuts import render,HttpResponse from rest_framework import views from django.http import JsonResponse class IndexView(views.APIView): def get(self,request,*args,**kwargs): ret={ 'code':1000, 'data':'老男孩' } res=JsonResponse(ret) res['Access-Control-Allow-Origin']='http://127.0.0.1:8001' #只允许这一个域名跨域 res['Access-Control-Allow-Origin']='*' #允许所有的域名跨域 #最好的办法是加一个中间件 return res def post(self,request,*args,**kwargs): ret = { 'code': 1000, 'data': '老男孩' } res = JsonResponse(ret) res['Access-Control-Allow-Origin'] = 'http://127.0.0.1:8001' # 只允许这一个域名跨域 res['Access-Control-Allow-Origin'] = '*' # 允许所有的域名跨域 # 最好的办法是加一个中间件 return res def options(self, request, *args, **kwargs): #tornado操作 # self.set_header('Access-Control-Allow-Origin', "http://www.xxx.com") # self.set_header('Access-Control-Allow-Headers', "k1,k2") # self.set_header('Access-Control-Allow-Methods', "PUT,DELETE") # self.set_header('Access-Control-Max-Age', 10) #django操作 res=HttpResponse() res['Access-Control-Allow-Origin']='*' res['Access-Control-Allow-Headers']='h1' # 如果是复杂的操作,如put,delete请求 # res['Access-Control-Allow-Methods']='PUT' #设置超时时间 # res['ccess-Control-Max-Age']=10 return res
服务端:
from django.conf.urls import url from django.contrib import admin from app01 import views urlpatterns = [ url(r'^admin/', admin.site.urls), url(r'^in/', views.index), ]
from django.shortcuts import render # Create your views here. def index(request): return render(request,'index.html')
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script> </head> <body> <input type="button" value="按钮" class="c1"> <script> $('.c1').click(function () { $.ajax({ url:'http://127.0.0.1:8000/index/', type:'POST', data:{'k1':'v1'}, headers:{'h1':'h2'}, #复杂请求 success:function (data) { console.log(data) } }) }) </script> </body> </html>
PS:如果要传输cookie时,也要在options中加上相应的键值对.详情点击