Last active
October 25, 2016 22:05
-
-
Save jurosh/7f984d421712909e44627c6e2c471fbe to your computer and use it in GitHub Desktop.
OPTIONS Preflight request | fetch
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<body> | |
<script> | |
// Alternative fetch('http://biz.jurosh.local/packages/test.php', {headers: {'Content-Type': 'application/json'}}) | |
fetch('http://biz.jurosh.local/packages/test.php', {method: 'PUT'}) | |
.then(data => console.log('DATA!')); | |
// Accept is like: Here is my request and I would like (to Accept) this response format | |
// Content-Type is like: Here is my request (or response) and this (Content-Type) is the format of the content I am sending in my request (or response) | |
</script> | |
</body> | |
</html> | |
<?php | |
header('Content-Type: application/json'); | |
header('Access-Control-Allow-Origin: *'); | |
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept"); | |
header("Access-Control-Allow-Methods: GET, POST, PUT, DELETE"); | |
echo 'AHOJ!'; | |
sleep(2); | |
// Notes: | |
/* | |
https://www.w3.org/TR/cors/ | |
- It gets slightly more complicated if the resource author wants to be able to handle cross-origin requests using methods other than simple methods. In that case the author needs to reply to a preflight request that uses the OPTIONS method and then needs to handle the actual request that uses the desired method (DELETE in this example) and give an appropriate response. The response to the preflight request..... | |
- POST: A header is said to be a simple header if the header field name is an ASCII case-insensitive match for Accept, Accept-Language, or Content-Language or if it is an ASCII case-insensitive match for Content-Type and the header field value media type (excluding parameters) is an ASCII case-insensitive match for application/x-www-form-urlencoded, multipart/form-data, or text/plain. | |
- other than GET, HEAD, POST: eg. PUT - always | |
// http://stackoverflow.com/questions/8685678/cors-how-do-preflight-an-httprequest | |
During the preflight request, you should see the following two headers: Access-Control-Request-Method and Access-Control-Request-Headers. These request headers are asking the server for permissions to make the actual request. Your preflight response needs to acknowledge these headers in order for the actual request to work. | |
// Fetch api: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch | |
// http://stackoverflow.com/questions/15381105/cors-what-is-the-motivation-behind-introducing-preflight-requests | |
*/ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment