Question

我正在尝试连接到yelp API。使用Vue和Axios。我无法连接。我收到了错误：

XMLHttpRequest无法加载https://api.yelp.com/v3/businesses/search?location=sarnia&limit=50。预检的响应具有无效的HTTP状态代码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插件，可以启用并拥有所有标题。我可以了解问题的原因以及解决方法吗？这是代表yelp的事吗？

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",

正如您所见，here服务器应该在响应中使用它们来指定CORS规则。 因此将它们放入请求中没有任何积极影响 - 实际上甚至可能导致问题（尽管它应该是4xx错误）。

其次，接收500的预检请求通常意味着服务器在处理您正在进行的请求时遇到了一些问题，并且您无法做任何事情来解决它（理论上）。实际上，当你提出的某些请求错误时，API通常会给出500个错误，通过更改它可以获得成功（错误的实现，但在实践中经常看到）。

您应该查看有关错误的更多信息 - 开始简单（例如使用Postman或简单的HTTP工具），提供最少的信息（例如POST https://api.yelp.com/v3/businesses/search?location=sarnia仅包含您的Authorization标头）。如果成功，请添加更多您实际使用的内容（参数，不同内容类型等）以查看何时出现错误。

您可以通过这种方式测试API本身绕过Vue，axios和浏览器，这可能会改变您的请求。这样您就可以找到问题的根源。同样，它很可能是服务器的问题，但可能只是由客户的请求中的特定内容引起的。

祝你好运！

如何停止＆＃34;预检有无效的HTTP状态代码500＆＃34;错误？

1 个答案: