本記事では、CakePHPにて、CORSエラーが発生した場合の対応方法を説明しています。
今回のCORSエラーでは、下記のエラーを想定しています。
|
1 |
Access to XMLHttpRequest at 'https://xxxx.com/api/test/1/' from origin 'https://xxxx.com' 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. |
参考サイト
なお、本記事では、下記の記事を参考にまとめています。
大変わかりやすく、きれいにまとまっているので、参照されることをおすすめいたします。
blocked by CORS policyというエラーが出たときの対処方法
なんとなく CORS がわかる...はもう終わりにする
また、CORSをよく理解していない場合には、こちらに記事に、CORSとは？という記事でまとめられています。
こちらも、参照されることをおすすめいたします。
プラグインを利用した対応方法
CORSエラーを解決するには、プラグインを導入することが、いちばん簡単かと思います。
cakephp-cors
導入するプラグインは、こちらのリンクになります。
ドキュメントに記載されている通り、installから、QuickStartまで、とても簡単です。
https://github.com/ozee31/cakephp-cors
ozee31/cakephp-cors: A CakePHP (3.3+) plugin for activate cors domain in your application (github.com)
install
最初に、composerを使用してプラグインをインストールします。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
composer require ozee31/cakephp-cors [xxxx@test sample]$ composer require ozee31/cakephp-cors Warning from https://repo.packagist.org: Support for Composer 1 is deprecated and some packages will not be available. You should upgrade to Composer 2. See https://blog.packagist.com/deprecating-composer-1-support/ Info from https://repo.packagist.org: #StandWithUkraine Using version ^2.0 for ozee31/cakephp-cors ./composer.json has been updated Loading composer repositories with package information Warning from https://repo.packagist.org: Support for Composer 1 is deprecated and some packages will not be available. You should upgrade to Composer 2. See https://blog.packagist.com/deprecating-composer-1-support/ Info from https://repo.packagist.org: #StandWithUkraine Updating dependencies (including require-dev) Package operations: 1 install, 0 updates, 0 removals - Installing ozee31/cakephp-cors (v2.0.0): Downloading (100%) Package ozee31/cakephp-cors is abandoned, you should avoid using it. No replacement was suggested. Writing lock file Generating autoload files |
プラグインの有効化
Corsのプラグインを有効にする
src\Application.phpに下記の内容を追加します。
|
1 2 3 4 5 6 7 8 |
public function bootstrap(): void { // Load more plugins here //下記を追加 $this->addPlugin('Cors'); } } |
上記の対応後でも、CSRFチェックでエラーになる場合があります。
この代表的な理由は、クライアントとサーバーで、別々のフレームワークを利用する場合などでよくあるエラーです。
このエラー対策方法は、API関連のCSRFチェックを行わない方法が、いちばん簡単かと思います。
その場合、こちらの記事を参考にしていただければと思います。
※CSRFを無効にするリスクを把握したうえで、対応してください
