一.jsonp(解决跨域)思路介绍:

因浏览器的同源策略不会拦截link标签内的src请求,所以利用这一点,我们把后端开放的接口路径放在src内,

其在发送请求后会自动接收返回的东西,所以我们可以给要返回的内容进行特殊的处理;具体做法:

1. 使用个变量加括号的形式,把要返回的内容放入括号内

列如: return HttpResponse( "handlerResponse('返回内容')" )

2. 在html页面script标签对内放置个函数,让函数名等同于后端传来的变量名即可

function handlerResponse(data) {   # data参数接收的就是后端真正想要返回的内容.

// do something....

alert(data)

}

3. 原理: 前端src出接收到的内容就是handlerResponse('返回内容')这种形式,而html页面内又定义了

handlerResponse为一个函数名,加括号就是调用的形式,正好会把其所要传送的东西以参数的形式被

data所接收,此时在函数内操作处理即可.

缺点: jsonp只能发送get请求,无法处理post请求,且get请求时无法指定contentytype等

二.加请求头方式:

我们先了解下跨域请求的分类(简单和复杂):

HTTP方法是下列方法之一

  HEAD, GET,POST

HTTP头信息不超出以下几种字段

  Accept, Accept-Language, Content-Language, Last-Event-ID

  Content-Type只能是下列类型中的一个

    application/x-www-from-urlencoded   # form表单提交数据

    multipart/form-data  # 权限类型

    text/plain  # 文本类型

任何一个不满足上述要求的请求,即会被认为是复杂请求~~

复杂请求会先发出一个预请求,我们也叫预检,即OPTIONS请求~~

原理,在请求返回给浏览器前,给响应内容加上头部信息,让浏览器放行即可.

from django.utils.deprecation import MiddlewareMixin
class MyCors(MiddlewareMixin):
    def process_response(self, request, response):
        response["Access-Control-Allow-Origin"] = "*"  # 放行所有简单请求
        if request.method == "OPTIONS":
            # 复杂请求会先发预检
            response["Access-Control-Allow-Headers"] = "Content-Type"  # 内容类型
            response["Access-Control-Allow-Methods"] = "PUT,PATCH,DELETE" # 复杂请求方式
        return response

jsonp原理,跨域请求头处理的更多相关文章

  1. 关于使用Jsonp做跨域请求

    今天在使用Jsonp做跨域请求的练习时碰上这样一个问题 代码如下 <!DOCTYPE html> <html> <head> <meta charset=&q ...

  2. 使用jsonp进行跨域请求

    使用jsonp进行跨域请求 在实际的业务中很多时候需要用到跨域请求,然而jsonp为我们提供了一种非常方便的跨域请求的方式,具体实现代码如下: $.ajax({ type:"get" ...

  3. nodeJS中express框架设置全局跨域请求头

    //设置跨域请求头 router.all('*', function(req, res, next) { res.header("Access-Control-Allow-Origin&qu ...

  4. 利用JSONP实现跨域请求

    前言:有时候一忙起来就没了时间观念,原来我已经有十多天没写博客了.一直想做跨域方面的尝试,无奈最近准备校招没时间动动手.今天就先讲讲JSONP吧,昨晚还在研究QQ空间日志里面网络图片的问题呢,我发现日 ...

  5. mvc中使用jsonp进行跨域请求详细说明

    在web开发中,如果你要在不同域下进行数据异步请求,会出现一个No ‘Access-Control-Allow-Origin’ header is present on the requested r ...

  6. CORS和jsonp实现跨域请求

    同源策略:所谓同源是指,域名,协议,端口相同,它是由Netscape提出的一个著名的安全策略,现在所有支持JavaScript 的浏览器都会使用这个策略.当浏览器同时打开两个tab页面(两个不同服务器 ...

  7. 来说说SpringMVC + JSONP的跨域请求

    先来说说场景,JSON,这货大家应该都懂,不懂的请自动面壁思过,那么什么是JSONP,不是JSON放了个P就叫JSONP,而是JSON with Padding,在进行跨域请求的时候需要的数据,什么是 ...

  8. 不用jsonp实现跨域请求

    这几天要用到跨域请求,我在网上找了好多资料,最后自己研究出来一个比较简单方便的, 请求的过程和jquery普通的ajax一样.我用的是.net平台 ,IIS7.5 来看一下后台的代码,我是用MVC的C ...

  9. Nginx反向代理、CORS、JSONP等跨域请求解决方法总结

    由于 Javascript 同源策略的存在使得一个源中加载来自其它源中资源的行为受到了限制.即会出现跨域请求禁止. 通俗一点说就是如果存在协议.域名.端口或者子域名不同服务端,或一者为IP地址,一者为 ...

随机推荐

  1. linux 查看用户列表

    cat /etc/passwd|grep -v nologin|grep -v halt|grep -v shutdown|awk -F":" '{ print $1"| ...

  2. PHP接口并发测试的方法

    PHP接口并发测试的方法 <pre> header('Content-type:text/html; Charset=utf-8'); $uri = "输入你的url" ...

  3. 【计算机组成原理】中央处理器CPU

    一.CPU的功能和基本结构 1.功能 当用计算机解决某个问题是,我们首先必须为他编写程序,程序是一个指令序列,这个序列明确告诉计算机应该执行什么操作,在什么地方找到用来操作的数据,一旦把程序装入内存器 ...

  4. 【UOJ#32】【UR #2】跳蚤公路(最短路)

    [UOJ#32][UR #2]跳蚤公路(最短路) 题面 UOJ 题解 不难发现要求的就是是否存在负环.也就是我们只需要找到所有的负的简单环,很容易就可以想到维护路径上和\(x\)相关的内容,即维护一下 ...

  5. THUSC2019去不了记

    因为泥萌都去SC了,就我在学校里考水考模拟,所以这就变成了水考模拟游记了 Day1 早上本来要到教室早读,发现教室被由年级前\(100\)的非竞赛生的dalao给占据了,发现聪聪在里面,于是进去愉快的 ...

  6. DOM事件机制解惑(摘)--事件的传播机制

    DOM事件流 为什么是有事件流? 假如在一个button上注册了一个click事件,又在其它父元素div上注册了一个click事件,那么当我们点击button,是先触发父元素上的事件,还是button ...

  7. excel中统计COUNTIFS的值为0

    excel中统计COUNTIFS的值为0 个人认为是由于导出的文件里面的字符个数问题 使用 =COUNTIFS(H1:H175,"微信支付") 这个的结果居然是0,找了很多办法 于 ...

  8. .Net Core中文编码问题

    原文:https://www.cnblogs.com/ideacore/p/6964771.html 问题 .net core环境下,使用HttpClient执行GetStringAsync的时候,报 ...

  9. C# do...while循环

    一.简介 在for和while的循环是在头部写测试循环条件,而do....while的循环是在循环的尾部写测试条件 do...while的循环和while的类似,但是do...while的最少执行一次 ...

  10. python 练习题:计算的BMI指数,并根据BMI指数条件选择

    小明身高1.75,体重80.5kg.请根据BMI公式(体重除以身高的平方)帮小明计算他的BMI指数,并根据BMI指数:低于18.5:过轻18.5-25:正常25-28:过重28-32:肥胖高于32:严 ...