1. 环境准备

下载chromelogger压缩包，并解压成文件夹。

在chrome浏览器中打开扩展程序，勾选开发者模式，并把解压后的文件夹拖放到chrome浏览器扩展程序里安装。

在wide主界面中，点击上方菜单中的“服务器”，在下拉列表中选择“环境配置”。

在打开的界面中勾选“启用调试—允许在浏览器审查服务器状态”，最后点击右下方的“保存”按钮，这样正式开启了调试功能。

2. 调试过程

想要使用调试功能，还需要在自己代码段后面插入调试代码段。

(1) 插入要测试的代码段: 在之前已经插入了自己想调试的某个代码段或者某些代码段，然后使用代码段管理插入调试代码段。

(2) 插入调试代码段

可以根据自己需要选择审查方式：变量审查、执行次数审查、开始时间审查、结束时间审查。

变量审查中可以指定审查的变量，如“本代码段的参数”;即上代码段的返回值、“输入参数设置”、“临时变量”、“固定值”。

(3) 查看输出: 客户端使用chrome中打开页面后，按F12显示出浏览器调试窗口，点亮右上角chromelogger的图标，然后把Console中的Prsesrve log勾选中，然后刷新页面，就能看到页面输出的结果。

(4) 注意事项: 对于整页刷新，由于拦截可能在navigator事件之前，因此需要勾选console里Preserve log选项。对于ajax无此现象。