一.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. 书籍推荐-An introduction to Data Science

    为什么要读这本书? 该书是由我们老师推荐的,通过学习此数,可以了解R语言的使用,也可以知道基本的数据分析方法. 看到Creating a Data Set in R -- 24页面

  2. mybatis + mysql 批量插入、删除、更新

    mybatis + mysql 批量插入.删除.更新 Student 表结构 批量插入 public int insertBatchStudent(List<Student> studen ...

  3. 2019-11-29-win7-无法启动-WPF-程序-D3Dcompiler_47.dll-丢失

    原文:2019-11-29-win7-无法启动-WPF-程序-D3Dcompiler_47.dll-丢失 title author date CreateTime categories win7 无法 ...

  4. “sgen.exe”未能运行。文件名或扩展名太长

    问题 创建项目后无法运行 严重性 代码 说明 项目 文件 行 禁止显示状态 错误 MSB6003 指定的任务可执行文件"sgen.exe"未能运行.System.Component ...

  5. laravel在使用Composer安装插件时要求输入授权用户名密码解决办法

    在使用laravel-china源时需要输入密码,坑,换源, 先换腾讯的不行,最后试一下阿里云的可以: composer config -g repo.packagist composer https ...

  6. LearnOpenGL笔记(1)搭建环境

    之前有写过Unity Shader,但不过是东拼西凑,对其中的原理可以说完全不清楚,现在准备好好从opengl开始,学习这基础又重要的内容. LearnOpenGL CN是一个超超超炒鸡好的openG ...

  7. python 进程和线程-线程和线程变量ThreadLocal

    线程 线程是由若干个进程组成的,所以一个进程至少包含一个线程:并且线程是操作系统直接支持的执行单元.多任务可以由多进程完成,也可由一个进程的多个线程来完成 Python的线程是真正的Posix Thr ...

  8. P2352 队爷的新书(差分)

    题目 P2352 队爷的新书 解析 题目意思是 给你n个区间,选择一个数x,使\(x\times覆盖x的区间个数\) 最大 和这个题差不多 差分,离散化一下,在区间的\(l\)处\(+1\),\(r+ ...

  9. 线程池---Day26

    线程池思想概述 当我们要使用线程的时候就去创建一个线程时,虽然实现方便,但是会出现问题:如果并发的线程数量很多,并且每个线程都是执行一个时间很短的任务就结束了,这样频繁创建线程就会大大降低系统的效率, ...

  10. 关于final

    最近见的一道选择题 刚学习一直认为final修饰,为常量,必须声明时被初始化,现在又明白第二种情况可以通过创建对象之后由构造方法立即初始化. 1.final修饰类不能被继承 2.final修饰方法不能 ...