LaravelプロジェクトにBreezeをインストールする方法(API連携)

LaravelプロジェクトにBreezeをインストールする方法(API連携)

備忘録として残します。

Laravelプロジェクトは出来ているとする

https://zenn.dev/funayamateppei/articles/a758926d1a05db

フォルダに移動してcomposeコマンドを利用してbreezeパッケージのインストールを行う

$ cd YOUR_FILENAME
$ composer require laravel/breeze --dev

breezeのインストールが完了するとphp artisan breezeコマンドで利用できる

api用のscaffoldingの作成

API用のScaffolding(骨組み)がインストールされる

$ php artisan breeze:install api
or
$ ./vendor/bin/sail artisan breeze:install api

下はsail使用時のコマンド

artisanコマンドを実行すると.envファイルに環境変数のFRONTEND_URLが設定される

FRONTEND_URL=http://localhost:3000

フロントエンドとバックエンドのオリジンが異なっていても通信が行えるようにCORS(Cross-Origin Resource Sharing)の設定も行われる
configフォルダのcors.phpファイルを確認すると.envファイルに設定したFRONTEND_URLがallowed_originsの配列に含まれていることが確認できる

return [

    /*
    |--------------------------------------------------------------------------
    | Cross-Origin Resource Sharing (CORS) Configuration
    |--------------------------------------------------------------------------
    |
    | Here you may configure your settings for cross-origin resource sharing
    | or "CORS". This determines what cross-origin operations may execute
    | in web browsers. You are free to adjust these settings as needed.
    |
    | To learn more: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
    |
    */

    'paths' => ['*'],

    'allowed_methods' => ['*'],

    'allowed_origins' => [env('FRONTEND_URL')],

    'allowed_origins_patterns' => [],

    'allowed_headers' => ['*'],

    'exposed_headers' => [],

    'max_age' => 0,

    'supports_credentials' => true,

];