JavaScript调试在Web应用程序开发中是一件非常麻烦的事情。因为如果您编写的JavaScript代码中存在任何错误,许多Web浏览器都不会通知您。他们只是默默地失败并阻止以下代码执行。为了调试JavaScript代码,我们需要一个良好的日志机制来帮助我们记录错误信息,我们经常需要将JavaScript代码中的错误记录到服务器以便在生产Web应用程序中进行调试,
我们应该做什么?
我们想到的第一个想法可能是使用AJAX,因为它涉及客户端服务器通信,我们也应该异步,因为我们不想在我们将某些内容记录到服务器时中断用户。这是可行的,但它需要编写许多代码来创建XMLHttpRequest对象并实现与之相关的一些功能,因为通信也可能被中断,所以它也容易出错。
有简单可靠的方法吗?是的,我们可以在JavaScript中创建一个Image对象。详细步骤如下:
1.我们需要创建一个后端服务器脚本来获取传递的查询字符串并将它们存储在服务器上。我们假设这是logger.php;
2.在JavaScript中创建一个log()函数:
function log(type,message){
var img=new Image();
img.src="logger.php?type="+type+"&message="+message;
}
3. Call the log() function like :
log("Error","Syntax error");
就这样。您现在只需将信息记录到服务器即可。
在log()函数中,我们创建了一个Image对象,它在所有现代浏览器中都受支持,稍后当我们分配src属性时,图像将立即加载。这将使用传递的查询字符串加载logger.php脚本。它具有与AJAX方法类似的效果。
根据“ ”这篇文章 ,使用它的好处是:
- Image对象在所有浏览器中都可用,甚至是那些不支持XMLHttpRequest对象的浏览器。
- 跨域限制不适用。通常有一个服务器负责处理来自多个服务器的错误记录,并且XMLHttpRequest在这种情况下不起作用。
- 在记录错误的过程中发生错误的可能性较小。大多数Ajax通信是通过JavaScript库提供的功能包装器来处理的。如果该库的代码失败,并且您尝试使用它来记录错误,则可能永远不会记录该消息。