2017-09-05 10 views
2

すでに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'); 
    } 
} 
+0

を設定してくださいパッケージを使用して私の問題を解決? – Nora

+0

私はそれに私の質問を編集しました。 –

+0

あなたの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

答えて

関連する問題