今天在使用fetch方法

fetch('xxx.com',{header:{bbbbbbb:111}})

浏览器返回的请求信息中,header变成了

:authority:koss.nocorp.me
:method:OPTIONS
:path:/?a=1
:scheme:https
accept:*/*
accept-encoding:gzip, deflate, br
accept-language:zh-CN,zh;q=0.8
access-control-request-headers:bbbbbbbbbbb
access-control-request-method:GET
origin:http://localhost:3333
referer:http://localhost:3333/
user-agent:Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.113 Safari/537.36

而该次请求的Request Method也变成了OPTION,不论是生成的奇怪请求头,还是OPTION方法,都是没有遇见过的。

这次请求与平时开发中发送的请求有以下几点不同

1.该次请求对象网站是跨域地址

2.本次请求添加的请求头服务端不会获取

遂根据浏览器返回的请求信息字段名进行查询,查询得知

access-control-request-headers:bbbbbbbbbbb
access-control-request-method:GET

名为预检头,是CORS请求中用于向服务端发送请求时获取准许的一个步骤。服务端的回应主要在Response 中的Access-Control-Allow-Origin字段体现。

具体相关信息可以查阅MDN:https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS

在fetch方法中添加header后遇到的预检请求问题的更多相关文章

  1. 怎样在UICollectionView中添加Header和footer

    ---恢复内容开始--- 怎样在UICollectionView中添加Header和footer 转载于http://my.oschina.net/zboy/blog/221525 摘要 来自-htt ...

  2. Cross-origin resource sharing JSON with Padding 同源策略 JSONP 为什么form表单提交没有跨域问题,但ajax提交有跨域问题? XMLHttpRequest and the Fetch API follow the same-origin policy 预检请求(preflight request)

    https://zh.wikipedia.org/wiki/跨来源资源共享 跨来源资源共享(CORS)是一份浏览器技术的规范,提供了 Web 服务从不同域传来沙盒脚本的方法,以避开浏览器的同源策略[1 ...

  3. 跨域请求中预检请求options之坑

    一.前言 因为跨域请求,浏览器可能(后面讲)会发送一次options请求,如果处理不好,跨域还是会gg的. 之前很少涉及跨域,涉及也是简单请求(下面阮老师文章中区别热简单请求和复杂请求),所以基本不会 ...

  4. StroyBoard中UICollectionView中添加Header和footer

    到Storyboard中,选择collection view controller中的"Collection View".在Attributes inspector中,选择&quo ...

  5. eclipse中添加server后,启动server,访问项目时,端口是怎么选择的。

    1   eclipse中添加了tomcat 2 设置端口时,可以在图2.1修改 也可以在图2.2修改 3 点击server的publish按钮,会将图2.2的配置文件和server中添加的项目同步到实 ...

  6. 跨域时发送预检请求,tp5的restful无options方法的解决方案

    解决 跨域问题解决 问题:使用vue-resource发送delete请求时报options请求404 思考:明明发送的是delete请求,为何变成了options请求? 答:跨域情况下,PUT,DE ...

  7. “display:block-inline形式的Span或Div中添加文字后,导致Span或Div排版掉落、错位”的原因及解决方法

    最近在使用3个span(或div)制作带圆角边框的按钮时,按照常识,把span的display设置成inline-block,这样就可以设置span的width和height了,很爽的~ 可是当我在中 ...

  8. postman 模拟请求中添加 header,post请求中传json参数

    1. GET 请求 2.Post 请求 (请求参数为Json,header中带有参数) 问题延伸 GET请求不能够 添加 Body 吗?[答案]

  9. 在MySQL或者SQLServer中,添加对象后自动返回主键到对象模型中的配置方式

    设置是否使用JDBC的getGenereatedKeys方法获取主键并赋值到keyProperty设置的领域模型属性中.MySQL和SQLServer执行auto-generated key fiel ...

随机推荐

  1. bzoj2120: 数颜色 [莫队][分块]

    Description 墨墨购买了一套N支彩色画笔(其中有些颜色可能相同),摆成一排,你需要回答墨墨的提问.墨墨会像你发布如下指令: 1. Q L R代表询问你从第L支画笔到第R支画笔中共有几种不同颜 ...

  2. [bzoj 2243]: [SDOI2011]染色 [树链剖分][线段树]

    Description 给定一棵有n个节点的无根树和m个操作,操作有2类: 1.将节点a到节点b路径上所有点都染成颜色c: 2.询问节点a到节点b路径上的颜色段数量(连续相同颜色被认为是同一段),如“ ...

  3. Sqlserver事务备份和还原实例

    create database mydb use mydb go create table account( id ), name ), balance float ) go select * fro ...

  4. JQueryEasyUI学习简单Demo

    一.Layout布局 声明:此文档参考了jQuery EasyUI官方文档 布局容器有5个区域:北.南.东.西和中间.中间区域面板是必须的,边缘的面板都是可选的.每个边缘区域面板都可以通过拖拽其边框改 ...

  5. JavaScript语法基础(1)

    1.JavaScript是什么? 1)定义: JavaScript「JS」是一种高级的.动态的. 弱类型的.解释型的计算机编程脚本语言. 2)原理: 3)组成: 3大部分: ◆ ECMAScript: ...

  6. 【JAVASCRIPT】React学习-巧用 props 的 children 属性实现内容填充

    背景 平常写组件,经常遇到需要获取内容放入组件内部的情形. 实现方法 我们有两种实现方式 1. 自定义 props render 的时候通过获取 this.props.content 填充到组件内部 ...

  7. mysql的并发处理机制_上篇

              回来写博客,少年前端时间被django迷了心魄           如果转载,请注明博文来源: www.cnblogs.com/xinysu/   ,版权归 博客园 苏家小萝卜 所 ...

  8. Python实现单词查询&文件查找

    最近学C++ Primer,做到第十二章有个习题.要求针对英文文本,对于用户想搜索的单词,打印出该单词在文本中出现的总次数,单词所出现行号及对应的行内容:单词在一行内出现多次,只打印该行一次.C++的 ...

  9. HTTP请求中的Form Data与Request Payload的区别

    前端开发中经常会用到AJAX发送异步请求,对于POST类型的请求会附带请求数据.而常用的两种传参方式为:Form Data 和 Request Payload. GET请求 使用get请求时,参数会以 ...

  10. gitbook初体验

    前言 在早些天看sec-wiki的时候,看到有同学做了一个ctf-wiki来介绍CTF,让CTF新手能够快速入门,做成了电子书的样子,放在github上面.页面精美.简洁,让人爱不惜手. 想着自己也能 ...