反应:Axios网络错误

Question

这是我第一次使用axios而且遇到了错误.

  axios.get(
    `http://someurl.com/page1?param1=1&param2=${param2_id}`
  )
  .then(function(response) {
    alert();
  })
  .catch(function(error) {
    console.log(error);
  });

使用正确的URL和参数,当我检查网络请求时,我确实从我的服务器得到了正确的答案,但是当我打开控制台时,我发现它没有调用回调,而是发现了错误.

错误:网络错误堆栈跟踪:createError @ http:// localhost:3000/static/js/bundle.js:2188:15 handleError @ http:// localhost:3000/static/js/bundle.js:1717:14

Answer 1

当您在 localhost 上工作并且忘记添加 http://时，就会发生这种情况

错误用法

  const headers = {
    "Content-Type": "application/json",
    Authorization: apiKey,
  };
  const url = "localhost:5000/api/expenses/get-expenses";

  axios.get(url, { headers });

  // NETWORK ERROR

正确的是

  const headers = {
    "Content-Type": "application/json",
    Authorization: apiKey,
  };
  const url = "http://localhost:5000/api/expenses/get-expenses";

  axios.get(url, { headers });

  // WORKS FINE IF YOU HANDLED CORS CORRECTLY IN THE SERVER SIDE

Answer 2

如果使用NodeJS创建API

您的Express应用程序需要使用CORS(跨源资源共享).将以下内容添加到服务器文件中:

// This should already be declared in your API file
var app = express();

// ADD THIS
var cors = require('cors');
app.use(cors());

要更全面地了解CORS,请阅读有关CORS的Mozilla文档.

Answer 3

我的问题是关于我请求的网址。我没有http://在我的网址的开头插入。我的意思是我请求的是一个像92.920.920.920/api/Token而不是http://92.920.920.920/api/Token. 添加http://解决了我的问题。

Answer 4

除了@jacobhobson 的回答之外，我还使用了一些参数来使其工作。

app.use(cors({origin: true, credentials: true}));

Answer 5

就我而言，我使用“ https ”而不是“ http ”，也请检查一下。