"プレフライトに無効なHTTPステータスコード500があります"というエラーを停止する方法はありますか？

Question

私はyelp APIに接続しようとしています。 VueとAxiosの使用。私は接続できません。私はエラーを取得しています：ここで

XMLHttpRequest cannot load https://api.yelp.com/v3/businesses/search?location=sarnia&limit=50 . Response for preflight has invalid HTTP status code 500

は私のコードです：

new Vue({ 
    el: '#app', 
    data: { 
     businesses: [] 
    }, 

    // Logic Methods 

     mounted() { 
      var app = this; 
      var url = 'https://api.yelp.com/v3/businesses/search?location=sarnia&limit=50'; 
      var config = { 
       headers: { 
        "Cache-Control": "no-cache", 
        'Content-Type': 'application/x-www-form-urlencoded', 
        "Access-Control-Allow-Origin": '*', 
        "Access-Control-Allow-Methods": 'GET, POST, PATCH, PUT, DELETE, OPTIONS', 
        "Access-Control-Allow-Headers": 'Origin, Content-Type, X-Auth-Token, Accept', 
        "Access-Control-Max-Age": "1728000", 
        'Authorization': 'MyAccessCode' 
       } 
      }; 

      axios.get(url, config) 
      .then(function(response) { 
       console.log(response.headers); 
       console.log(response); 
       app.businesses = response.data 
      }) 
      .catch(function(error) { 
       app.businesses = "ERROR" 
      }) 
    } 
}) 

私は、これはCORSとは何かであると仮定していますが、私はこの問題を解決する方法がわからないと思います。私は有効にしてすべてのヘッダーを持っているCORS Chromeプラグインを持っています。問題の内容と解決方法を理解することはできますか？これは何か猫のために何かですか？最初

Answer 1

初のもの。あなたのリクエストに渡しているヘッダは、リクエストヘッダとして意図されていない：

"Access-Control-Allow-Origin": '*', 
"Access-Control-Allow-Methods": 'GET, POST, PATCH, PUT, DELETE, OPTIONS', 
"Access-Control-Allow-Headers": 'Origin, Content-Type, X-Auth-Token, Accept', 
"Access-Control-Max-Age": "1728000", 

あなたは、彼らがCORSルールを指定するには、対応して、サーバによって使用されるべきhereを見ることができるように。実際には（それがの4xxエラーでなければなりませんが）問題を引き起こしても、何であるかもしれない - だからリクエストでそれらを置くことによって何のプラスの効果はありません。

は第二に、500を受けたプリフライトリクエストは通常​​、サーバーは作っているとあなたは（理論的には）それを修正するためにできることは何もない要求に対処するいくつかの問題を有することを意味します。しかし、実際には、APIは何らかのリクエストが間違っていると500のエラーを出すことがあり、それを変更することで成功を得ることができます（実装は間違っていますが、実際はよく見られます）。

最小限の情報（POST https://api.yelp.com/v3/businesses/search?location=sarniaの認証ヘッダーのみ）を入力すると、エラーに関する詳細情報（例：郵便配達または簡単なHTTPツール）を調べる必要があります。成功した場合は、実際に使用しているもの（params、別のコンテンツタイプなど）を追加して、エラーが発生したときに確認してください。

あなたはAPI自体はVueの、axiosとあなたが作る要求を変更することができ、ブラウザをバイパスこの方法をテストすることができます。この方法で、問題の原因を見つけることができます。この場合も、サーバーで発生する可能性が最も高い問題ですが、クライアントの要求に固有の問題が原因である可能性があります。

幸運を祈る！