【Laravel】CORS設定
CORS(Cross Origin Resource Sharing)
異なるオリジン間のアクセスを許可する仕組み
異なるオリジンというのは、ドメイン・プロトコル・ポートが異なるものを指す
なぜ必要か
ブラウザには同一オリジンポリシーというセキュリティ機能がある
異なるオリジンからの、JSからのリクエストをブロックする機能
api.test.comに、localhostからアクセスする場合、失敗するという感じ
Chromeのコンソールタブからも確認できる
code:js
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
email: 'test@example.com',
password: 'password123'
})
})
.then(response => response.json())
.then(data => {
console.log('Success:', data);
})
.catch(error => {
console.error('Error:', error);
});
Access to fetch at 'https://api.test.com/api/login' from origin 'http://localhost' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled. ? curlやPostmanでは検証できない
CORSはブラウザのセキュリティ制約のため、ブラウザで実行する必要がある
調整する
Laravel7以降はデフォルトでconfig/cors.phpがあるが、アップグレードなどした場合は自分で作る
$ php artisan vendor:publish --tag=cors
php artisan vendor:publish --tag=cors
INFO No publishable resources for tag cors. fruitcake/laravel-corsが導入されていないとこうなる。その場合は自分でconfig/cors.phpを作る