Axios：网络错误且未发送请求

Posted 2023-03-28

【中文标题】Axios：网络错误且未发送请求

【英文标题】：Axios: Network Error and not sending request

【发布时间】：2018-06-21 21:39:21

【问题描述】：

我正在尝试使用 axios 从 Vue 向 api 发送带有 auth 标头的 get 请求。

当我尝试发送它时，它给了我一个Network Error，但没有任何相关信息。我还检查了网络选项卡，请求根本没有发送。

在我使用邮递员和https://www.hurl.it/ 检查网址之前，它按预期工作。

另外，我已经使用 axios 向这个 api 发送了一个请求以获取令牌。

谢谢。

const token = "token";

let options = 
    method: 'GET',
    url: 'http://smev.test-it-studio.ru/api/analytics/PortfolioStructure',
    headers: 
        'Authorization': `Bearer $token`
    ,
;

axios(options).then((data) => 
    console.log(data);
).catch((error) => 
    console.log(error.config);
);

编辑：这是我得到的错误：

Error
  columnNumber: 15
  config: …
    adapter: function xhrAdapter()
    baseURL: "http://smev.test-it-studio.ru"
    data: undefined
    headers: Object  Accept: "application/json", Authorization: "Bearer token"
    maxContentLength: -1
    method: "GET"
    timeout: 0
    transformRequest: Object [ transformRequest() ]
    transformResponse: Object [ transformResponse() ]
    url: "http://smev.test-it-studio.ru/api/analytics/PortfolioStructure"
    validateStatus: function validateStatus()
    xsrfCookieName: "XSRF-TOKEN"
    xsrfHeaderName: "X-XSRF-TOKEN"
    __proto__: Object  … 
  fileName: "http://uralsib-lk.dev/dist/build.js"
  lineNumber: 19074
  message: "Network Error"
  response: undefined
  stack: "createError@http://uralsib-lk.dev/dist/build.js:19074:15\nhandleError@http://uralsib-lk.dev/dist/build.js:18962:14\n"
  __proto__: Object  … 
  build.js:18589:24

【问题讨论】：

你能记录完整的错误对象，而不仅仅是error.config吗？

这可能是因为 CORS 吗？我读了其他问题，当它是 CORS 时它们会得到不同的错误

嗯，不确定您是否在编写时使用 hurl 进行了测试。它确实有效。协议是 http 对吗？

是的，我也使用 fetch() 尝试了这个请求，得到了同样的错误。 TypeError: NetworkError when attempting to fetch resource。该请求甚至没有发送，因为它没有显示在网络标签中

顺便说一句，如果有帮助，API 是用 ASP.NET 编写的

【参考方案1】：

在Soleno 的帮助下，我发现是 AdBlock 阻止了请求。

【讨论】：

我一直在为类似的问题撕扯头发。我只是在测试从本地机器运行前端时弹出“网络错误”的问题。我看到了您的回复，然后注意到隐私獾阻止了对后端的访问。在几秒钟内解决了几天的挫败感。

谢谢！你使我免于徒劳地花费数小时。我有一个 AdBlock 阻止的端点 (/api/v1/ad/..)。

【参考方案2】：

我在 Rails 中遇到了这个问题。这是如上所述的cors。 rails 服务器不会显示日志，所以看起来 axios 根本没有发送请求。

谢天谢地，这很容易解决。

对于 Rails，请将其添加到您的 gemfile：gem 'rack-cors'

然后将其添加到 config/initializers/cors.rb

Rails.application.config.middleware.insert_before 0,Rack::Cors do  

allow do
  origins 'localhost:8080'

  resource '*',
    headers: :any,
    methods: [:get, :post, :put, :patch, :delete, :options, :head]
  end
end

注意：将 orgs 更新为前端应用的来源。