跨源请求cors和jsonp
0、产生跨域的原因
浏览器的同源策略
什么是浏览器的同源策略?
src开发
ajax禁止
解决方法
jsonp
通过src绕过浏览器的同源策略
缺点：只发送GET请求
cors
通过设置相应头
分类
简单请求
复杂请求 options 预检
一、cors（常用简单）
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h2>django</h2>
<input type="button" name="" id="getService" value="获取python的数据">
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
<script>
$("#getService").on('click', function () {
// alert(123)
$.ajax({
// 目标域，获取数据
url: "http://127.0.0.1:8002/service/",
type: "get",
success: function (data) {
console.log(data)
// console.log(typeof data)
}
});
})
</script>
</body>
</html>
def service(request):
dic = {"name": "python"}
response = HttpResponse(json.dumps(dic))
# 获取资源的ip
response["Access-Control-Allow-Origin"] = "http://127.0.0.1:8000"
return response
CORS中间件
https://www.cnblogs.com/wt7018/p/11531343.html
二、jsonp
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h2>django</h2>
<input type="button" name="" id="getService" value="获取python的数据">
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
<script>
$("#getService").on('click', function () {
// alert(123)
$.ajax({
// 目标域，获取数据
url: "http://127.0.0.1:8002/service/",
type: "get",
dataType: "jsonp",
jsonp: "callbacks",
// jsonpCallback: "abc",
success: function (data) {
console.log(data)
// console.log(typeof data)
}
});
})
</script>
</body>
</html>
def service(request):
dic = {"name": "python"}
dic_str = json.dumps(dic)
func = request.GET.get("callbacks")
print(func)
return HttpResponse("{}('{}')".format(func, dic_str))
跨源请求cors和jsonp的更多相关文章
- 启用跨源请求 (CORS)
https://docs.microsoft.com/zh-cn/aspnet/core/security/cors
- 已拦截跨源请求：同源策略禁止读取位于XXX的远程资源。（原因：CORS 头缺少 'Access-Control-Allow-Origin'
vue+springboot项目 前端发送请求微信 URL:http:/.........(企业微信的路径) 请求成功,数据发送过去可以接收到,处理完毕后发送返回值给我 我这边前端网络响应处可以看到返 ...
- Spring Boot全局支持CORS(跨源请求)
import org.springframework.context.annotation.Configuration; import org.springframework.web.servlet. ...
- 使用jsonp实现跨源请求
jsonp 该技术用来实现跨源请求,即向协议.域名.端口号不同的服务器发送请求 通过使用 script 标签的 src 向服务器发送GET请求http://xxx/xxx?callback=callb ...
- JS 跨源请求
一个 URL 大概包含的部分:scheme://host:port/path?#hash 比如一个 URL 为 http://www.xxx.com:8888/school/student.html, ...
- ArcGIS Server API for JavaScript调用错误：已阻止跨源请求：同源策略禁止读取位于......
已阻止跨源请求:同源策略禁止读取位于 http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapSe ...
- 跨源资源共享(CORS)概念、实现（用Spring）、起源介绍
本文内容引用自: https://howtodoinjava.com/spring5/webmvc/spring-mvc-cors-configuration/ https://developer.m ...
- Django-缓存机制、跨域请求(CORS)、ContentType组件
Django缓存机制: 在settings中间件里面设置: 三个粒度: 1 全站缓存 用中间件: MIDDLEWARE = [ # 'django.middleware.cache.UpdateCac ...
- Firebug: 已拦截跨源请求：同源策略禁止读取位于XXX的远程资源。（原因：CORS 头缺少 'Access-Control-Allow-
第一种,就是在被请求的程序中添加HTTP头,即CORS跨域(跨域资源共享,Cross-Origin Resource Sharing) 如: Response.Headers.Add("Ac ...
随机推荐
- SpringBoot项目改变图片临时文件的存储路径
springboot项目,部署到服务器后,运行一段时间后,处理文件上传的接口时,后报异常. Could not parse multipart servlet request; nested exce ...
- Google Java编程风格指南(中文+原始)
目录 前言 源文件基础 源文件结构 格式 命名约定 编程实践 Javadoc 后记 前言 这份文档是Google Java编程风格规范的完整定义.当且仅当一个Java源文件符合此文档中的规则, 我们才 ...
- H3C 端口隔离基本配置
- 2019-2-27-win10-uwp-去掉-Flyout-边框
title author date CreateTime categories win10 uwp 去掉 Flyout 边框 lindexi 2019-02-27 17:48:46 +0800 201 ...
- Linux 内核 ksets 之上的操作
对于初始化和设置, ksets 有一个接口非常类似于 kobjects. 下列函数存在: void kset_init(struct kset *kset); int kset_add(struct ...
- html根据下拉框选中的值修改背景颜色
错误的写法 <!doctype html><html><head><meta charset="utf-8"><title&g ...
- Priest John's Busiest Day (2-sat)
题面 John is the only priest in his town. September 1st is the John's busiest day in a year because th ...
- C# 强转空会不会出现异常
有小伙伴问我强转 null 会不会出现异常,我告诉他,如果是引用类型那么不会,如果是值类型,那么会出现空异常 如果是引用类型,只要是空类型,是支持随意转换,如下面代码,这是可以运行 class Pro ...
- API自动化测试指南
我相信自动化技能已经成为高级测试工程师总体技能的标配.敏捷和持续测试破坏了传统的测试自动化实践,导致测试工程师重新考虑自动化的完成方式.当今的自动化工程师需要在GUI的下方深入到API级别完成软件质量 ...
- Team Foundation Server 2015使用教程【8】：读取器tfs组的checkin权限修改