前端代码异常如何实现高效日志收集与实时监控？

本文共计3747个文字，预计阅读时间需要15分钟。

在复杂的网络环境和浏览器环境下，单纯的自动测试、QA测试及Code Review都显得不足。若对页面稳定性和准确性要求较高，则必须拥有一套完善的代码异常监控体系。从前端代码异常监控出发，确保应用的正常运行。

在复杂的网络环境和浏览器环境下，自测、QA测试以及 Code Review 都是不够的，如果对页面稳定性和准确性要求较高，就必须有一套完善的代码异常监控体系，本文从前端代码异常监控的方法和问题着手，尽量全面地阐述错误日志收集各个阶段中可能遇到的阻碍和处理方案。

☞ 收集日志的方法

平时收集日志的手段，可以归类为两个方面，一个是逻辑中的错误判断，为主动判断；一个是利用语言给我们提供的捷径，暴力式获取错误信息，如 try..catch 和 window.onerror。

1. 主动判断

我们在一些运算之后，得到一个期望的结果，然而结果不是我们想要的

// test.js function calc(){ // code... return val; } if(calc() !== "someVal"){ Reporter.send({ position: "test.js::<Function>calc" msg: "calc error" }); }

这种属于逻辑错误/状态错误的反馈，在接口 status 判断中用的比较多。