前端日志

现今有很多无法预知的错误出现,但又不是所有的错误都可以使用pc端的浏览器重现问题所在,

所以前端日志很有必要,日志的出现就是记录某些东西,让开发人员更好锁定问题所在,而后台

在这方面的工作就很完善,这样大大的提高追踪问题速度,然而前端的兼容性是一件很头痛的问题,

有可能写了一段很新的技术代码,然而某些浏览器不兼容而挂了,这样很可能无法追踪到问题,

所以前端日志这个时刻起的作用就起来了。

前端日志使用到技术一般就几个,一个是try()catch(e){}和onerror,这两个,如果有必要的也会使用

一些很特别的东西去检测错误,这个就不说。

/*try{}catch(e){} 可以捕获在其内执行的函数,不过异步的就无法检测了*/
/*onerror 无法捕获到html上标签加载的js和css加载错误,可以捕获到事件错误*/
/*try{}catch(e){}可以使用在初始化调用函数时,onerror可以使用在事件错误或者动态加载文件错误*/
function checkErr(fn){
	try{
		fn();
	}catch(e){
		console.log(e);
	}
}

checkErr(function(){
	var current=document.currentScript;
	current.onload=function(){
		console.log("error.js加载成功");
	}
	window.onerror=function(){
		console.log(arguments);
		return true;
	}
});

  onerror返回true就不会报错在控制台。

时间: 2024-12-25 14:31:04

前端日志的相关文章

前端日志探讨二

在前面一篇文章中我探讨了下在IE浏览器的情况下使用前端日志,但我们知道很多人不使用IE作为默认浏览器. 下面探讨下在高版本chorme浏览器里的日志存储和发送. 由于chorme浏览器为了安全问题在今年已经停止使用插件这种方式,导致现在不允许在chorme中使用插件来更改我们本地的文件这样的操作了.--(吐槽一下,禁用插件导致了我的报表打印功能无法使用了.原来的排版漂亮的报表现在无法再chorme上使用,头疼) 但是由于chorme是一款功能强大的浏览器,首先他为我们提供了一些高级特性.如我们现

安装spy-debugger查看前端日志

有时需要查看前端页面日志,但是前端同学有时忘记开启vConsole.为了调试方便,最好在本地可以查看前端日志,做到一劳永逸. 1.安装node 网上搜教程 2.安装spy-debugger sudo npm install spy-debugger -g 3.启动spy-debugger spy-debugger 4.手机安装证书,开启代理 ip:本机IP port:9888 5.操作查看请求 原文地址:https://www.cnblogs.com/csj2018/p/10594245.htm

前端日志探讨一

在程序设计中日志是个很好的东西,经常帮助我们跟踪代码的运行情况,记录日志有助于我们维护管理我们的项目. 一般我们的日志在服务端,取得日志的方法也很简单,直接使用log4这样的类库就可以很好的完成所需任务.但是在特殊情况下我们可能会需要B/S架构的系统给我们留一个前端的日志.下面来探讨一二. 首先客户端可能是我们未知范围的.这种我们后续再讨论.先讨论客户端在我们控制范围内的日志.如公司内部的流程系统等内部系统. 如果你公司是不练外网的内部系统.切使用IE浏览器做为主浏览器.那可以尝试使用IE自带的

openresty收集前端日志

环境:centos-6.5 依赖:yum install -y gcc gcc-c++ 下载pcre,openssl,openresty wget https://sourceforge.net/projects/pcre/files/pcre/8.39/pcre-8.39.tar.gz wget https://www.openssl.org/source/openssl-1.0.1t.tar.gz wget  https://openresty.org/download/openresty-

温故而知新 前端日志上传新姿势 navigator.sendBeacon(信标)

原文地址:https://mp.weixin.qq.com/s/-moAfEZicrFmun4qfWLdOQ 简单示例js: var data = JSON.stringify({ name: 'Berwin' }); navigator.sendBeacon('http://localhost:80/index.php', data) 简单php示例: 由于是新标发送的数据是 "text/plain" 数据类型,所以用$GLOBALS['HTTP_RAW_POST_DATA']接受,

centos7搭建ELK Cluster日志分析平台(一)

应用场景:ELK实际上是三个工具的集合,ElasticSearch + Logstash + Kibana,这三个工具组合形成了一套实用.易用的监控架构, 很多公司利用它来搭建可视化的海量日志分析平台. 官网下载地址:https://www.elastic.co/downloads  Elasticsearch: 一个基于Lucene的搜索服务器.它提供了一个分布式多用户能力的全文搜索引擎,基于RESTful web接口. Elasticsearch是用Java开发的,并作为Apache许可条款

Logan:美团点评的开源移动端基础日志库

前言 Logan是美团点评集团移动端基础日志组件,这个名称是Log和An的组合,代表个体日志服务.同时Logan也是"金刚狼"大叔的名号,当然我们更希望这个产品能像金刚狼大叔一样犀利. Logan已经稳定迭代了一年多的时间.目前美团点评绝大多数App已经接入并使用Logan进行日志收集.上传.分析.近日,我们决定开源Logan生态体系中的存储SDK部分(Android/iOS),希望能够帮助更多开发者合理的解决移动端日志存储收集的相关痛点,也欢迎更多社区的开发者和我们一起共建Logan

前端异常监控解决方案研究

摘要: 异常监控不复杂也不简单啊... 原文:前端异常监控解决方案研究 作者:frustigor 前端监控包括行为监控.异常监控.性能监控等,本文主要讨论异常监控.对于前端而言,和后端处于同一个监控系统中,前端有自己的监控方案,后端也有自己等监控方案,但两者并不分离,因为一个用户在操作应用过程中如果出现异常,有可能是前端引起,也有可能是后端引起,需要有一个机制,将前后端串联起来,使监控本身统一于监控系统.因此,即使只讨论前端异常监控,其实也不能严格区分前后端界限,而要根据实际系统的设计,在最终的

[聊一聊系列]聊一聊前端速度统计(性能统计)那些事儿

欢迎大家收看聊一聊系列,这一套系列文章,可以帮助前端工程师们了解前端的方方面面(不仅仅是代码): https://segmentfault.com/blog/frontenddriver 上一篇文章我们讨论了,如何进行前端日志打点统计: https://segmentfault.com/a/1190000005861012 这一篇我们来看看如何进行速度统计 网站的速度影响了用户访问网站最初的体验.试想,如果一个用户,在等待了若干秒后,还是停留在白屏的状态,那么他的选择将是离开这个网站.性能统计有