一.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. 2.1:CGPROGRAM

    文章著作权归作者所有.转载请联系作者,并在文中注明出处,给出原文链接. 本系列原更新于作者的github博客,这里给出链接. 前言 经过前面两个章节的铺垫,我们对渲染以及Unity Shaderlab ...

  2. 【CTS2019】氪金手游(动态规划)

    [CTS2019]氪金手游(动态规划) 题面 LOJ 洛谷 题解 首先不难发现整个图构成的结构是一棵树,如果这个东西是一个外向树的话,那么我们在意的只有这棵子树内的顺序关系,子树外的关系与这棵子树之间 ...

  3. Linux学习笔记之AIX系统上压缩与解压文件

    0x00 概述 AIX机器真难用,一时半会还真适应不了.   0x01 压缩tar 命令格式: # tar -cvf (或xvf)+文件名+设备 C:是本地到其他设备 x:是其他设备到本地 r:是追加 ...

  4. 初识Markdown

    目录 一.基础语法 二.语法规则 1.标题 2.列表 3.文字格式 4.链接 5.图片 6.引用 7.水平分隔线 8.代码块 9.表格 10.文档目录 11.转义定义 写在前面 Markdown(简称 ...

  5. 记录一次OracleJDK开发的项目发部到Linux中使用OpenJDK启动后失败的错误的解决方案

    一.现象 基于JAVA SpringBoot2.0.4的项目,发部后项目发部后,放到OpenJDK环境中运行时,提示下列错误: 2019-10-22 10:03:55 [main] WARN  o.s ...

  6. Python关于多继承

    大部分面向对象的编程语言(除了C++)都只支持单继承,而不支持多继承,为什么呢?因为多继承不仅增加编程复杂度,而且容易导致莫名其妙的错误. Python虽然语法上支持多继承,但是却不推荐使用多继承,而 ...

  7. Spring IOC 复习

    Inversion of Control 将创建对象的权利交给框架,包括DI(Dependency Injection,依赖注入)和DL(Dependency Lookup,依赖查找),能削减计算机程 ...

  8. 一、NodeJS入门——准备工作(1)——NodeJS的安装

    目录 1.介绍 2.nodejs下载 3.nodejs安装 4.nodejs的简单实用 5.nodejs的经典入门:hello world 6.总结 1    介绍 这是一系列的内容主要是关于我在学习 ...

  9. redis的两种持久化方案

    前言 人生在于折腾系列,网络,多线程等系列博客楼主还在继续折腾也不会放弃.缓存的知识其实并不仅仅在于简单的增删改查,我觉得有必要全面深入的学习一波.记录学习的过程与体悟. RDB 什么是RDB 对re ...

  10. ASP.NET Core MVC上传文件

    使用模型绑定上传小文件 HTML代码: <form method="post" enctype="multipart/form-data" asp-con ...