当前位置:网站首页>Web Security (2) -- cross domain resource sharing
Web Security (2) -- cross domain resource sharing
2020-11-07 20:56:34 【Coxhuang】
List of articles
- Cross-domain resource sharing (CORS)
- #1 What is? CORS
- #2 Two requests
- #3 Request process
- #3.1 A simple request
- #3.2 Complex request
Cross-domain resource sharing (CORS)
#1 What is? CORS
CORS It's a W3C standard , The full name is " Cross-domain resource sharing "(Cross-origin resource sharing).
It allows the browser to cross to the source server , issue XMLHttpRequest request , To overcome AJAX A restriction that can only be used with the same origin .
Whole CORS Communication process , It's all done automatically by the browser , No user involvement is required . For developers ,CORS Correspondence and homology AJAX There is no difference in communication , The code is exactly the same . Once the browser finds AJAX Request cross source , Will automatically add some additional header information , Sometimes there is an additional request , But users don't feel .
therefore , Realization CORS The key to communication is the server . As long as the server implements it CORS Interface , You can communicate across sources .
#2 Two requests
The browser will CORS Requests fall into two categories : A simple request (simple request) And not a simple request (not-so-simple request).
- A simple request
As long as the following two conditions are met , It's a simple request .
- The request method is one of three :
- HEAD
- GET
- POST
- HTTP The header information of does not exceed the following fields :
- Accept
- Accept-Language
- Content-Language
- Last-Event-ID
- Content-Type: Three values only application/x-www-form-urlencoded、multipart/form-data、text/plain
If the above two conditions are not met at the same time , It's not a simple request .
2. Complex request
Not satisfied with the above simple , It's all complex requests
#3 Request process
#3.1 A simple request
When browsers find cross domain Ajax It's a simple request , Will go through the following process :
- browser : brother , You need cross domain request ! I have to ask the server elder brother to agree , I'm in your header Riga Origin Information , Let the server know where you are from
- The server : Who are you from , Show your Origin Show me ( Big brother of the server has Origin And your own Origin Compare ), Within my permission , Allow access to the server
[ Failed to transfer the external chain picture , The origin station may have anti-theft chain mechanism , It is suggested to save the pictures and upload them directly (img-aKvZLMX8-1584912081477)(https://raw.githubusercontent.com/Coxhuang/yosoro/master/20200323031039.png)]
Server configuration CORS
// Specifies that other domains are allowed to access 'Access-Control-Allow-Origin:http://admin.minhung.me:19700'// General usage (*, Specify domain , Dynamic setting ),3 Because * It is not allowed to carry the authentication head and cookies // Whether to allow subsequent requests to carry authentication information (cookies), The value can only be true, Otherwise do not return 'Access-Control-Allow-Credentials:true'
Access-Control-Allow-Origin There are many ways to set it :
- Set up It's the simplest and most crude , But the server is for security reasons , Definitely not , and , If it is Words , The viewer will not send cookies, Even if your XHR Set up withCredentials
- Dynamically set to request domain , When many people work together , Multiple front ends to one back end , It's convenient
#3.2 Complex request
The most common situation is , When we use PUT
perhaps DELETE
When asked , The browser will send option
( preview ) request
Unlike simple requests ,option More requests 2 A field :
- Access-Control-Request-Method: This field is required , Used to list the browser's CORS What will be used in the request HTTP Method .
- Access-Control-Request-Headers: This field is a comma separated string , Specify browser CORS The request will send additional header information fields
Access-Control-Request-Method,Access-Control-Request-Headers It returns all requests that satisfy the server's requirements , Request header , Not limited to the request , Server received " preview " After the request , Checked Origin、Access-Control-Request-Method and Access-Control-Request-Headers After fields , Confirm that cross source requests are allowed , You can respond .
HTTP/1.1 200 OK Access-Control-Allow-Origin: http://api.minhung.me:19800 Access-Control-Allow-Methods: GET, POST, PUT Access-Control-Allow-Headers: X-Custom-Header Content-Type: text/html; charset=utf-8 Content-Encoding: gzip Content-Length: 0 Keep-Alive: timeout=2, max=100 Connection: Keep-Alive Content-Type: text/plain
above HTTP Responding , The key is Access-Control-Allow-Origin Field , Express http://api.minhung.me:19800 Can request data . This field can also be set to asterisk , Indicates consent to any cross source request .
If the browser denies " preview " request , Will return to a normal HTTP Respond , But nothing CORS Related header information fields . At this time , The browser will assume that , The server does not agree with the pre check request , So trigger an error , By XMLHttpRequest Object's onerror Callback function capture . The console will print out the following error message .
Once the server passes " preview " request , Every time the browser is normal CORS request , Just like a simple request , There will be one. Origin Header information field . Server response , There will always be one Access-Control-Allow-Origin Header information field .
Participation of this paper Tencent cloud media sharing plan , You are welcome to join us , share .
版权声明
本文为[Coxhuang]所创,转载请带上原文链接,感谢
边栏推荐
- C++ 数字、string和char*的转换
- C++学习——centos7上部署C++开发环境
- C++学习——一步步学会写Makefile
- C++学习——临时对象的产生与优化
- C++学习——对象的引用的用法
- C++编程经验(6):使用C++风格的类型转换
- Won the CKA + CKS certificate with the highest gold content in kubernetes in 31 days!
- C + + number, string and char * conversion
- C + + Learning -- capacity() and resize() in C + +
- C + + Learning -- about code performance optimization
猜你喜欢
-
C + + programming experience (6): using C + + style type conversion
-
Latest party and government work report ppt - Park ppt
-
在线身份证号码提取生日工具
-
Online ID number extraction birthday tool
-
️野指针?悬空指针?️ 一文带你搞懂!
-
Field pointer? Dangling pointer? This article will help you understand!
-
HCNA Routing&Switching之GVRP
-
GVRP of hcna Routing & Switching
-
Seq2Seq实现闲聊机器人
-
【闲聊机器人】seq2seq模型的原理
随机推荐
- LeetCode 91. 解码方法
- Seq2seq implements chat robot
- [chat robot] principle of seq2seq model
- Leetcode 91. Decoding method
- HCNA Routing&Switching之GVRP
- GVRP of hcna Routing & Switching
- HDU7016 Random Walk 2
- [Code+#1]Yazid 的新生舞会
- CF1548C The Three Little Pigs
- HDU7033 Typing Contest
- HDU7016 Random Walk 2
- [code + 1] Yazid's freshman ball
- CF1548C The Three Little Pigs
- HDU7033 Typing Contest
- Qt Creator 自动补齐变慢的解决
- HALCON 20.11:如何处理标定助手品质问题
- HALCON 20.11:标定助手使用注意事项
- Solution of QT creator's automatic replenishment slowing down
- Halcon 20.11: how to deal with the quality problem of calibration assistant
- Halcon 20.11: precautions for use of calibration assistant
- “十大科学技术问题”揭晓!|青年科学家50²论坛
- "Top ten scientific and technological issues" announced| Young scientists 50 ² forum
- 求反转链表
- Reverse linked list
- js的数据类型
- JS data type
- 记一次文件读写遇到的bug
- Remember the bug encountered in reading and writing a file
- 单例模式
- Singleton mode
- 在这个 N 多编程语言争霸的世界,C++ 究竟还有没有未来?
- In this world of N programming languages, is there a future for C + +?
- es6模板字符
- js Promise
- js 数组方法 回顾
- ES6 template characters
- js Promise
- JS array method review
- 【Golang】️走进 Go 语言️ 第一课 Hello World
- [golang] go into go language lesson 1 Hello World