# Preprocess

网页更新提醒 (opens new window)：是一款可以监控并跟踪记录网页内容更新，并立即通知你的浏览器插件

# Summary

预处理是比较高级的功能了，需要懂Javascript代码，「检测预处理」和「定时报告」对代码能力要求会高一些，「通知前预处理」相对来说入门比较简单，依葫芦画瓢，也大概能做一些定制。

# Preprocess Before Checking

就是在检测开始之前，先执行一段自定义的JS脚本，用于页面需要一些操作或者整理以后才能执行检测的场景。
「网页更新提醒」的原理是，定时获取圈选区域的DOM节点文本内容，与上一次的内容进行对比，预处理脚本就是在插件提取内容之前执行的代码。
相当于当次检测的节点控制权完全开发给了使用者，使用者可以自己决定节点的内容，从而决定插件是否能够检测到更新，可以说无所不能。

场景①，页面需要先设置过滤条件，然后点击查询才能看到数据，可以使用预处理脚本自动完成
场景②，检测的区域没有文字，只有链接或者图片地址会变更，可以通过预处理脚本将链接或者图片地址提取出来插入到监控的区域
场景③，页面需要检测的变更条件非常复杂，用匹配/排除规则难以准确界定的场景
场景④，页面自动化测试，可以自己编写代码模拟操作并检测操作结果是否符合预期
场景N。。。

以页面需要设置过滤条件然后点击查询为例，检测前预处理代码如下：

function beforeExtract(id, data) {
    /*设置输入框数值*/
    document.querySelector('.ipt').value = 100;

    /*点击按钮*/
    document.querySelector('.btn').click();
    
    /*支持异步/延时回调*/
    setTimeout(function() {
      _callback(id, data);
    }, 1000);
}

1
2
3
4
5
6
7
8
9
10
11
12

这里function beforeExtract(id, data) {_callback(id, data);}是固定格式，不要改动
ID: 是一个标识，代码回调映射，编写脚本不用关心
data: 是监控任务数据，完整的结构如下：

{
  selectors: [
    {type: 'xpath', selector: '//UL[1]'}
  ]
}

1
2
3
4
5

# Preprocess Before Notify

插件在检测到更新或者异常的时候，默认是会推送通知的，当然也有选项可以设置不推送。通知前预处理，可以做更多的个性化配置，使用场景包括：

场景①，当检测到异常以后，并不是不推送而是只给特定的人推送
场景②，插件的推送内容是程序内定的，可以通过预处理脚本实现推送内容的个性化定制

下面的代码表示，如果监控出现异常，则只给UID_xxx_N这个用户推送消息，根据盈亏比例显示个性化的推送标题和摘要

function beforeNotify(id, data) {
  var pre = parseFloat(data.preData.text);
  var cur = parseFloat(data.curData.text);
  var diff = cur - pre;
                  
  if (/重新框选/.test(data.text)) {
    data.config.webhook = "UID_xxx_N";
  } else {
    var text = "盈亏比例为：" + ((cur - pre).toFixed(2) / 80).toFixed(4) + "%";
    data.text = text;
    if (cur > pre) {
      data.config.title = "枭龙一号开单了，本单为盈利单！";
    } else {
      data.config.title = "枭龙一号开单了，本单为亏损单";
    }
  }
                  
  _callback(id, data);
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

这里function beforeNotify(id, data) {_callback(id, data);}是固定格式，不要改动
ID: 是一个标识，代码回调映射，编写脚本不用关心
data: 是通知需要的数据，完整的结构如下：

{
  text: '消息推送文本内容',
  html: '消息详情html代码',
  ignored: false, // 是否忽略本次通知
  config: {
    title: '监控任务标题',
    url: '监控任务的url地址',
    emails: '通知邮箱',
    webhook: '微信UID或者webhook地址'
  },
  preData: {
    text: '上一次检测到的文本内容',
    html: '上一次检测到的HTML片段'
  },
  curData: {
    text: '当前检测到的文本内容',
    html: '上一次检测到的HTML片段'
  },
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

我们可以通过data变量获取对应的数据，也可以动态修改这些字段，达到修改通知内容目的代码在一个沙盒页面运行，可以访问DOM接口&操作DOM!
注意，这是模板消息，只能修改以上这些字段，其他字段的修改没有意义

# Schedule Report

每个任务可以设置一个定时任务，在固定的时间点发送一个通知。
通知的内容是可以通过Javascript脚本进行定制的，原则上你可以定制任意的富文本内容（表格、列表等等）。

参考案例如下：

function schedule(id, data) {
  var text = data.list.map(function(item) {
    return item.text;
  }).join("\n");
  var html = data.list.map(function(item) {
    return item.html;
  }).join("<br>");
  
  /*设置报告标题*/
  data.config.title="这是日报";
  /*设置文本摘要*/
  data.text = text;
  /*设置通知详情富文本*/
  data.html = html;
                  
  _callback(id, data);
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

这里function schedule(id, data) {_callback(id, data);}是固定格式，不要改动
ID: 是一个标识，代码回调映射，编写脚本不用关心
data: 是通知需要的数据，完整的结构如下：

{
  text: '发送消息的文本摘要，需要脚本设置',
  html: '发送消息详情html代码，需要脚本设置',
  ignored: false, // 是否忽略本次通知
  config: {
    title: '监控任务标题',
    url: '监控任务的url地址',
    emails: '通知邮箱',
    webhook: '微信UID或者webhook地址'
  },
  list: [ // 第一条是最新的内容
    {html: '每次监控提取的HTML片段', text: 每次监控提取的文本内容},
    {html: '每次监控提取的HTML片段', text: 每次监控提取的文本内容}
  ]
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

← Notifications