すでにwebpackを使用しているプロジェクトでvue-bulma-admin
スキャフォールドを使用しており、APIへのPOST/PUT要求を実行できないようです(これはaccess-cross-allow-origin *へのヘッダー)、GET要求のみが動作します。我々はすでにカスタムヘッダーを設定しようとしたvueを使用したCORSの問題
"No 'Access-Control-Allow-Origin' header is present on the requested resource."
Response to preflight request doesn't pass access control check:
No 'Access-Control-Allow-Origin' header is present on the requested
resource.
:私たちのAPIを消費異なるフロントエンドから、私たちはこれだけ一般的なエラーとなります。この特定のフロントエンドと、この問題はありません。 axios/vue-resource
にありますが、成功しません。私が言ったように、Postman /異なるフロントエンドやCORSクロムエクステンションで同じルートを使用すると、すべて正常に動作します。
これを回避するためのアイデアはありますか?
Laravel APIのMy middleware Cors。
<?php
namespace App\Http\Middleware;
use Closure;
class Cors
{
/**
* Handle an incoming request.
*
* @param \Illuminate\Http\Request $request
* @param \Closure $next
* @return mixed
*/
public function handle($request, Closure $next)
{
return $next($request)
->header('Access-Control-Allow-Origin', '*')
->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
}
}
を設定してくださいパッケージを使用して私の問題を解決? – Nora
私はそれに私の質問を編集しました。 –
あなたのPOSTが少なくとも1つのヘッダー(たぶんContent-Typeヘッダー?)を追加しているようですが、ブラウザが自動的にCORSプリフライトOPTIONSリクエストを実行します。https://developer.mozilla.org/en -US/docs/Web/HTTP/Access_control_CORS#Preflighted_requestsそのサーバーのバックエンドコードがOPTIONS要求のAccess-Control-Allow-Originヘッダーを送信するように設定されていないようです。これは、200 OKでOPTIONS要求に応答し、適切な値を持つAccess-Control-Allow-HeadersおよびAccess-Control-Allow-Methodsヘッダーに応答するように構成する必要があります。 – sideshowbarker