LoginSignup
7
11

More than 5 years have passed since last update.

【Laravel】CORS の設定に barryvdh/laravel-cors を使うと allowed-origin の指定に正規表現を使える

Posted at

背景

CORS (Cross-Origin Resource Sharing) についてはこちらを参考

Access-Control-Allow-Origin の仕様として、全てを受け入れる * か、全てを受け入れない null か、さもなければ個別で指定(複数の場合はスペース区切り)するしかできない。

「サブドメインを許可する」といったことをするには apache の mod_rewrite を使うなどの工夫が必要。

barryvdh/laravel-cors はその辺りの面倒をよしなにやってくれる。

作者は laravel-debugbarlaravel-ide-helper などで(個人的に)おなじみの barryvdh さん。

検証

例として、Chrome の拡張機能 Advanced REST client を使ってプリフライトリクエストを発行してみる。

環境

  • クライアント
    • Google Chrome 67.0.3396.99(Official Build) (64 ビット)
    • Advanced REST client 10.0.12-stable
  • サーバ
    • PHP 7.1.18
    • Laravel 5.6.26
    • barryvdh/laravel-cors 0.11.0

設定

検証内容に合わせて Chrome 拡張機能からのリクエスト(Originchrome-extension://~ )を許可する設定。

※あくまで検証用。本番環境の設定は慎重に行うこと!

config/cors.php
<?php

return [

    /*
    |--------------------------------------------------------------------------
    | Laravel CORS
    |--------------------------------------------------------------------------
    |
    | allowedOrigins, allowedHeaders and allowedMethods can be set to array('*')
    | to accept any value.
    |
    */

    'supportsCredentials' => false,
    'allowedOrigins' => [],
    'allowedOriginsPatterns' => ['@^chrome-extension://.*@'],
    'allowedHeaders' => ['*'],
    'allowedMethods' => ['*'],
    'exposedHeaders' => [],
    'maxAge' => 0,

];

検証内容

サーバ側は /echo という GETPOST を許可しているエンドポイントがある、という想定。

OPTIONS メソッドと Access-Control-Request-Method でプリフライトリクエスト扱いとなる。

OPTIONS https://<ドメイン>/echo

リクエストヘッダ
Access-Control-Request-Method: POST

preflight.png

結果

200 OK が返って来ている。
(許可されてないリクエストだった場合 403 Forbidden が返って来る)

また、レスポンスヘッダの Access-Control-Allow-Origin には Advanced REST client を表す chrome-extension://apcedakaoficjlofohhcmkkljehnmebp自動的にセットされているのが確認できる。

レスポンスヘッダ(前後略)
Access-Control-Allow-Origin: chrome-extension://apcedakaoficjlofohhcmkkljehnmebp

preflight-res.png

参考

7
11
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
11