著作権についてお問い合わせ超簡単!AngularからLaravelへアクセスする方法!2019.01.11AngularHOMEITAngular超簡単!AngularからLaravelへアクセスする方法!AdvertisementAngularとLaravelの連携ってどうすんの?AngularとLaravelでの開発をしているのですが、AngularとLaravelの連携方法が分からなかったので色々調べてみました。実はすごく簡単に連携することが可能なのですが、情報が少なく困っておりました。普通にAngularからLaravelへアクセスすると。・Windows10・Angular7普通にAngularからLaravelへアクセスすると。access.普通にアクセスしようとすると、上記のようなエラーが出ます。詳しくは下記でご説明します。前提として、AngularとLaravelではポート番号が異なります。Angularlocalhost:4200Laravellocalhost:8080AngularからLaravelへアクセスする際、異なるオリジンへのアクセスは許可されていないため、デフォルトではアクセスできません。「異なるオリジンへのアクセスは許可されていない」は、JavaScriptがセキュリティを考慮しているためです。Laravel側で「異なるオリジンからのアクセスを許可する」ように設定する必要があります。Angular側の設定は特にありません。サーバ側の設定のみで完結します。$response;}}「App\Http\Middleware」に「Cors.php」を新規作成します。本ミドルウェアは、「localhost:4200」からのアクセスを許可するようにhttpヘッダを変更しています。[\App\Http\Middleware\Cors::class,\App\Http\Middleware\CheckForMaintenanceMode::class,\Illuminate\Foundation\Http\Middleware\ValidatePostSize::class,\App\Http\Middleware\TrimStrings::class,\Illuminate\Foundation\Http\Middleware\ConvertEmptyStringsToNull::class,\App\Http\Middleware\TrustProxies::class,];「App\Http\Kernel.php」に、先ほど作成した「Cors.php」を設定します。以下のサイトが参考になります。■laravel内でangularを使えるようにするURL:「https://mrkmyki.com/2018/10/24/laravel%E5%86%85%E3%81%A7angular%E3%82%92%E4%BD%BF%E3%81%88%E3%82%8B%E3%82%88%E3%81%86%E3%81%AB%E3%81%99%E3%82%8B%E3%80%82/」ただし、この方法だと「ビルドをしなくてはいけない」「Angularが重くなるとOutOfMemoryのエラーが出る」のでおすすめしません。僕は、AngularとLaravelの勉強をするのに以下の書籍を購入しました。カエレバ楽天市場Amazonまとめしかし、ネットの情報はワケの分からん情報ばっかりですね。これだけのことなのに、情報もそこまで出てこないですし。この記事が誰かの救いになれば幸いです。