首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

为什么fetch().json()错误不会触发window.onerror?

fetch().json()错误不会触发window.onerror的原因是因为fetch()方法返回的是一个Promise对象,而不是一个普通的函数。Promise对象的错误会被Promise自身捕获,而不是传递给全局的错误处理函数window.onerror

当使用fetch().json()时,如果返回的响应不是一个有效的JSON格式,或者在解析JSON时出现错误,fetch().json()会抛出一个SyntaxError错误。这个错误会被Promise对象捕获,并通过Promise的catch()then()方法的第二个回调函数来处理。

所以,如果你想要捕获并处理fetch().json()错误,你可以使用catch()方法来捕获Promise的错误,或者使用then()方法的第二个回调函数来处理错误。以下是一个示例代码:

代码语言:txt
复制
fetch(url)
  .then(response => response.json())
  .then(data => {
    // 处理成功的情况
  })
  .catch(error => {
    // 处理失败的情况
    console.error(error);
  });

推荐的腾讯云相关产品:腾讯云服务器(CVM),腾讯云函数计算(SCF),腾讯云云数据库(TencentDB),腾讯云对象存储(COS)。这些产品提供了可靠的云计算基础设施和服务,以满足开发者的各种需求。您可以访问腾讯云官方网站了解更多详情和产品介绍。

  • 腾讯云服务器(CVM):提供弹性、安全、可靠的云服务器实例,支持多种操作系统和应用场景。产品介绍链接
  • 腾讯云函数计算(SCF):无服务器计算服务,支持按需执行代码片段,无需管理服务器。产品介绍链接
  • 腾讯云云数据库(TencentDB):提供高性能、高可靠、可弹性扩展的云数据库服务,包括关系型数据库、NoSQL数据库和分布式数据库等。产品介绍链接
  • 腾讯云对象存储(COS):提供安全、低成本、高可靠的云存储服务,适用于多种数据存储和传输场景。产品介绍链接
页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

从0到1搭建前端监控平台,面试必备的亮点项目

:JS错误、异步错误、资源加载、接口错误等 When,出现的时间段,如时间戳 Who,影响了多少用户,包括报错事件数、IP Where,出现的页面是哪些,包括页面、对应的设备信息 Why,错误的原因是为什么...window.onerror 可以捕获常规错误、异步错误,但不能捕获资源错误 /** * @param { string } message 错误信息 * @param { string } source...错误边界的功能,被该组件包裹的子组件,render 函数报错时会触发离当前组件最近父组件的ErrorBoundary 生产环境,一旦被 ErrorBoundary 捕获的错误,也不会触发全局的 window.onerror.../Child.js'; // window.onerror 不能捕获render函数的错误window.onerror = function (err, msg, c, l) { console.log...replaceState事件 vue项目中不能通过 hashchange 事件来监听路由变化,vue-router 底层调用的是 history.pushState 和 history.replaceState,不会触发

3.5K20
  • 一篇讲透自研的前端错误监控

    fetch('/remote/notdefined', {}) 搜集错误 所有起因来源于错误,那我们如何进行错误捕获。...window.onerror pure js错误收集,window.onerror,当 JS 运行时错误发生时,window 会触发一个 ErrorEvent 接口的 error 事件。...window.addEventListener 当一项资源(如图片或脚本)加载失败,加载资源的元素会触发一个 Event 接口的 error 事件,这些 error 事件不会向上冒泡到 window,但能被捕获...但通用的fetch怎么办呢,fetch返回Promise,但Promise的错误不能被捕获,怎么办呢?...Vue错误 由于Vue会捕获所有Vue单文件组件或者Vue.extend继承的代码,所以在Vue里面出现的错误,并不会直接被window.onerror捕获,而是会抛给Vue.config.errorHandler

    1.7K20

    沉淀了3年的自研前端错误监控系统,打通你的脉络

    window.onerror」 pure js错误收集,window.onerror,当 JS 运行时错误发生时,window 会触发一个 ErrorEvent 接口的 error 事件。...「window.addEventListener」 当一项资源(如图片或脚本)加载失败,加载资源的元素会触发一个 Event 接口的 error 事件,这些 error 事件不会向上冒泡到 window...但通用的fetch怎么办呢,fetch返回Promise,但Promise的错误不能被捕获,怎么办呢?...「Vue错误」 由于Vue会捕获所有Vue单文件组件或者Vue.extend继承的代码,所以在Vue里面出现的错误,并不会直接被window.onerror捕获,而是会抛给Vue.config.errorHandler...jiankong-4 ○ 四、扩展 行为搜集 通过搜集用户的操作,可以明显发现错误为什么产生。 ?

    1K10

    一篇文章教你如何捕获前端错误

    4、异步请求错误fetch与xhr) 异步错误的捕获分为两个部分:一个是传统的XMLHttpRequest,另一个是使用fetch api。...各个类型错误的捕获方式 1、window.onerror与 window.addEventListener('error')捕获js运行时错误 使用window.onerror和 window.addEventListener...,加载资源的元素会触发一个Event接口的error事件,并执行该元素上的onerror()处理函数。...这个错误不会window.onerror以及 window.addEventListener('error')捕获,但是有专门的 window.addEventListener('unhandledrejection...console.log(event.reason); }); (滑动查看) 4、fetch与xhr错误的捕获 对于fetch和xhr,我们需要通过改写它们的原生方法,在触发错误时进行自动化的捕获和上报

    3.8K40

    一篇文章教你如何捕获前端错误

    使用true或false都可以,默认为false 2、资源加载错误使用addEventListener去监听error事件捕获 实现原理:当一项资源(如或)加载失败,加载资源的元素会触发一个...这些error事件不会向上冒泡到window,不过能被window.addEventListener在捕获阶段捕获。...这个错误不会window.onerror以及window.addEventListener('error')捕获,但是有专门的window.addEventListener('unhandledrejection...console.log(event.reason); }); 4、fetch与xhr错误的捕获 对于fetch和xhr,我们需要通过改写它们的原生方法,在触发错误时进行自动化的捕获和上报。...这意味着请求脚本时不会向服务端发送潜在的用户身份信息(例如 Cookies、HTTP 证书等)。

    3.2K90

    学习 sentry 源码整体架构,打造属于自己的前端异常监控SDK

    导读 本文通过梳理前端错误监控知识、介绍 sentry错误监控原理、 sentry初始化、 Ajax上报、 window.onerror、window.onunhandledrejection几个方面来学习...前端错误监控知识 摘抄自 慕课网视频教程:前端跳槽面试必备技巧 别人做的笔记:前端跳槽面试必备技巧-4-4 错误监控类 前端错误的分类 1.即时运行错误:代码错误 try...catch window.onerror...,冒泡是不能触发 上报错误的基本原理 1.采用 Ajax通信的方式上报 2.利用 Image对象上报 (主流方式) Image上报错误方式: (newImage()).src='https://lxchuan12...window.onerror 和 window.onunhandledrejection 捕获 错误 例子:调用一个未申明的变量。...本文通过梳理前端错误监控知识、介绍 sentry错误监控原理、 sentry初始化、 Ajax上报、 window.onerror、window.onunhandledrejection几个方面来学习

    2.9K30

    JavaScript 页面资源加载方法onload,onerror总结

    也就是说:如果脚本成功加载,则即使脚本中有编程 error,也会触发 onload 事件。如果要跟踪脚本 error,可以使用 window.onerror 全局处理程序。...例如,让我们使用一个脚本 error.js,该脚本只包含一个(错误)函数调用: // ?...为什么我们需要 error 的详细信息? 因为有很多服务(我们也可以构建自己的服务)使用 window.onerror 监听全局 error,保存 error 并提供访问和分析 error 的接口。...浏览器不会将授权信息和 cookie 发送到远程服务器。...你可以在 Fetch:跨源请求 一章中了解有关跨源访问的更多信息。这一章描述了用于网络请求的 fetch 方法,但策略是完全相同的。

    4.2K10

    JS 面试总结 理论篇

    JS为什么是单线程? 由于浏览器可以渲染DOM,JS也可以修改DOM结构,未避免冲突,JS执行的时候,浏览器DOM渲染会停止。 两段JS不能同时执行。...在XHR运行中,当其属性readyState改变时readystatechange事件就会被触发, 只有在XHR从远端服务器接收响应结束时回调函数才会触发执行。...window.onerror 相比try catch来说window.onerror提供了全局监听异常的功能: window.onerror = function(errorMessage, scriptURI...使用Vue.config.errorHandler这样的Vue全局配置,可以在Vue指定组件的渲染和观察期间未捕获错误的处理函数。这个处理函数被调用时,可获取错误信息和Vue 实例。...Vue.config.errorHandler = function (err, vm, info) { // handle error // `info` 是 Vue 特定的错误信息,比如错误所在的生命周期钩子

    1.4K30

    【前端监控】页面错误监控

    事件,如下,重写然后加上自己的处理逻辑 const orgError = window.onerror; window.onerror = (...args) => { // 上报获取错误信息处理逻辑...的时候,如果不想继续抛错(捕获之后不显示控制台) 那么就在回调后面return true 但是一般不会这样的,我们是只做拦截,保持原样,否则会对开发者不友好 3、无法捕获语法错误 并不是什么错误都能捕获到...捕获到,而不会触发 unhandledrejection 事件 资源报错 监控资源报错我们在另一篇内容有总结,具体可以看 【前端监控】静态资源测速&错误上报 这里再简单描述下 前面我们用window.onerror...来监听js执行错误,但是它并不能获取到资源加载失败的错误,因为这些错误不会向上冒泡,但是我们可以进行捕获 所以我们可以使用 addEventListener 的方式设置捕获监听错误 这里的话可以两种方式...,具体可以参考 【前端监控】自动抓取接口请求数据 简单说,就是 劫持 XMLHttpRequest 和 fetch 方法,在原来的方法上包一层自己的处理逻辑,拿到请求的信息 等 而 判断 请求是否出错

    2.2K10

    如何及时发现网页的隐形错误

    如果想更详细了解可以看详细错误罗列这篇文章 静态资源错误 通过 XMLHttpRequest、Fetch() 的方式来请求的 http 资源时。...} window.onerror 优点: 可以捕获同步和异步的异常 可以获取到错误的详细信息 缺点: 受到同源策略的限制,只能捕获当前域名下的错误 无法捕获语法错误和网络异常的错误 无法阻止异常继续传播...将它们结合使用可以使错误处理更加高效。 只有当 window.onerror 函数返回 true 时,异常才不会继续向上抛出。...因为无法保证我们编写的代码是否会出错,如果将其放置在后面,一旦发生错误,onerror 将无法捕获到异常。 window.onerror 只能同时订阅一个错误处理函数。...try { throw new Error("这是一个同步代码中的错误"); } catch (e) { console.log(e); } 自己封装XMLHttpRequest&fetch

    23200

    如何优雅处理前端的异常?

    一、为什么要处理异常? 异常是不可控的,会影响最终的呈现结果,但是我们有充分的理由去做这样的事情。...4. window.onerror 不是万能的 当 JS 运行时错误发生时,window 会触发一个 ErrorEvent 接口的 error 事件,并执行 window.onerror()。...补充一点:window.onerror 函数只有在返回 true 的时候,异常才不会向上抛出,否则即使是知道异常的发生控制台还是会显示 Uncaught Error: xxxxx 控制台就不会再有这样的错误了...需要注意的是:error boundaries 并不会捕捉下面这些错误。...try-catch 起来的异常进行跨域拦截,所以 catch 到的时候,是有堆栈信息的; 重新 throw 出来异常的时候,执行的是同域代码,所以 window.onerror 捕获的时候不会丢失堆栈信息

    1.8K50

    如何搭建前端异常监控系统

    为什么要处理异常 增强用户体验 远程定位问题 无法复现问题,特别是移动端,各种原因,可能是系统版本,机型等等 前端有哪些异常 异常 频率...当 JavaScript 运行时错误(包括语法错误)发生时,window 会触发一个 ErrorEvent 接口的 error 事件,并执行 window.onerror() 若该函数返回 true,...这些 error 事件不会向上冒泡到 window,不过(至少在 Firefox 中)能被单一的 window.addEventListener 捕获。...eventPhase: 1, …} window.addEventListener('unhandledrejection') 当 Promise 被 reject 且没有 reject 处理器的时候,会触发...this.props.children; } } export default ErrorBoundary; 使用: 注意 错误边界不会捕获以下方面的错误

    1.2K00

    如何优雅处理前端异常?(史上最全前端异常处理方案)

    一、为什么要处理异常? 异常是不可控的,会影响最终的呈现结果,但是我们有充分的理由去做这样的事情。...四、window.onerror 不是万能的 当 JS 运行时错误发生时,window 会触发一个 ErrorEvent 接口的 error 事件,并执行 window.onerror()。...补充一点:window.onerror 函数只有在返回 true 的时候,异常才不会向上抛出,否则即使是知道异常的发生控制台还是会显示 Uncaught Error: xxxxx window.onerror...需要注意的是:error boundaries 并不会捕捉下面这些错误。...try-catch 起来的异常进行跨域拦截,所以 catch 到的时候,是有堆栈信息的;重新 throw 出来异常的时候,执行的是同域代码,所以 window.onerror 捕获的时候不会丢失堆栈信息

    3.4K10
    领券