返回介绍

错误处理实战

发布于 2025-04-26 18:09:29 字数 1266 浏览 0 评论 0 收藏

回到上面处理小说章节的代码,我们可以使用 catch 来捕获错误信息并展示给用户:

getJSON('story.json').then(function(story) {
  return getJSON(story.chapterUrls[0]);
}).then(function(chapter1) {
  addHtmlToPage(chapter1.html);
}).catch(function() {
  addTextToPage("Failed to show chapter");
}).then(function() {
  document.querySelector('.spinner').style.display = 'none';
});

如果在获取第一章内容的时候失败了(如发生 500 错误,或者用户掉线等),程序会跳过后续所有针对请求成功的回调,其中包括 getJSON 方法中将响应数据转换为 JSON 格式的处理,还有把结果显示到页面上的操作。失败后真正发生的过程是,程序会跳转到 catch 方法的回调函数中。因此,前面任何一步操作过程中发生了错误都会将“Failed to show chapter”的错误信息显示到页面上。

同 JavaScript 中的 try/catch 一样,在捕获到错误后,代码会继续执行,因此代码中隐藏加载指示信息的操作总会执行,而这正是我们所期望的效果。上面的代码其实是下面这段同步代码的异步非阻塞版本:

try {
  var story = getJSONSync('story.json');
  var chapter1 = getJSONSync(story.chapterUrls[0]);
  addHtmlToPage(chapter1.html);
}
catch (e) {
  addTextToPage("Failed to show chapter");
}
document.querySelector('.spinner').style.display = 'none';

如果你只是想使用“catch”来记录错误日志,而并不针对错误做相应恢复处理,那么只需要再次把错误抛出就可以了。在 getJSON 方法里可以这么做:

function getJSON(url) {
  return get(url).then(JSON.parse).catch(function(err) {
    console.log("getJSON failed for", url, err);
    throw err;
  });
}

现在已经搞定了一个章节内容的获取,接下来我们会想办法得到所有章节的内容。

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。