利用Image对象，建立Javascript前台错误日志记录

手记：摘自Javascript高级程序设计（第三版），利用Image对象发送请求，确实有很多优点，有时候这也许就是一个创意点，再次做个笔记供自己和大家参考。

原文：

开发 Web 应用程序过程中的一种常见的做法，就是集中保存错误日志，以便查找重要错误的原因。
例如数据库和服务器错误都会定期写入日志，而且会按照常用 API 进行分类。在复杂的 Web 应用程序 中，我们同样推荐你把 JavaScript 错误也回写到服务器。换句话说，也要将这些错误写入到保存服务器 端错误的地方，只不过要标明它们来自前端。把前后端的错误集中起来，能够极大地方便对数据的分析。
要建立这样一种 JavaScript 错误记录系统，首先需要在服务器上创建一个页面（或者一个服务器入 口点），用于处理错误数据。这个页面的作用无非就是从查询字符串中取得数据，然后再将数据写入错 误日志中。这个页面可能会使用如下所示的函数：

function logError(sev, msg){
     var img = new Image(); 
     img.src = "log.php?sev=" + encodeURIComponent(sev) + "&msg=" + encodeURIComponent(msg);
 } 

这个 logError()函数接收两个参数：表示严重程度的数值或字符串（视所用系统而异）及错误消 息。其中，使用了 Image 对象来发送请求，这样做非常灵活，主要表现如下几方面。

1、所有浏览器都支持 Image 对象，包括那些不支持 XMLHttpRequest 对象的浏览器。

2、可以避免跨域限制。通常都是一台服务器要负责处理多台服务器的错误，而这种情况下使用 XMLHttpRequest 是不行的。 

3、在记录错误的过程中出问题的概率比较低。大多数 Ajax 通信都是由 JavaScript 库提供的包装函 数来处理的，如果库代码本身有问题，而你还在依赖该库记录错误，可想而知，错误消息是不 可能得到记录的。

只要是使用 try-catch 语句，就应该把相应错误记录到日志中。来看下面的例子。 

for (var i=0, len=mods.length; i < len; i++){
     try { 
            mods[i].init(); 
      } catch (ex){
            logError("nonfatal", "Module init failed: " + ex.message); 
      }
} 

 

在这里，一旦模块初始化失败，就会调用 logError()。第一个参数是"nonfatal"（非致命），表 示错误的严重程度。第二个参数是上下文信息加上真正的 JavaScript 错误消息。记录到服务器中的错误 消息应该尽可能多地带有上下文信息，以便鉴别导致错误的真正原因。

 

----------分割线---------------------------Javascript--------------------------------

利用Image对象的Src来进行get请求，并向后台传递参数，有时候确实能解决一些棘手的问题，在类似问题处理上不妨多尝试一条新路，或许就豁然开朗。