VueJS axios.get 返回错误：请求失败，状态码为 404

Question

我已经调试这段代码一段时间了，但运气不佳：

async getEvents() {
  try {
    let response = await axios.get("http://localhost:8000/events/");
    console.log(response);
    return response.data;
  } catch (error) {
    console.error(error);
  }
}

完整的代码示例来自：https://auth0.com/blog/how-to-make-secure-http-requests-with-vue-and-express/

我在访问调用 API 端点的站点时收到错误：

Error: Request failed with status code 404
    at createAxiosError (utils.js?c786:148)
    at Object.settle (utils.js?c786:127)
    at handleRequest (handle_request.js?da0c:126)
    at eval (index.js?94db:26)
    at new Promise (<anonymous>)
    at MockAdapter.eval (index.js?94db:25)
    at dispatchRequest (dispatchRequest.js?5270:52)

如果我只是在浏览器中复制 url (http://localhost:8000/events/)，我会收到正确的数据。我试过使用和不使用斜杠。 我是否误解了错误消息，我应该查看其他地方吗？

Answer 1

在计算机网络通信中，error 404 表示浏览器能够与给定的服务器通信，但服务器找不到请求的内容，换句话说，request url 不存在.所以你要仔细检查一下。

解决方法：进入network标签，点击错误请求，在Headers里面，可以看到实际发送到服务器的request url。

Answer 2

404 通常表示未找到资源。您是否在 Axios 实例中添加了任何先前的设置？像baseURL？ 大多数情况下，BaseURL 在 Axios 实例上设置为可能会导致混淆和问题。