HTTP 之 options预请求
一、HTTP一共有八种常见请求方法
- get:参数在url上,浏览器长度有限制,不安全
- post:参数不可见,长度不受限制
- put:上传最新内容到指定位置
- delete:删除请求的url所表示的资源
- head:不返回相应主体,主要用于客户端查看服务器性能
- options:与head类似,是客户端用于查看服务器的性能 。JavaScript的XMLHttpRequest对象进行CORS跨域资源共享时,就是使用OPTIONS方法发送嗅探请求,以判断是否有对指定资源的访问权限
- connect:http1.1预留的,将连接方式改为管道方式,通常用于SSL加密服务器的链接与 HTTP非加密的代理服务器之间的通信
- trace:请求服务器[回显收到的请求信息]主要用于HTTP请求的测试或诊断
- patch:出现的较晚,用于更新局部的资源,不存在时,会创建一个新的(http1.1之后使用的较多的)
一般来说我们只需要用到post和get,但是如果后端是ResetFul设计规范下就需要用到各种语义化的方法了
二、什么是预请求?
跨域请求中,浏览器自发的发起的预请求,浏览器会查询到两次请求,第一次的请求参数是options,以检测试实际请求是否可以被浏览器接受
三、为什么需要?
w3c规范要求,对复杂请求,浏览器必须先使用options发起一个预检请求,从而获知服务器是否允许该跨域请求,服务器确认以后才能发起实际的HTTP请求,否则停止第二次正式请求。
那为什么我们不常见options请求呢??
因为大部分我们使用的是get,post请求,他们属于简单请求,而简单请求不会触发options请求。
那什么情况下会发生options请求呢???
四、什么情况下发生?(以下都属于复杂请求)
- 请求方法不是get head post
- post 的content-type不是application/x-www-form-urlencode,multipart/form-data,text/plain [也就是把content-type设置成"application/json"]
- 请求设置了自定义的header字段: 比如业务需求,传一个字段,方面后端获取,不需要每个接口都传
例如设置了post请求的content-type:application/json,就会发生预请求
五、为什么需要设置成contentType:"application/json"
ajax发送复杂的json数据结构, 处理方式困难, 服务器端难以解析, 所以就有了application/json这种类型(数据格式的声明)
服务端好解析并且比较统一,如果你请求中没有设置成json格式的,有的服务端收到后也会改成json格式的,但是如何请求中就改成了json格式的就会发生options预请求
if设置了:
- 表示json格式的字符串,发送的json对象必须使用json.stringify进行序列化字符串才能匹配
- spring 需要使用@RequestBody来注解
if没设置:
- 默认将使用contentType: "application/json”application/x-www-form-urlencoded
六、需要配置什么?
在 CORS 中,可以使用 OPTIONS 方法发起一个预检请求,服务器基于从预检请求获得的信息来判断,以检测实际请求是否可以被服务器所接受。
1.预请求的请求报文中要设置
- Access-Control-Request-Method首部字段: 告知服务器实际请求所使用的 HTTP 方法;
- Access-Control-Request-Headers首部字段: 告知服务器实际请求所携带的自定义首部字段。
2.同时服务端或者nginx 需要设置响应体
"Access-Control-Allow-Origin" : * 【跨域】
Access-Control-Allow-Methods:POST,GET,OPTIONS,DELEDET 【所允许的请求方法告知客户端】
Access-Control-Allow-Headers: X-Requested-With, accept, origin, content-type【自定义的请求头】
Access-Control-Allow-Age:3600
【一段时间内不需要再次预请求,直接用本次结果即可】
"Content-Type", "application/json;charset=utf-8"
七、options作用
OPTIONS请求方法的主要用途有两个:
- 获取服务器支持的HTTP请求方法;也是黑客经常使用的方法。
- 用来检查服务器的性能。例如:AJAX进行跨域请求时的预检,需要向另外一个域名的资源发送一个options请求头,用以判断实际发送的请求是否安全。
八、跨域方法:
- JSONP跨域:动态生成script标签,只支持get请求,但是兼容性比较好可以支持老浏览器
- CORS跨源资源共享:options请求做嗅探
- webSockted:全双工通信
- img src :不受浏览器的同源限制
HTTP 之 options预请求的更多相关文章
- AJAX跨域POST发送json时,会先发送一个OPTIONS预请求
我们会发现,在很多post,put,delete等请求之前,会有一次options请求. 根本原因就是,W3C规范这样要求了!在跨域请求中,分为简单请求(get和部分post,post时content ...
- OPTIONS预检请求
OPTIONS预检请求 背景:像后台发送一个post请求,出错,错误代码403(权限验证未通过),查看请求方法变成OPTIONS.检查请求头得知,当前请求token未带上,问题,为什么post请求变成 ...
- http预请求 options
问题 使用axios请求接口时,出现了发出两次请求的情况:一个是请求OPTIONS,一个是正常的POST请求:查资料发现与跨域请求有关. 概念 MDN中有提到: 出于安全原因,浏览器限制从脚本内发起的 ...
- 对CROS OPTIONS预检请求的一些思考
前后端分离模大势所趋,跨域问题更是老生常谈. 问题背景: 浏览器最基本的安全规范-同源策略.所谓同源是指域名.协议.端口相同.不同源的浏览器脚本(javascript.ActionScript.can ...
- OPTIONS的预请求(Preflighted Request)
OPTIONS的预请求(Preflighted Request) Ajax 请求中出现OPTIONS(Request Method: OPTIONS)_qiao-CSDN博客 https://blog ...
- http预请求options
在有很多情况下,当我们在js里面调用一次ajax请求时,在浏览器那边却会查询到两次请求,第一次的Request Method参数是OPTIONS,还有一次就是我们真正的请求,比如get或是post请求 ...
- cors 预请求
1.CORS的其他限制 默认允许的方法只有:GET.HEAD.POST默认允许的Content-Type:text/plain.multipart/form-data.applicaton/x-www ...
- CORS跨域限制以及预请求验证
之前我们可以通过“Access-Control-Allow-Origin”,实现跨域请求,那是不是所有跨域请求都可以通过设置Access-Control-Allow-Origin实现跨域请求呢?显然不 ...
- 彻底解决Asp.netCore WebApi 3.1 跨域时的预检查204 options重复请求的问题
Asp.netCore WebApi 3.1 跨域的预检查options问题 1:我们直接使用core跨域的中间件 ,注入跨域服务, services.AddCors(options => { ...
随机推荐
- Python3使用Print输出彩色字体
一.介绍 在一些开发程序中,有些输出消息需要突出显示,我们可以尝试着给他们换上更靓丽的颜色来突出显示. 二.实现过程 终端的字符颜色是用转义序列控制的,是文本模式下的系统显示功能,和具体的语言无关. ...
- 【Python+postman接口自动化测试】(3)什么是接口测试?
什么是接口测试? 接口测试是测试系统组件间接口的一种测试.接口测试主要用于检测外部系统与系统之间以及内部各个子系统之间的交互点.测试的重点是要检查数据的交换.传递和控制管理过程,以及系统间的相互逻辑依 ...
- 学习JS的第一天--初识JS
1.初识JS a.我的第一个JS程序: document.write("Hello JS")://这段代码是输出到body中就是直接打开就可以看到: console.log(&qu ...
- IO流(二)
一:字符流 字符输入流 写入文件字符流 import java.io.FileWriter; import java.io.IOException; //fileWriter public class ...
- 详解电子表格中的json数据:序列化与反序列化
从XML到JSON 当下应用开发常见的B/S架构之下,我们会遇到很多需要进行前后端数据传输的场景.而在这个传输的过程中,数据通过何种格式传输.方式是否迅速便捷.书写方式是否简单易学,都成为了程序员在开 ...
- 关于新手使用mpb开发代码的一些小知识
mac 前端端口占用解决 1.查看8080端口,复制进程PID lsof -i :8080 2.杀死进程 kill -9 「进程PID」 如果你的mac不能使用sudo解决办法 错误提示 ...
- 通过修改host加速访问GitHub
加速访问GitHub 原理:绕过 DNS 解析,直接使用本地的 DNS 记录进行直接跳转. 可以通过 http://ping.chinaz.com/ 链接查询github的DNS信息,例如,可以直接打 ...
- hexo+腾讯云
hexo+腾讯云主机搭建博客 参考链接1 参考链接2 参考链接3 说明:不建议用hexo在云主机上搭建博客,感觉多此一举,建议hexo+github, wordpress+云主机(宝塔界面更快哦) 一 ...
- 躺平吧,平铺的窗口「GitHub 热点速览 v.21.47」
作者:HelloGitHub-小鱼干 用 macOS 系统经常会遇到的一个问题便是多开窗口如何快速找寻的问题,本周特推项目 yabai 便是来解决这个问题的.直接把所有窗口平铺,是不是很"正 ...
- Redis | 第一部分:数据结构与对象 中篇《Redis设计与实现》
目录 前言 1. 跳跃表 1.1 跳跃表与其节点的定义 1.2 跳跃表的API 2. 整数集合 2.1 整数集合的实现 2.2 整数集合的类型升级 2.3 整数集合的API 3. 压缩列表 3.1 压 ...