Legyes.hu

Böngésző kliens oldali hibák naplózása szerver oldalon

Webapp fejlesztéskor felmerül az az igény, hogy valahogy tudni kellene a JavaScript kódban felmerülő hibákról. Persze van az a változat, hogy „Légy szíves nyomj egy Control+Shift+I -t, válaszd a Konzol-t és mondd el, hogy mit látsz”, de ez annyira nem praktikus. A reggeli kávé melletti Facebook postok görgetése közben egy hasznos webes blogra bukkantam, a https://blog.fps.hu -ra. Bejegyzéseikből látszik, hogy a témát náluk is az Élet adja. Ott találtam a témaindító bejegyzést: JavaScript hibák naplózása szerver oldalon . Amit én egy kicsit átszabtam:
Készítettem egy error_report.js -t, amit az összes JS <script src=”” > tag elé tettem, majd az alábbi tartalmat illesztettem bele:

// JS error logging on server side, based on: 
// https://blog.fps.hu/javascript-hibak-naplozasa-szerver-oldalon-remote/

window.onerror = function (errorMsg, url, lineNumber, column, errorObj) {
   if (errorMsg.indexOf('Script error.') > -1) {
      return;
   }

   var error_info = {
      error_msg : errorMsg,
      url : url,
      line: lineNumber,
      column : column,
      error_object : errorObj,
      platform : data.platform, // nálam app specifikus
      guid : data.guid // ez nálam a webapp GUID-ja
   };

   // szándékosan nem jQuery, mert a lehető legtöbb hibát akartam elkapni
   xhr = new XMLHttpRequest();
   xhr.open('POST', data.api_url + 'errors.php');
   // itt a data.api_url ugyancsak a webappos változó
   // cseréld a saját PHP-d elérési útjára
   xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
   xhr.send(encodeURI('errordata=' + JSON.stringify(error_info)));
};

A PHP scriptben pedig a $_POST[‘errordata’] változóban lesz minden, JSON stringként – tehát json_decode() kell rá – amire szükségünk van.

Exit mobile version