Внешний мониторинг ошибок и отчеты

внешний интерфейс программист JavaScript Ajax

Классификация ошибок интерфейса:

один:Как раз вовремя ошибка запуска кода:Также известны как ошибки кода. Эта ошибка часто вызывается программистами при написании кода, например, синтаксические ошибки и логические ошибки.Такие ошибки обычно обнаруживаются на этапе тестирования, но может быть и «рыба, которая ускользает из сети».

два:Ошибка загрузки ресурса:Эта ошибка обычно вызвана тем, что файл не найден (404) или превышено время загрузки файла.

Способы отлова ошибок:

Обычно есть два способа зафиксировать ошибки при своевременном выполнении кода.

  try{      // 运行可能出错的代码  }catch{      // 捕获错误  }

Другой — window.onerror

Обычно есть три способа зафиксировать ошибки загрузки ресурсов:

Объект.onerror,

 var img =document.getElementById('#img');

     img.onerror = function() {

        // 捕获错误

     }

окно.производительность.getEntries(),

Когда браузер получает веб-страницу, он отправляет HTTP-запрос каждому объекту (файлу сценария, таблице стилей, файлу изображения и т. д.) на веб-странице. А через метод window.performance.getEntries можно вернуть временную статистику этих запросов в виде массива, каждый член массива — это объект PerformanceResourceTiming!

(function () {
    // 浏览器不支持，就算了！
    if (!window.performance && !window.performance.getEntries) {
        return false;
    }
 
    var result = [];
    // 获取当前页面所有请求对应的PerformanceResourceTiming对象进行分析
    window.performance.getEntries().forEach((item) => {
        result.push({
            'url': item.name,
            'entryType': item.entryType,
            'type': item.initiatorType,
            'duration(ms)': item.duration
        });
    });
 
    // 控制台输出统计结果
    console.table(result);
})();


Подробности:developer.Mozilla.org/en-US/docs/…

Это загруженный ресурс, затем вычтите загруженный ресурс из общего количества ресурсов, а остальное — количество выгруженных ресурсов.

Перехватите событие ошибки

window.addEventListener("error",function(ev){    console.log('捕获',ev)// 捕获错误 },true);

Третий параметр addEventListener должен быть истинным, что означает, что он срабатывает на этапе захвата, если он изменен на false, это фаза всплытия, и событие ошибки не может быть получено.

<!-- 一个不存在的资源 -->
<script src="//baidu.com/test.js"></script>


Как сообщить об ошибках:

Один: загрузка Ajax, отчет Ajax должен инициировать запрос Ajax в том месте, где ошибка зафиксирована в комментарии выше, для отправки информации об ошибке на сервер.

Второй: используйте объект Image для отправки информации

(new Image()).src="http://post.error.com?data=xxx"


Можно ли поймать междоменные ошибки файла js:

Ответ - да, сообщение об ошибке - ошибка скрипта


Решение, междоменное получение файлов js ограничено, если вы хотите получать ошибки js в других доменах, вам нужно добавить атрибут crossorigin в тег script, а затем установить заголовок ('Access-Control-Allow-Origin: *') на стороне сервера или указать доменное имя.


Категории