利用WebMonitor实时监控网页变化-支持手机微信,邮箱,TG等通知提醒

  • 首发：2022年8月17日
  • by
  • 9

第一时间获取信息，就可以第一时间掌握资源。信息时代瞬息万变，信息又错综复杂，生活这样一个信息时代里，如果第一时间获取信息就变得有点难度了。在《在线RSS阅读器收集整理汇总》一文，挖站否分享了大量的RSS阅读器，RSS之所以一直未“死”，能够帮助我们获取信息应该是重要原因之一。

利用RSS来获取信息有一定的局限性，例如信息可能存在延迟、信息量过大无法找到对自己有用的信息等，于是又有人造出了一个工具：Huginn，它是一个私人IFTTT，例如搭建任务采集触发平台，自动跟进实时提醒（用Email Slack TG QQ 微信接受推送），全文 RSS 输出等。

不过，Huginn安装和使用过程中还是略显复杂，这篇来分享一下类似于Huginn但是部署起来更简单的工具：WebMonitor。它支持邮件，pushover，微信提醒（support by server酱），Bark推送，自定义GET/POST通知, Slack 通知以及 Telegram 通知等。

利用WebMonitor实时监控网页变化-支持手机微信,邮箱,TG等通知提醒

更多的实用工具还有：

  1. 密码管理软件整理汇总-好用免费和付费的密码管理软件推荐
  2. Tiny Tiny RSS最新安装与使用教程-Awesome TTRSS Docker安装配置方法
  3. RSSHub给不支持RSS网站制作RSS订阅源-支持B站,知乎,微博,豆瓣,今日头条

一、WebMonitor安装准备

网站：

  1. 官网：https://github.com/LogicJake/WebMonitor
  2. 文档：https://www.logicjake.xyz/WebMonitor/

1.1 域名与服务器

一个域名。可选。想要长期使用WebMonitor，自然要使用域名+SSL证书了，单纯地用IP地址也可以使用WebMonitor，但是这终究不是一个长久之计，所以你先准备好一个域名，并解析到你的服务器IP 上，参考：域名服务。

一台VPS。WebMonitor推荐使用Docker安装，你需要准备一台VPS主机，现在便宜的VPS主机也非常多，参考：VPS主机排行榜单。

1.2 一键安装Docker

在VPS主机上安装Docker可以使用一键命令安装方法，命令如下：

#Docker 一键安装脚本 
bash <(curl -sSL https://cdn.jsdelivr.net/gh/SuperManito/LinuxMirrors@main/DockerInstallation.sh) 
#Docker CE：Docker Community Edition 镜像仓库，用于下载并安装 Docker 相关软件包。 
#Docker Hub：Docker Hub 镜像仓库，默认为官方提供的公共库，用于切换下载镜像时的来源仓库，又称镜像加速器。

脚本集成安装 Docker Engine与 Docker Compose，可手动选择安装版本和下载源，还可手动选择镜像加速器，支持国内外服务器环境和 ARM架构处理器环境使用。详情：Docker 和 Docker Compose 一键安装脚本 可手动选择安装版本和下载源。

WebMonitor安装Docker

二、WebMonitor安装过程

首先，进入你的VPS主机，新建一个docker-compose.yml

mkdir -p /opt/webmonitor && cd /opt/webmonitor && vi docker-compose.yml

然后将以下代码复制粘贴进去保存，记得修改密码为你自己的。

version: '3.5'
services:
  webmonitor:
    image: logicjake/webmonitor
    container_name: webmonitor
    environment:
      - PORT=8000
      - USERNAME=admin
      - PASSWORD=wzfou.com # 设置你的管理员密码
    ports:
      - 8000:8000
    volumes:
      - ./data:/app/db
    restart: unless-stopped

最后，使用命令开始跑起来：

docker-compose up -d
WebMonitor运行Docker
WebMonitor安装完成

安装完成后，打开你的IP+8000端口就可以进入到WebMonitor了。

WebMonitor打开端口

三、WebMonitor域名访问

对于Docker来说，反向绑定域名可以变得更简单：Nginx反向绑定域名管理工具-无需修改Nginx规则一键添加反向绑定域名。2022.10.20更新

对于Oneinstack或者LNMP这类的一键安装包已经配置好了Nginx，先用命令添加虚拟主机绑定好你的域名，然后打开Nginx配置文件，参考以下配置做好域名反代：（主要是前后部分复制粘贴过去，中间部分根据你自己的配置来调整。）

server
    {
        listen 443 ssl http2;
        #listen [::]:443 ssl http2;
        server_name hczj.wzfou.me ;
        index index.html index.htm index.php default.html default.htm default.php;
        root  /home/wwwroot/hczj.wzfou.me;

        ssl_certificate /usr/local/nginx/conf/ssl/hczj.wzfou.me/fullchain.cer;
        ssl_certificate_key /usr/local/nginx/conf/ssl/hczj.wzfou.me/hczj.wzfou.me.key;
        ssl_session_timeout 5m;
        ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3;
        ssl_prefer_server_ciphers on;
        ssl_ciphers "TLS13-AES-256-GCM-SHA384:TLS13-CHACHA20-POLY1305-SHA256:TLS13-AES-128-GCM-SHA256:TLS13-AES-128-CCM-8-SHA256:TLS13-AES-128-CCM-SHA256:EECDH+CHACHA20:EECDH+CHACHA20-draft:EECDH+AES128:RSA+AES128:EECDH+AES256:RSA+AES256:EECDH+3DES:RSA+3DES:!MD5";
        ssl_session_cache builtin:1000 shared:SSL:10m;
        # openssl dhparam -out /usr/local/nginx/conf/ssl/dhparam.pem 2048
        ssl_dhparam /usr/local/nginx/conf/ssl/dhparam.pem;

        include rewrite/other.conf;
        #error_page   404   /404.html;

        # Deny access to PHP files in specific directory
        #location ~ /(wp-content|uploads|wp-includes|images)/.*\.php$ { deny all; }

        include enable-php.conf;
		
		  
#后半部分
    location / {
        proxy_set_header  Host  'hczj.wzfou.me';
        proxy_pass http://127.0.0.1:8000;
        proxy_redirect off;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header        X-Forwarded-Proto $scheme;
     }
#后半部分


        access_log  /home/wwwlogs/hczj.wzfou.me.log;
    }

如果你用的是宝塔面板，你可以直接在后台添加网站，绑定域名。然后在网站设置中反代域名，端口要换成8000（详情请看宝塔面板教程），如下图：

WebMonitor宝塔面板

打开你的域名，现在就可以看到WebMonitor成功用域名访问了。

WebMonitor域名访问

四、WebMonitor使用教程

这个就是WebMonitor的后台界面。

WebMonitor界面

4.1 设置通知方式

WebMonitor支持邮箱、微信、TG等通知方式。

WebMonitor添加通知方式

WebMonitor的微信通知是采用server酱，你只需要进入到server酱获取一个API即可。

WebMonitor获取API
WebMonitor填入API

4.2 设置TG通知方式

如果采用 Telegram 提醒，则必须设置“系统管理/Telegram Bot 设置”中的 Telegram Bot Token。首先关注：@botfarther

WebMonitor设置TG

然后输入：/newbot，给你的Bot设置一个名称就可以了看到Telegram Bot Token生成了。

WebMonitor生成Token

把这个Telegram Bot Token复制粘贴到系统管理/Telegram Bot 设置中。

WebMonitor粘贴

获取你的Bot ID。获取的方式是：https://api.telegram.org/bot<token>/METHOD_NAME，假设你的token是：123456:ABC-DEF1234ghIkl-zyx57W2v1u123ew11，那么打开你的浏览器访问以下链接：https://api.telegram.org/bot123456:ABC-DEF1234ghIkl-zyx57W2v1u123ew11/getUpdates

这时你会看到ID。

WebMonitor得到ID

新增通知方式，复制这个ID填写到TG通知方式里。

WebMonitor填入通知ID

4.3 设置网页监控

在 任务管理 > 网页监控管理 添加新任务

必须选择一种通知方式

默认抓取频率为5分钟，自行根据需要调整，单位分钟，不建议调太快，以防反爬

元素选择器类型可以选择 Xpath， Css selector 或 JsonPath。一行一个元素选择器，每一行的格式为：选择器名称{选择器内容}，例如：

title{//*[@id="id3"]/h3/text()}
myurl{//*[@id="id3"]/h3/text()}Copy to clipboardErrorCopied

以下字段为系统默认保留字段，请不要使用且无法被覆盖：

url：该任务对应的监控网址

可以借助浏览器 F12 直接 copy 前两种选择器，需要注意的是，往往浏览器 copy 得到是元素，而不是文本信息，需要做以下补充：

xpath

获取元素文本信息，在浏览器得到的选择器后加/text()，如
//*[@id="id3"]/h3 => //*[@id="id3"]/h3/text()

获取元素属性信息，在浏览器得到的选择器后加/@属性名，如想获取元素href值
//*[@id="id3"]/h3 => //*[@id="id3"]/h3/@href

获取元素及其子元素的所有文本信息，在浏览器得到的选择器后加/string()，如
//*[@id="id3"]/h3 => //*[@id="id3"]/h3/string()

css selector

获取元素文本信息，在浏览器得到的选择器后加::text，如
div#id3 > h3 => div#id3 > h3::text

获取元素属性信息，在浏览器得到的选择器后加::attr(属性名)，如想获取元素href值
div#id3 > h3 => div#id3 > h3::attr(href)

JsonPath

针对返回 json 数据的接口, 可以使用 JsonPath 提取数据, 具体教程参考 https://goessner.net/articles/JsonPath/ 。在Chrome F12开发者工具中，也可以找到对应元素，然后右键该元素，选择“Copy Property Path”。

消息体模板。消息体模板可为空，如果为空，则按照元素选择器的定义顺序以制表符为间隔拼接为字符串。下面介绍消息体模板的使用方式，如果元素选择器的设置为：

title{//*[@id="id3"]/h3/text()}
myurl{//*[@id="id3"]/h3/text()}

则消息体模板可以设置为：

{title}的网址是{myurl}

如果title对应的元素选择器提取的内容为“mm”，myurl对应的元素选择器提取的内容为“wzfou.com”，则得到的消息内容为“mm是wzfou.com”。

五、WebMonitor监控实例

5.1 网页内容变动

如果你想要监控某一个网页是否有最新内容更新，你可以用Chrome访问，一般来说最新的内容是放在页面最上方的部分，用Chrome复制Xpath，将该内容的元素复制出来。

WebMonitor查看元素

新建网页监控，填入刚刚复制的Xpath，同时根据你自己的需要加上text()、@href、string()等参数，说明见上方。

WebMonitor填写参数

保存后，你就可以在任务状态中看到运行结果了。

WebMonitor任务状态

如果你选择的微信通知，这时你的微信就会收到WebMonitor发来的网页内容变动通知了。

WebMonitor微信通知

5.2 监控数值变化

WebMonitor可以监控网页中某一个数值的变化。

WebMonitor内容变化

数值的变化可以结合正则规则和监控规则来实现更加灵活通知。

WebMonitor规则设定

正则表达式

如果获取到的文本信息有冗余，可以采用正则进一步筛选，如
价格：1390使用正则([1-9]\d*)提取到纯数字1390

监控规则

默认不填则文本发生变化就发通知，多规则请以’;’分开。存在规则的情况下，如果文本发生变化，从前往后检查规则，若符合其中一项规则就发通知。如下：

规则格式：-规则 参数
支持以下规则：

-without
如：文本发生变化且文本内容不包含上架
-without 上架

-contain
如：文本发生变化且文本内容包含上架
-contain 上架

-increase
如：文本发生变化且相较于旧值，数值增长超过3
如果文本内容不是纯数字，请用正则提取出纯数字，否则将会报错
-increase 3

-decrease
如：文本发生变化且相较于旧值，数值减少超过3
如果文本内容不是纯数字，请用正则提取出纯数字，否则将会报错
-decrease 3

-equal
如：文本发生变化且等于某个值，数值等于3
如果文本内容不是纯数字，请用正则提取出纯数字，否则将会报错
-equal 3

-less
如：文本发生变化且小于某个值，数值小于3
如果文本内容不是纯数字，请用正则提取出纯数字，否则将会报错
-less 3

-more
如：文本发生变化且大于某个值，数值大于3
如果文本内容不是纯数字，请用正则提取出纯数字，否则将会报错
-more 3

选择使用TG通知方式适合大量频繁的变动通知。

WebMonitor得到提醒

六、总结

WebMonitor部署简单，结合监控规则，你可以实现更加灵活的网页信息变动提醒，不过局限就在于个人使用，适合个人打造信息获取平台。

文章出自：挖站否 https://wzfou.com/webmonitor/， 版权所有。本站文章除注明出处外，皆为作者原创文章，可自由引用，但请注明来源。


分享到：
本文已收录到：实用建站工具专题
Avatar for Qi

Qi611 Posts

关于站长（Qi），2008年开始混迹于免费资源圈中，有幸结识了不少的草根站长。之后自己摸爬滚打潜心学习Web服务器、VPS、域名等，兴趣广泛，杂而不精，但愿将自己经验与心得分享出来与大家共勉。

猜你喜欢

VPS主机和服务器磁盘IO读写速度测试方法-VPS主机真实IO检测工具

VPS主机和服务器磁盘IO读写速度测试方法-VPS主机真实IO检测工具

  • 2023年3月31日
BlueSkyXN 综合工具箱-VPS主机性能网络检测和常用脚本下载综合工具

BlueSkyXN 综合工具箱-VPS主机性能网络检测和常用脚本综合工具

  • 2021年9月20日
哪吒监控-服务器状态监控,SSL证书变更到期,Ping监控报警和命令批量执行和计划任务

哪吒监控-服务器状态监控,SSL证书变更到期,Ping监控和定时任务提醒

  • 2021年9月10日
VPS主机速度和性能综合测试工具整理汇总-一键检测VPS主机性能与速度

VPS主机速度和性能综合测试工具整理汇总-一键检测VPS性能与速度

  • 2021年4月16日
分享八个优秀的免费PHP探针-实时检测PHP信息,服务器运行状况和网卡流量

分享八个优秀的免费PHP探针-实时检测PHP信息,服务器运行和流量

  • 2020年12月28日
已有 9 条评论
最新 最早 最佳
  1. Avatar for 2 2

    是否有些網站它檢測不到內容

    2023年10月15日 09:35来自iPhone顶 踩 回复
    • Avatar for Qi Qi (文章作者)

      有一些动态不行。

      2023年10月24日 23:09顶 踩 回复
  2. Avatar for test test

    功能很强大呀[草泥马]

    2023年10月15日 01:39顶 踩 回复
  3. Avatar for test test

    功能很强大呀

    2023年10月15日 01:36顶 踩 回复
  4. Avatar for dashsdh dashsdh

    这个能和huginn一样有一个去重功能吗

    2023年6月27日 09:57顶 踩 回复
    • Avatar for Qi Qi (文章作者)

      好像是没有的。

      2023年7月1日 14:00顶 踩 回复
  5. Avatar for be be

    微信通知这个不错

    2022年8月19日 12:10顶 踩 回复
  6. Avatar for teg teg

    功能很强大呀

    2022年8月19日 08:45顶 踩 回复
  7. Avatar for 哥斯拉 哥斯拉

    这种任务我就写个简单的shell脚本来监控了。
    就不搭建这东西占用资源了[偷笑]

    2022年8月17日 15:32顶 踩 回复
Powered by 连接微博

Login

Welcome! Login in to your account

Remember me Lost your password?

Don't have account. Register

Lost Password

Register