使用 Deno 中的 fetch API 发送 HTTP 请求时如何正确地处理错误?

在 Deno 中使用 fetch 函数来发送 HTTP 请求是一个非常方便的方式,但是在实际开发中,我们也需要正确地处理错误以避免不必要的问题。在本文中,我们将讨论如何在 Deno 中正确地处理 fetch 函数的错误。

错误类型

在 Deno 中,fetch 函数返回一个 Promise 对象,它可以被 resolve 成一个 Response 对象。当请求失败时,Promise 将被 reject,这意味着我们可以通过在 catch 块中处理它来处理错误。在处理错误之前,我们需要先了解一下 fetch 函数可能会出现的错误类型。

网络错误

网络错误是最常见的错误类型之一,它们通常是连接错误,DNS 错误或连接超时等问题。在这种情况下,Promise 将会被 reject,并且我们可以使用 catch 块来处理请求失败的情况。

HTTP 错误

HTTP 错误是服务器返回错误状态码时发生的错误。例如,当我们请求一个不存在的页面时,服务器将返回 404 错误。在这种情况下,我们可以通过 Response 对象的 status 属性来查看错误状态码,并确定如何处理响应。

请求被拒绝

有时,某些浏览器扩展程序或安全性设置可能会拒绝我们的请求。在这种情况下,我们也会收到一个错误。如果我们清楚地知道请求被拒绝的原因,那么我们可以采取相应的行动。

处理错误

在使用 fetch 函数时,我们应该始终采用异步函数来处理错误。这样我们就可以使用 try...catch 语句来捕获 Promise 的错误。

----- -------- ------------- -
  --- -
    ----- -------- - ----- ----------------------------
    -- ------
  - ----- ------- -
    ---------------------- -------
    -- ----
  -
-

在 catch 块中,我们可以处理任何错误,无论是网络错误,HTTP 错误还是请求被拒绝。具体来说,我们经常需要检查 Response 对象的 status 属性和 ok 属性,以确定响应是否成功。

----- -------- ------------- -
  --- -
    ----- -------- - ----- ----------------------------
    -- ------------- -
      -- ---------
    - ---- -
      -- -- ---- --
      ---------------------- -----------------
    -
  - ----- ------- -
    ---------------------- -------
    -- ------------
  -
-

重试

有时候,由于网络问题或服务器问题,请求可能会失败。在这种情况下,我们可以尝试重新发送请求。为此,我们可以编写一个递归函数,并在每次失败时使用 setTimeout 函数来实现延迟重试。

-- -------------
----- ------- - --
----- ---------- - -----

----- -------- ---------------- ------- - -- -
  --- -
    ----- -------- - ----- -----------
    -- ------------- -
      -- ----
      ------ ----- ----------------
    - ---- -
      -- -- ---- --
      ----- --- ------------- - -----------------
    -
  - ----- ------- -
    --------------------- ---------------
    -- -----------------
    -- -------- - -------- -
      ------------------------------
      ----- -----------------
      ------ ----- ---------------- ------- - ---
    - ---- -
      ----- ------
    -
  -
-

-------- -------- -
  ------ --- --------------- -- ------------------- -----
-

-- ----
---------------------------------
  ------------ -- --------------------
  ------------ -- ------------------------ --------

总结

在 Deno 中正确地处理 fetch 函数的错误至关重要。对于网络错误,HTTP 错误和请求被拒绝,我们可以通过 catch 块来捕获错误并采取适当的操作。我们还可以尝试重新发送请求以处理连接不稳定或服务器错误。学会正确地处理 fetch 函数的错误,将使您的代码更加健壮和可靠。

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/6534922f7d4982a6eb958bba


猜你喜欢

  • Cypress 自动化测试:如何在测试用例执行前准备浏览器环境?

    前言 在测试中,准备好测试环境对于稳定测试非常重要。特别是在自动化测试中,准备好合适的测试环境能够确保测试稳定,并且能够更快速地发现问题。本文将介绍如何在 Cypress 自动化测试时,准备好合适的浏...

    1 年前
  • 探究 Socket.io 异常情况下的断线重连机制

    前言 在实际开发中,我们经常会遇到网络不稳定或者其他原因导致的断线问题。这时候如果不能很好地处理这种情况,会导致用户体验下降,甚至造成应用崩溃。而 Socket.io 作为一款应用于实时通信的技术,断...

    1 年前
  • SASS 与 Bootstrap 整合的教程

    前言 SASS 是一种 CSS 预处理器,它能够让我们使用变量、混合器、继承、函数等高级语言特性,使 CSS 编写变得更加简洁、灵活和易于维护。Bootstrap 则是一个流行的前端框架,它基于 HT...

    1 年前
  • Web Components 中事件编译器的实现方式探究

    Web Components 是一种新兴的前端组件化技术,其功能十分强大,可以帮助开发者实现更高效、可重用的代码。其中,事件编译器是 Web Components 中非常重要的组成部分,可以实现对组件...

    1 年前
  • PWA 实战 | 利用 SW 解决图片懒加载问题

    前言 近年来,PWA(Progressive Web Application)成为了前端开发的新热点,PWA 的出现极大的提升了 Web 应用的用户体验。其中,Service Worker(以下简称 ...

    1 年前
  • CSS Reset:让您的网站样式更具个性

    什么是CSS Reset? CSS Reset是一种方法,用于统一浏览器默认样式以及不同浏览器之间的样式差异。CSS Reset通常是通过重置HTML元素的样式来实现的,然后在样式表中重新定义样式。

    1 年前
  • Mongoose 之级联保存子文档的应用方式及相关问题处理

    Mongoose 之级联保存子文档的应用方式及相关问题处理 随着前端开发的不断发展,前端的重要性越来越凸显,其中,Mongoose 是一款非常实用的工具,它不仅提供了优秀的 ORM 实现,而且非常易于...

    1 年前
  • Promise 封装 setTimeout 的实现原理与异常处理

    Promise 封装 setTimeout 的实现原理与异常处理 在前端开发中,有许多场景需要异步执行一段代码,并且需要对执行结果进行处理。最常用的方式就是使用 JavaScript 中的 setTi...

    1 年前
  • 初学 Node.js 必看的 5 个开源项目

    初学 Node.js 必看的 5 个开源项目 作为一名前端开发者,学习 Node.js 已经成为了必备的基本技能之一。然而,在学习过程中往往会遇到很多困难,比如不知道如何切入实战,不知道哪些项目适合新...

    1 年前
  • 使用 Babel-plugin-transform-runtime 解决 babel-runtime 性能问题

    使用 Babel-plugin-transform-runtime 解决 babel-runtime 性能问题 随着前端技术的发展,越来越多的开发者开始使用 Babel 来使其代码能够被各种浏览器支持...

    1 年前
  • TypeScript 中的装饰器及其使用方法

    在 TypeScript 中,装饰器是一种特殊的语法,它允许我们在类、方法、属性等各种类型的声明前面增加注解,来标明这些声明的特殊含义。装饰器在 TypeScript 中的使用非常广泛,可以用来实现诸...

    1 年前
  • 从 ECMAScript 2016 (ES7) 到 ECMAScript9:JavaScript 开发新特性介绍

    ECMAScript(简称ES)是一种由Ecma国际组织进行标准化的脚本语言,常被用于Web开发中。随着JavaScript的普及,ECMAScript也不断更新,从ES6开始,每年都会推出新的版本。

    1 年前
  • 使用 Webpack 实现代码热更新

    在前端开发中,代码更新的频率非常高。每当我们修改了代码之后,都需要手动刷新浏览器才能看到修改后的效果,非常浪费时间。但是,如果能够实现自动刷新浏览器,那么我们的开发效率将会大大提高。

    1 年前
  • 使用 Express.js 发送电子邮件的完整指南

    电子邮件是 Web 应用程序中重要的一部分,实现发送电子邮件可以帮助我们在不同角色之间进行数据或者消息传递。在这篇文章中,我们将会讲解如何在 Express.js 应用程序中实现发送电子邮件,这里将提...

    1 年前
  • 解决 Angular 在使用 ng-model 实现数据双向绑定时出现的问题及解决方法

    在使用 Angular 进行前端开发时,ng-model 是一个非常常用的指令,用于实现数据双向绑定。但是在使用过程中,有时会出现一些问题,如模型值改变时输入框不会自动更新等。

    1 年前
  • ES11 中的 TypedArray 分配器 (分配内存的方式)

    在 JavaScript 的前端开发领域,ES11 的 TypedArray 分配器是一个非常值得关注和学习的技术。它可以让开发者更加有效地分配内存,提高应用程序的性能和稳定性。

    1 年前
  • 无障碍设计:如何为儿童构建无障碍网站

    什么是无障碍设计? 无障碍设计是一种设计理念,旨在使得所有人都能够平等地访问和使用网站、应用程序和其他数字产品。对于身体残障、视觉障碍、听力障碍及认知功能障碍的用户,无障碍设计能够提供特定的优化内容和...

    1 年前
  • PM2+Node.js:如何快速部署高可用的应用?

    在实际的应用场景中,如何快速、高效、并且可靠地部署应用是开发者的最大痛点之一。而在 node.js 开发环境下,PM2 是一款非常受欢迎的进程管理工具,可以有效地提高部署效率和可靠性。

    1 年前
  • ES6 中的函数参数默认值的设置方法及其使用示例

    在 JavaScript 中,函数是一种十分重要的编程工具。准确来说,函数是一个可以被多次调用的代码块,它可以接收多个参数,并可以返回一个值。 在 ES6 中,函数参数默认值的设置方法得到了新的改进。

    1 年前
  • 参数默认值在 ESLint 中的正确使用方式

    在 JavaScript 中,有时候我们需要给函数的参数设置默认值,以防止函数在调用时出现未定义的错误。ES6 引入了参数默认值的语法,但是在使用时还需要考虑一些细节,尤其在使用 ESLint 进行代...

    1 年前

相关推荐

    暂无文章