手记:摘自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请求,并向后台传递参数,有时候确实能解决一些棘手的问题,在类似问题处理上不妨多尝试一条新路,或许就豁然开朗。

利用Image对象,建立Javascript前台错误日志记录的更多相关文章

  1. 将错误日志记录在txt文本里

    引言 对于已经部署的系统一旦出错对于我们开发人员来说是比较痛苦的事情,因为我们不能跟踪到错误信息,不能 很快的定位到我们的错误位置在哪,这时候如果能像开发环境一样记录一些堆栈信息就可以了,这时候我们就 ...

  2. PHP错误日志记录:display_errors与log_errors的区别

    我们所做的东西,无论在开发环境还是在生产环境都可能会出现一些问题. 开发环境下,我们会要求错误尽可能详细的呈现出来,错误提示信息越详细越好,越详细越能帮助开发人员确定问题所在并从根本上解决他们. 生产 ...

  3. 利用arguments对象在javaScript中实现重载(overload)

    一些概念: 重载(overload): 什么是: 相同函数名,不同参数列表的多个函数,在调用时,可根据传入参数的不同,自动选择对应的函数调用! 为什么: 减轻调用者的负担,一个函数名,可执行多种操作 ...

  4. .net错误日志记录(log4)

    Log4 web.config <!--这段放前面--> <configSections> <section name="log4net" type= ...

  5. PHP错误日志记录文件位置确定

    1.确定web服务器 ( IIS, APACHE, NGINX 等) 以哪一种方式支持PHP,通常是有下面2种方式 通过模块加载的方式, 适用于apache 通过 CGI/fastCGI 模式, 该模 ...

  6. .Net Core中间件和过滤器实现错误日志记录

    1.中间件的概念 ASP.NET Core的处理流程是一个管道,中间件是组装到应用程序管道中用来处理请求和响应的组件. 每个中间件可以: 选择是否将请求传递给管道中的下一个组件. 可以在调用管道中的下 ...

  7. wpf 全局异常捕捉+错误日志记录+自动创建桌面图标

    /// /// 创建桌面图标 /// public static void CreateShortcutOnDesktop(string LnkName) { String shortcutPath ...

  8. ENABLE_DDL_LOGGING 参数使用 监控对象的DDL(在alter 日志记录DDL语句)

    启用 DDL 日志记录 功能--支持动态调整 alter system set enable_ddl_logging=true; alter system set enable_ddl_logging ...

  9. asp.net Web项目中使用Log4Net进行错误日志记录

      使用log4net可以很方便地为应用添加日志功能.应用Log4net,开发者可以很精确地控制日志信息的输出,减少了多余信息,提高了日志记录性能.同时,通过外部配置文件,用户可以不用重新编译程序就能 ...

随机推荐

  1. oracle之三手工完全恢复

    手工完全恢复 3.1 完全恢复:通过备份.归档日志.current log ,将database恢复到failure 前的最后一次commit状态. 3.2 完全恢复的步骤 1)restore: OS ...

  2. 基于Socket的编程

    2020/7/5 客户端步骤: 1.创建Socket. 根据指定服务端的IP地址或者端口号构造Socket类对象: Socket socket  =  new  Socket(InetAddress. ...

  3. Android实现二值点阵图识别

    好好学习,天天向上 本文已收录至我的Github仓库DayDayUP:github.com/RobodLee/DayDayUP,欢迎Star 前言 我这几天在做一个东西,就是一张像二维码这样的 n*n ...

  4. node进阶| 解决表单enctype="multipart/form-data" 时获取不到Input值的问题

    今天在学习node踩到一个坑:form设置enctype="multipart/form-data"上传文件时,无法获取到表单其他input的值. 因为之前上传文件用的是 form ...

  5. 第一次软件工程与UML作业

    这个作业属于哪个课程 https://url.cn/IMQa18Jo 这个作业要求在哪里 https://edu.cnblogs.com/campus/fzzcxy/2018SE1/homework/ ...

  6. 5.Scalal语法03 - 函数

  7. 4.Strom-可靠性保证

  8. Flex、Grid、媒体查询实现响应式布局

    本篇文章主要讲述使用Flex布局.Grid布局以及媒体查询三种方式来实现响应式布局. 文章涉及代码在线coding地址 效果图: 文字描述: 屏幕大小不同,展示列数不同,1-5号按照屏幕大小可展示2到 ...

  9. OpenCV图像处理学习笔记-Day1

    OpenCV图像处理学习笔记-Day1 目录 OpenCV图像处理学习笔记-Day1 第1课:图像读入.显示和保存 1. 读入图像 2. 显示图像 3. 保存图像 第2课:图像处理入门基础 1. 基本 ...

  10. visual studio 2015 安装MSDN全称Microsoft Developer Network 安装离线的MSDN

    MSDN: 微软向开发人员提供的一套帮助系统,其中包含大量的开发文档,技术文章和示例代码. 这里介绍了vs2015 装离线的MSDN(说明一点是,如果不行,说明你的文件有缺陷,没安装好,之前我用vs2 ...