在前端开发中，我们经常需要发起请求获取数据或与服务端进行交互。使用 Express.js 和 Axios 是两种非常流行的方式。然而，在实际开发中，为保证应用的鲁棒性，我们需要对这两种方式的超时和异常处理做出选择和优化。
Express.js 的超时处理
由于网络请求的不确定性，我们需要为服务器端添加超时处理机制以防止服务器长时间等待客户端请求，在 Express.js 中可以使用 connect-timeout 中间件：
const timeout = require('connect-timeout');
app.use(timeout('60s')); //设置超时时间，单位为秒
app.use((req, res, next) => {
if (!req.timedout) next();
});该中间件可以在服务端给出响应前指定一段时间，如果该时间段内客户端未能接收到响应，则终止请求，可以避免服务器因过多等待请求导致资源占用过多。
Axios 的超时处理
在使用 Axios 发起请求时，我们同样需要对请求的超时时间做出设置以防止请求长时间不能应答。在 Axios 中可以通过 timeout 配置项指定超时时间：
-- -------------------- ---- -------
------------------ -
-------- ---- -- ------------
--
-------------- ---------- -
---------------------------
--
--------------- ------- -
-------------------
---当超时时间达到后，Axios 会自动取消请求并返回一个 error 对象，可以在 catch 中进行处理。
异常处理
在实际开发中，我们还需要考虑网络请求过程中出现异常的情况，如发生超时、通信错误或服务端返回错误码等等。我们需要对这些情况进行处理以保证应用的稳定性。
在 Express.js 中，我们可以使用错误处理中间件进行异常处理：
app.use((err, req, res, next) => {
console.error(err.stack);
res.status(500).send('Something broke!');
});在 Axios 中，我们可以在 catch 中捕获请求发生的异常情况，避免应用崩溃：
-- -------------------- ---- -------
------------------
-------------- ---------- -
---------------------------
--
--------------- ------- -
-- ---------------- -
-- ------ ---- -- --- ---
---------------------------------
-----------------------------------
------------------------------------
- ---- -- --------------- -
-- -- --------
---------------------------
- ---- -
-------------------- ---------------
-
--------------------------
---在 catch 中，我们可以通过判断 error 对象的类型，对超时、通信错误或服务端返回的错误码进行不同的处理，避免因异常情况导致整个应用崩溃。
总结
在本文中，我们学习了如何使用 Express.js 和 Axios 进行网络请求，并对超时和异常处理进行了详细的介绍和讲解。同时，我们还针对这些情况提供了一些优秀的解决方案和代码示例，希望能够对读者有所帮助，并推动前端开发在应用鲁棒性方面的进一步优化。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64e42c07f6b2d6eab3f8a912