Laravelでクロスオリジン、CORS (Cross-Origin Resource Sharing) に対応する方法。
対応用のLaravelライブラリがあるのでそれを利用する。
JSからajaxなどで通信する場合、ドメインをまたいだ通信の場合(クロスオリジン)はセキュリティ上禁止されている。
ので、それを通信を受けるサーバーサイドで許可してやる。
barryvdh/laravel-cors
ライブラリがあるので、そちらを利用する。
インストール
Composerで導入する。
1
| $ composer require barryvdh/laravel-cors
|
セットアップ
config/app.php
の providers
の配列に以下を追加。
1
| Barryvdh\Cors\ServiceProvider::class,
|
app/Http/Kernel.php
の $middleware
に以下を追加。
1
2
3
4
| protected $middleware = [
// ...
\Barryvdh\Cors\HandleCors::class,
];
|
上記は全体に対応する場合。
もし、APIのみに許可したい場合は以下のようにする。
1
2
3
4
5
6
7
8
9
10
| protected $middlewareGroups = [
'web' => [
// ...
],
'api' => [
// ...
\Barryvdh\Cors\HandleCors::class,
],
];
|
設定ファイル
設定ファイルを以下のコマンドで作成する。
1
| $ php artisan vendor:publish --provider="Barryvdh\Cors\ServiceProvider"
|
以下の内容で作成される。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
| return [
/*
|--------------------------------------------------------------------------
| Laravel CORS
|--------------------------------------------------------------------------
|
| allowedOrigins, allowedHeaders and allowedMethods can be set to array('*')
| to accept any value.
|
*/
'supportsCredentials' => false,
'allowedOrigins' => ['*'],
'allowedHeaders' => ['Content-Type', 'X-Requested-With'],
'allowedMethods' => ['*'], // ex: ['GET', 'POST', 'PUT', 'DELETE']
'exposedHeaders' => [],
'maxAge' => 0,
]
|
supportsCredentials
: クッキーやBasic認証の許可設定
allowedOrigins
: 許可するドメイン
allowedHeaders
: 許可するヘッダー
allowedMethods
: 許可するメソッド
exposedHeaders
: レスポンスに含める内容があれば
それぞれ、 *
とすれば全て許可する設定となる。
(maxAge
はよくわからない…)
これで完了。
CURLで確認
curlで設定されているかどうかを確認する。
1
| $ curl -X GET -I -H "Origin: http://sample.jp" https://your-domain.com/your/api
|
-I
: Headerのみ取得し出力
-X
: アクションメソッドの指定
-H
: ヘッダの指定
ヘッダの Origin
に送信元のURLを指定する。
許可されているドメインの場合は、 200
が返ってくるが、
許可されていない場合は、 403
が返ってくる。
OKの場合のレスポンス
1
2
3
4
5
6
7
8
9
10
| HTTP/1.1 200 OK
Connection: keep-alive
Date: Mon, 19 Jun 2017 02:17:21 GMT
Server: Apache
Cache-Control: no-cache, private
Access-Control-Allow-Origin: http://sample.jp
Vary: Origin
Transfer-Encoding: chunked
Content-Type: application/json
Via: 1.1 vegur
|
参考