同源策略(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

restful 跨域的更多相关文章

  1. javascript跨域请求RESTful Web Service

    跨域请求RESTful Web Service 当我们用js请求RESTful Web Service的时候,通常会出现跨域无法访问的问题,也就是无法正常得到我们要的值.jsonp是个解决问题的方法. ...

  2. [经验] - JQuery.Ajax + 跨域 (crossDomain) + POST + JSON + WCF RESTful, 5大陷阱和解决方案

    最近在开发WSS RESTful服务的时候, 碰到了这些个纠结的问题. 在网上查找了半天, 找到n多种解决方案, 但是都是部分的, 要么是没有跨域的情况, 要么是没有post的情况, 要么不是用WCF ...

  3. JQuery.Ajax + 跨域 (crossDomain) + POST + JSON + WCF RESTful, 5大陷阱和解决方案

    JQuery.Ajax + 跨域 (crossDomain) + POST + JSON + WCF RESTful, 5大陷阱和解决方案 最近在开发WSS RESTful服务的时候, 碰到了这些个纠 ...

  4. python 全栈开发,Day100(restful 接口,DRF组件,DRF跨域(cors组件))

    昨日内容回顾 1. 为什么要做前后端分离? - 前后端交给不同的人来编写,职责划分明确.方便快速开发 - 针对pc,手机,ipad,微信,支付宝... 使用同一个接口 2. 简述http协议? - 基 ...

  5. Asp.net WebAPi Restful 的实现和跨域

    现在实际开发中用webapi来实现Restful接口开发很多,我们项目组前一段时间也在用这东西,发现大家用的还是不那么顺畅,所以这里写一个Demo给大家讲解一下,我的出发点不是如何实现,而是为什么? ...

  6. Django框架深入了解_01(Django请求生命周期、开发模式、cbv源码分析、restful规范、跨域、drf的安装及源码初识)

    一.Django请求生命周期: 前端发出请求到后端,通过Django处理.响应返回给前端相关结果的过程 先进入实现了wsgi协议的web服务器--->进入django中间件--->路由f分 ...

  7. Restful based service 的跨域调用

    1.关于跨域, w3c的官方文档:https://www.w3.org/TR/cors/ 2.有时间再整理吧. <html> <head> <script src=&qu ...

  8. WCF Restful调用跨域解决方案

    目前很多项目中CRM更多扮演一个纯后台管理系统,用户更多的操作是在移动端执行,不管是安卓还是IOS甚至是H5.这里以H5为例,CRM提供数据接口,移动web端来调用接口进行数据处理,这里就会涉及到一个 ...

  9. [二十七]SpringBoot 之 Restful接口的跨域请求

    什么是跨域 简单的说即为浏览器限制访问A站点下的js代码对B站点下的url进行ajax请求.比如说,前端域名是www.abc.com,那么在当前环境中运行的js代码,出于安全考虑,访问www.xyz. ...

随机推荐

  1. Linux——模拟实现一个简单的shell(带重定向)

    进程的相关知识是操作系统一个重要的模块.在理解进程概念同时,还需了解如何控制进程.对于进程控制,通常分成1.进程创建  (fork函数) 2.进程等待(wait系列) 3.进程替换(exec系列) 4 ...

  2. 08_ for 练习 _ sumOf7

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  3. 前端性能优化 —— reflow(回流)和repaint(重绘)

    简要:整个在浏览器的渲染过程中(页面初始化,用户行为改变界面样式,动画改变界面样式等)reflow(回流)和repaint(重绘) 会大大影响web性能,尤其是手机页面.因此我们在页面设计的时候要尽量 ...

  4. python中的基础2

    2 2.1 字符串的索引与切片: a = 'ABCDEFGHIJK' print(a[0]) print(a[3]) print(a[5]) print(a[7]) 2.2  字符串的常用方法. pr ...

  5. java基础 第八章课后习题

    1.什么是二重循环?在内层循环中使用continue和break语句,程序如何跳转? 答:二重循环就是一个循环结构体内又包含另一个完整的循环结构. continue语句跳转时是跳过了内层循环中的剩余语 ...

  6. Selenium 3----定位一组元素+多表单切换+多窗口切换

    定位一组元素 和定位单个元素类似,WebDriver提供了8种用于定位一组元素的方法.定位一组元素的方法与定位单个元素的方法类似,唯一的区别是在单词element后面多了一个s表示复数. find_e ...

  7. 队列->队列的表示和实现

    文字描述 队列是和栈相反,队列是一种先进先出(first in first out,缩写FIFO)的线性表,它只允许在表的一端进行插入,而在另一端进行删除.和生活中的排队相似,最早进入队列的元素最早离 ...

  8. qss qt按钮自定义

  9. ES6语法 Promise Iterator

    类和对象 基本定义: class Parent{ constructor(name='lmx'){ //name= 默认值 this.name=name } } let v_parent = new ...

  10. UML用例关系一览