Lumenでクロスドメインアクセス設定

現在 VueJSとLumenでSPAのサービスを作っているのですが
クロスドメインに引っかかり一日がっつりハマったので備忘録も兼ねて
記述

結論

色々試行錯誤したのですが結局以下で出来ました。

Lumenのapi/public/index.phpに以下を追記

api/public/index.php

header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");
header('Access-Control-Allow-Methods: GET, POST, PUT');

CORSについて

詳しくは
https://dev.classmethod.jp/etc/about-cors/
ここなどに譲るとして、簡単に言うとJSONPは裏技的な感じなので、正式にクロスドメインアクセスを実現するための仕様です。

色々調べてるとLumenのCORS対応のライブラリインストールするとか
js側でheaderを設定するとかあったんですが
結局はindex.phpにheaderの設定を書くだけで可能でした。

改修

今のソースではAccess-Control-Allow-Originが全て許可する設定になっているのでここはURL設定する方が良いと思います