Home > Web Front-end > JS Tutorial > How to solve the preflight request encountered after adding header in the fetch method

How to solve the preflight request encountered after adding header in the fetch method

巴扎黑
Release: 2017-09-01 11:37:20
Original
2971 people have browsed it

The following editor will bring you a brief discussion of the preflight request problems encountered after adding headers in the fetch method. The editor thinks it’s pretty good, so I’ll share it with you now and give it as a reference. Let’s follow the editor and take a look.

Today, using the fetch method


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

In the request information returned by the browser, header It became


: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
Copy after login

and the Request Method of this request also became OPTION. Whether it is the strange request header generated or the OPTION method, I have never seen it before. .

This request is different from the requests sent during normal development in the following points

1. The website targeted for this request is Cross-domain address

2. The server will not obtain the request header added in this request

, so it will query based on the request information field name returned by the browser. , the query found that


access-control-request-headers:bbbbbbbbbbb
access-control-request-method:GET
Copy after login

is called the preflight header, which is a step in the CORS request to obtain permission when sending a request to the server. The server's response is mainly reflected in the Access-Control-Allow-Origin field in Response.

The above is the detailed content of How to solve the preflight request encountered after adding header in the fetch method. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template