Laravel 5.3 PassportでAccess-Control-Allow-Originヘッダーレスポンスを追加する。
質問
私はLaravelの初心者で、OAuth2.0パスワードグラントでLaravel 5.3 Passportプロジェクトをいくつか行っています。私はパラメータを使用してAPIをカールすると、それはトークンで応答します。しかし、ブラウザでは、私のリクエストはlocalhostから来ている一方で、APIは私のVMに位置しているため、エンドポイントが追加する必要がある追加のセキュリティが必要です。以下はそのエラーです。
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. The response had HTTP status code 400.
問題が何であるかは分かっていますが、これはサードパーティのアプリなので、そのヘッダーを含めるためにどこに置けばいいのか分かりません。
事前に専門家に感謝します。助けてください。
どのように解決するのですか?
簡単な答えは
Access-Control-Allow-Origin
ヘッダを
localhost
または
*
. 私がいつもやっている方法はこうです。
というシンプルなミドルウェアを作成します。
Cors
:
php artisan make:middleware Cors
に以下のコードを追加します。
app/Http/Middleware/Cors.php
:
public function handle($request, Closure $next)
{
return $next($request)
->header('Access-Control-Allow-Origin', '*')
->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
}
を置き換えることができます。
*
を
localhost
に変更するか、そのままにします。
次はミドルウェアの読み込みです。次の行を
$routeMiddleware
の配列に追加します。
app/Http/Kernel.php
.
'cors' => \App\Http\Middleware\Cors::class,
そして最後のステップは、アクセスオリジンヘッダを設定したいルートでミドルウェアを使用することです。laravel 5.3の新しいapiルートについて話していると仮定すると、それを行う場所は以下の通りです。
app/Providers/RouteServiceProvider.php
の中、つまり
mapApiRoutes()
関数の中にあります(関数の前のコードを削除するかコメントしてもかまいません)。
Route::group([
'middleware' => ['api', 'cors'],
'namespace' => $this->namespace,
'prefix' => 'api',
], function ($router) {
//Add you routes here, for example:
Route::apiResource('/posts','PostController');
});
関連
-
[解決済み】「Access-Control-Allow-Origin」ヘッダが複数の値を含む場合
-
[解決済み] Access-Control-Allow-Originヘッダーはどのように機能するのですか?
-
[解決済み] XMLHttpRequestが読み込めない XXX 'Access-Control-Allow-Origin' ヘッダがない
-
[解決済み] Access-Control-Expose-Headersはなぜ必要なのですか?
-
[解決済み] 私のJavaScriptコードは "No 'Access-Control-Allow-Origin' header is present on requested resource "というエラーを受け取りますが、Postmanはそうならないのはなぜですか?
-
[解決済み] Access-Control-Allow-Origin複数オリジンのドメイン?
-
[解決済み] REST APIからデータを取得しようとしたときに、要求されたリソースに'Access-Control-Allow-Origin'ヘッダーが存在しない。
-
[解決済み] プリフライト要求に対する応答がアクセス制御チェックを通過しない
-
[解決済み】「アクセス制御-許可-オリジン」がない - Node / Apacheのポートの問題
-
[解決済み] Firebaseストレージとアクセス制御・許可・オリジン
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン