error report
1.0.0
Введение. С точки зрения простоты, тестируемости и слабой связи большинство разработчиков интерфейсов могут извлечь выгоду из отчетов об ошибках. Чтобы решить проблему унифицированной обработки информации об исключениях на внешнем интерфейсе, отчет об ошибках позволяет использовать сложные интерфейсные отчеты об исключениях. Записывайте информацию о внешних исключениях, поддерживайте временное хранение исключений при отключении и автоматически загружайте информацию о временных исключениях после подключения к Интернету. Охватывает исключения Vue, исключения Axios, собственные исключения Ajax, исключения, создаваемые JS, исключения Promise, исключения Async, исключения при загрузке сторонних ресурсов CDN и т. д., охватывая почти все исключения, которые могут быть задействованы во внешнем интерфейсе.
import ErrorReport from "./plugins/errorReport";
Vue.use(ErrorReport, {
reportUrl: "http://localhost:10300/errorReport",
env: "dev",
appId: "error-report-5c6pz3e4il59k2f3b6",
appName: "error-report"
});
примеры
| свойство | иллюстрировать | тип | значение по умолчанию | может ли он быть пустым |
|---|---|---|---|---|
| URL-адрес отчета | Адрес сообщения об исключении | Нить | http://localhost:10300/errorReport | Н |
| время задержки | Задержка сообщения об ошибке | Число | 3000 (единица измерения: миллисекунды) | Да |
| идентификатор приложения | Идентификатор проекта | Нить | Да | |
| имя приложения | Название проекта | Нить | Да | |
| браузер | Имя браузера | Нить | Внутренние методы могут получить | Н |
| устройство | Имя устройства | Нить | Внутренние методы могут получить | Н |
| ID пользователя | ID пользователя | Нить | Да | |
| жетон | жетон | Нить | Да | |
| timeSpan | Временная метка отправки данных | Число | Получайте текущую временную метку каждый раз | Да |
| тип информации | Категория информации, по умолчанию — ошибка. | Нить | тип | Да |
| сообщение | Подробности ошибки | Нить | Подробности ошибки | Да |
| пользовательский агент | пользовательский агент | Нить | пользовательский агент | Да |
| URL-адрес страницы | Адрес страницы отчета | Нить | window.location.href | Да |
| куча | Информация о стеке ошибок | Нить | Информация о стеке ошибок | Да |
| localStorageKey | Рекомендуется использовать фиксированный ключ, когда пользователь в следующий раз откроет браузер, аномальные данные можно будет напрямую восстановить и загрузить. | Нить | localStorageKey | Н |
| окружение | Среда: dev, test, uat, pro | Нить | среда разработки | Да |
| данные | Дополнительные сообщения об ошибках | Объект | Дополнительные сообщения об ошибках | Да |
Учитывая, что некоторые проекты используют собственный Ajax, исключения Ajax перехватываются изначально, а исключения Axios также перехватываются. Если используется детская обувь с использованием Axios, об исключениях будет сообщено дважды (причина: перехватчик исключений Axios один раз, собственный перехват исключений Ajax). Если вы не хотите сообщать об этом дважды, вы можете прокомментировать следующий код (достаточно любого мониторинга исключений Axios или мониторинга Ajax ). В отчете об ошибках/src/plugins/errorReport.js.
Примечание. Мониторинг исключений Axios . Об исключениях Axios не сообщается;
// Axios 异常监控
axios.interceptors.response.use(null, error => {
this.options.msg = error.message;
this.options.stack = this.processStackMsg(error);
this.options.data = JSON.stringify({
category: "Axios"
});
// 合并上报的数据，包括默认上报的数据和自定义上报的数据
const reportData = Object.assign({}, this.options);
this.saveReport(reportData);
return Promise.reject(error);
});
Или закомментируйте собственный мониторинг Ajax , и о собственных исключениях Ajax не будет сообщаться.
// Ajax监控
const ajaxListener = {};
// 复制send方法
ajaxListener.tempSend = XMLHttpRequest.prototype.send;
// 复制open方法
ajaxListener.tempOpen = XMLHttpRequest.prototype.open;
// 重写open方法,记录请求的url
XMLHttpRequest.prototype.open = function(method, url, boolen) {
ajaxListener.tempOpen.apply(this, [method, url, boolen]);
this.ajaxUrl = url;
};
const self = this;
// 发送
XMLHttpRequest.prototype.send = function(data) {
const tempReadystate = this.onreadystatechange;
this.onreadystatechange = function() {
if (this.readyState === 4) {
if (this.status >= 200 && this.status < 300) {
tempReadystate && tempReadystate.apply(this, [data]);
return;
}
self.options.msg = "AJAX 请求错误";
self.options.stack = `错误码：${this.status}`;
self.options.data = JSON.stringify({
requestUrl: this.ajaxUrl,
category: "XMLHttpRequest",
text: this.statusText,
status: this.status
});
// 合并上报的数据，包括默认上报的数据和自定义上报的数据
const reportData = Object.assign({}, self.options);
// 把错误信息发送给后台
self.saveReport(reportData);
}
};
ajaxListener.tempSend.apply(this, [data]);
};
Конкретная ситуация зависит от потребностей!
Конкретная ситуация зависит от потребностей!
Конкретная ситуация зависит от потребностей!
Скажи важные вещи три раза! ! !
Авторские права MIT (c) 2019 sky9102
