Google Analytics для сбора ошибок JavaScript / Хабр

Не так давно на Хабре была статья про наворочен��ый стартап, заточенный на сбор ошибок JavaScript. Далеко не всегда нужно столько возможностей, но оказалось, что многие просто не знают про старый бородатый способ с Google Analytics. Про него я и попытаюсь кратенько рассказать.

Первое, что вам нужно, это сам установленный Google Analytics (далее просто GA) на сайте, здесь всё стандартно и менять ничего не надо:

<script>
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXXXXX']);
_gaq.push(['_trackPageview']);

(function() {
	var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
	ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
	var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>

Далее, желательно ещё до подгрузки каких-либо скриптов, т. е. в head, выше всех поставить следующее:

<script>
var _gaq = window._gaq || [];
window.onerror = function(msg, url, line) {
	var preventErrorAlert = true;
	_gaq.push(['_trackEvent', 'JS Error', msg, navigator.userAgent + ' -> ' + url + " : " + line, 0, true]);
	return preventErrorAlert;
};
</script>

preventErrorAlert — возвращая true, мы предотвращаем появление раздражающего окна с ошибками в старых версиях IE и Opera.
msg — сообщение об ошибке.
url — файл скрипта в котором произошла ошибка.
line — на какой строчке произошла ошибка.
navigator.userAgent — простенькие данные браузера, чтобы понятно было где копать.

Последние два параметра (напомнил korzhik):
0 — это счётчик, т. е. можно just for fun передать сюда номер строчки и вычислить на какой в среднем происходит больше всего ошибок, можно и что-то полезное :)
true — не учитывать в показателе отказов. Т. е. событие не будет засчитано, как пользовательское действие. Важно для тех, кто серьёзно занимается аналитикой.

Практически все современные браузеры поддерживают onerror:

Chrome 13+
Firefox 6.0+
Internet Explorer 5.5+
Opera 11.60+
Safari 5.1+

Таким образом, можно смело собирать критические ошибки. Но ошибки бывают разные, если вы используете jQuery, то рекомендую добавить ещё следующий код, после её инициализации:

jQuery.error = function (message) {
	_gaq.push(['_trackEvent', 'jQuery Error', message, navigator.userAgent, 0, true]);
}

Как сделать обработчик собственных исключений, думаю уже понятно. И пара скриншотов, где всё это дело потом найти и как оно будет выглядеть.

Заходим в GA в наш проект, выбираем «Стандартные отчёты»:

В панели слева находим «Содержание» → «События» → «Обзор»:

Видим график событий и снизу справа сами типы событий:

Выбираем нужное нам событие «JS Error»:

Переходим в «Действие по событию»:

Выбираем интересующую нас ошибку и наблюдаем отладочную информацию. Уходить глубже смысла особого не имеет:

Зная, как работают события GA, где они находятся и как выглядят, вы без проблем сможете настроить тот вид отчётов об ошибках, который наиболее подходит под ваш проект.

Google Analytics для сбора ошибок JavaScript

Публикации

Ближайшие события