Question

我正在处理待办事项清单，基本上已经完成了。但是我在控制台中遇到了这个尚未遇到的错误，它阻止了我创建列表（待办事项）

这是我得到的错误：

OPTIONS http://localhost:4000/cpds/add
  net::ERR_NAME_NOT_RESOLVED
Uncaught (in promise) Error: Network Error             createError.js:17
  at createError (createError.js.17)
  at XMLHttpRequest.handelError (xhr.js:80)

有人可以解释这意味着什么以及如何解决此问题。该列表会在我的控制台中显示，但不会在我的浏览器中显示，然后再显示此错误。

Answer 1

ERR_NAME_NOT_RESOLVED-指出系统无法解析给定主机名（在您的情况下为http://localhost:4000/cpds/add）的IP地址。尽管您真的不太可能因为localhost本身无法解析地址，但最可能的原因是您请求关闭端口（：4000）。通常，此消息说未被捕获，这表示当您请求“ http://localhost:4000/cpds/add”形式的axios时在代码中的某个位置（假定您没有提供有关代码的任何详细信息），像这样的声明

 axios.get(url, {  headers  })
            .then(data => console.log(data))

无

            .catch(error => console.error(error))

因此完整版是

 axios.get(url, {  headers  })
            .then(data => console.log(data))
            .catch(error => console.error(error))

因此，当请求由于任何原因而失败时（可能是url错误），解释器将不知道如何克服（换句话说，您应该直接定义在发生错误的情况下会调用的函数，并将其传递给捕获方法）。为了确保网址中没有错误，请尝试将http://localhost:4000/cpds/add放置在浏览器的地址栏中，如果确实无法访问，浏览器应向您显示错误。

Answer 2

这是因为您的调用之一返回了被拒绝的promise / async函数，或者换句话说：调用函数时发生错误。

请注意这一点。您可以编写yourlibrarycall.then(result => ...).catch(error => ...)，但这会很快带来一个陷阱。如果库调用失败，也将调用catch子句，但是.then子句也会失败。您可能希望失败是由于库调用引起的，但这很好，您的代码也可能有问题，变量error返回的值可能完全不同（或undefined）。 / p>

因此，我更喜欢：

yourFunction = async () => {
  let result;
  try {
     result = await yourlibrarycall // this is blocking
  }
  catch (error) {
     // error handling only of your library call
  }

  // here comes your following logic 
  ...
}

使用asnyc，您的函数将异步执行，现在可以使用关键字await等待结果。如果库调用失败，它将进入catch范围，并为您提供发生错误的变量。

现在这是所有错误处理，仅现在只能处理请求，然后执行以下逻辑，从而消除误导的.then(...).catch(...)。

如果您仍然想使用promise方法而不是async / await，请小心地显式处理catch子句中的所有错误，否则它们将冒泡并被catch子句捕获，如上所述。 / p>

第一次收到此错误控制台中未捕获的错误

2 个答案: