同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能.
就浏览器而言的, http://127.0.0.1:8000 协议 域名 端口
跨域 问题// 简单请求跨域 S1项目 127.0.0.1:8000 from django.shortcuts import render from django.http import JsonResponse def test(request): return render(request,'index.html') def books(request): l1 = ['方法','炼钢','铁男'] return JsonResponse(l1,safe=False) # 非字典模式 ------------------------------------------- from django.conf.urls import url from django.contrib import admin from app01 import views urlpatterns = [ url(r'^admin/', admin.site.urls), url(r'^books/', views.books), url(r'^test/', views.test), ] -------------------------------------- # python 脚本 tests.py 运行不受影响 import requests import json a= requests.get('http://127.0.0.1:8001/books/') print(json.loads(a.content))
-- 页面代码 --
<body> <button id="sub"> ajax请求数据</button> </body> <script src="https://cdn.bootcss.com/jquery/3.4.0/jquery.min.js"></script> <script> $("#sub1").click(function () { $.ajax({ // url:'/books/', 访问自己的就是同源 url: ' http://127.0.0.1:8001/books/', //访问其他服务器的路由就是非同源 type: 'get', success: function (response) { console.log(response); } }) }) </script>
-- S2 项目 127.0.0.1:8001
-- views.py -- from django.shortcuts import render from django.http import JsonResponse def books(request): ll = ['基金','故事','大厦'] ret = JsonResponse(ll,safe=False) ret['Access-Control-Allow-Origin'] = '*' # 响应头 *是所有的地址 协议域名端口 return ret # 非字典 ------------------------------------- -- urls.py -- from django.conf.urls import url from django.contrib import admin from app01 import views urlpatterns = [ url(r'^admin/', admin.site.urls), url(r'^books/',views.books), ]
简单请求
(1)HEAD GET POST 三选一
(2)http 请求头信息 只在以下字段里面:
Accept Accept-Language Content-Language Last-Event-ID Content-Type:只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain,也就是说,
如果你发送的application/json格式的数据,那么肯定是非简单请求,vue的axios默认的请求体信息格式是json的,ajax默认是
urlencoded的。
复杂请求
S1 -- 页面改变
<body> <button id="sub"> ajax请求数据</button> </body> <script src="https://cdn.bootcss.com/jquery/3.4.0/jquery.min.js"></script> <script> $("#sub").click(function () { $.ajax({ // url:'/books/', url: ' http://127.0.0.1:8001/books/', // type: 'post', type: 'put', headers:{a:1}, contentType:'application/json', data:JSON.stringify(({'name':'chao'})), success: function (response) { console.log(response); } }) }) </script>
S2项目 views.py改变
from django.shortcuts import render from django.http import JsonResponse def books(request): ll = ['基金','故事','大厦'] ret = JsonResponse(ll,safe=False) ret['Access-Control-Allow-Origin'] = '*' # 响应头 *是所有的地址 协议域名端口 ret['Access-Control-Allow-Headers'] = '*' #'content-type,a' ret['Access-Control-Allow-Methods'] = '*' #'PUT' return ret # 非字典
支持跨域,简单请求 服务器设置响应头:Access-Control-Allow-Origin = '域名' 或 '*' 支持跨域,复杂请求 由于复杂请求时,首先会发送“预检”请求,如果“预检”成功,则发送真实数据。 “预检”请求时,允许请求方式则需服务器设置响应头:Access-Control-Request-Method “预检”请求时,允许请求头则需服务器设置响应头:Access-Control-Request-Headers