I got a message from chrome console when I'm trying to make a request in javascript:
Access to XMLHttpRequest at 'https://SITE_B'
from origin 'https://SITE_A' has been blocked by
CORS policy: Request header field x-csrf-token is not
allowed by Access-Control-Allow-Headers in preflight response.
So, SITE_A is a laravel website with valid SSL certificate as well as SITE_B (a simple website). I have the hand over the two websites. My desire is to make a request in javascript from SITE_B to SITE_A in javascript using a POST request and the API system from Laravel.
The idea works well without SSL protocol.
I really don't understand the message.
I put a '*' in 'allowedMethods' and 'allowedHeaders' in laravel config. And I also put it in the apache config file in the SITE_A server.
What do I miss?
EDIT: Barry white extension config
return [
/*
|--------------------------------------------------------------------------
| Laravel CORS
|--------------------------------------------------------------------------
|
| allowedOrigins, allowedHeaders and allowedMethods can be set to array('*')
| to accept any value.
|
*/
'supportsCredentials' => false,
'allowedOrigins' => ['*'],
'allowedOriginsPatterns' => [],
'allowedHeaders' => ['*'],
'allowedMethods' => ['GET', 'POST'],
'exposedHeaders' => [],
'maxAge' => 0,
];
Edit²:
Utility.createRequest = function (method, url, params, callback, doNotReadResponse)
{
"use strict";
if ( Utility.debug )
{
if ( params )
{
console.log('[DEBUG] %s request\n%s?%s', method, url, params);
}
else
{
console.log('[DEBUG] %s request\n%s (No parameters)', method, url);
}
}
/* On crée la requête POST. */
const xhr = new XMLHttpRequest();
xhr.onreadystatechange = function (event) {
if ( event.currentTarget.readyState !== XMLHttpRequest.DONE )
{
return;
}
if ( event.currentTarget.status === 200 )
{
if ( Utility.debug )
{
console.log(event.currentTarget);
}
if ( !doNotReadResponse )
{
var response = JSON.parse(event.currentTarget.responseText);
/* Si on a un callback. */
if ( callback )
{
/* NOTE: on vérifie que notre serveur ne renvoit aucune erreur de traîtement. */
callback(response.ErrorCode === 0, response.Message, response);
}
}
else if ( callback )
{
callback(true, "Server responded !", event.currentTarget.response);
}
}
else
{
if ( callback )
{
callback(false, 'HTTP CODE ' + event.currentTarget.status + ' : "' + event.currentTarget.statusText + '".', event.currentTarget.responseText);
}
else
{
console.error('HTTP CODE %d : "%s".', event.currentTarget.status, event.currentTarget.statusText);
}
console.error(event.currentTarget.responseText);
}
};
var csrf = Utility.getMeta('csrf-token');
if ( csrf.length <= 0 )
{
console.error('Unable to find "X-CSRF-TOKEN" in the web page !');
return false;
}
if ( Utility.debug )
{
console.log("Using 'X-CSRF-TOKEN:%s'.", csrf);
}
switch ( method.toLowerCase() )
{
case 'post' :
xhr.open('POST', url, true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.setRequestHeader('X-CSRF-TOKEN', csrf);
xhr.setRequestHeader('Accept', 'application/json');
xhr.setRequestHeader('Authorization', 'Bearer ' + Utility.userToken);
/* DEBUG: Remove */
//xhr.send(params);
xhr.send((params ? params + '&' : '') + 'referer_override=1');
break;
case 'get' :
xhr.open('GET', url + ( params ? '?' + params : '' ), true);
xhr.setRequestHeader('X-CSRF-TOKEN', csrf);
xhr.setRequestHeader('Accept', 'application/json');
xhr.setRequestHeader('Authorization', 'Bearer ' + Utility.userToken);
xhr.send();
break;
default:
return false;
}
return true;
};
'allowedHeaders' => ['*'],
In this line you need to write headers which you allow, now a '*'
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.