2016-08-02 21 views
0

VUE-リソース:VUE-資源:アクセス制御 - 許可 - 起源エラー

Vue.http.post(API_URL + '/jwt/access_token', credentials, { 
      headers: { 
       'Access-Control-Allow-Origin': true 
      } 
     }).then(response => { 
      console.log(response.data) 
     }, err => reject(err)) 

私のAPIが正しくCORSのlaravelで構成されている。..

私はエラーを取得する:

XMLHttpRequest cannot load http://finance.app/jwt/access_token. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. 

リクエストヘッダ:

OPTIONS /jwt/access_token HTTP/1.1 
Host: finance.app 
Connection: keep-alive 
Access-Control-Request-Method: POST 
Origin: http://localhost:8080 
User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.82 Safari/537.36 
Access-Control-Request-Headers: access-control-allow-origin, content-type 
Accept: */* 
Referer: http://localhost:8080/ 
Accept-Encoding: gzip, deflate, sdch 
Accept-Language: pt-BR,pt;q=0.8,en-US;q=0.6,en;q=0.4 

どこが間違っているの? :(

おかげ

+1

さて、どのようなレスポンスヘッダについてはどうですか? – gurghet

+0

問題は解決されました。 vue-resourceに設定はありませんでしたが、laravelの小さなミドルウェア設定エラーです。おかげさまで – Giovanne

答えて

2

私はあなたが(あなたがPHPを使用している場合)、このようなサーバ側でヘッダーを設定すべきだと思う:!

header('Access-Control-Allow-Origin: *'); 
header('Access-Control-Allow-Methods: POST, GET, OPTIONS'); 
header('Access-Control-Allow-Headers: X-HTTP-Method-Override, Content-Type, x-requested-with, Authorization'); 

鍵が2行で、手段はPOSTにアクセスすることができます/ GET要求する/ OPTIONS

PS English私の母国語ではありません、それは私のために働いた

0

ソリューションは、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'); 

そしてヴューのオプション以下、PHPにPOSTデータを渡すために:

Vue.http.options.emulateJSON = true 
関連する問題