nodejs爬虫实践 - 代码安装检测小工具

最新推荐文章于 2022-10-04 23:41:01 发布

Wenzzzzz

最新推荐文章于 2022-10-04 23:41:01 发布

阅读量221

点赞数

分类专栏：项目实践文章标签： nodejs 爬虫 html解析

本文链接：https://blog.csdn.net/weixin_44532376/article/details/88603891

版权

项目实践专栏收录该内容

1 篇文章 0 订阅

订阅专栏

项目背景

在互联网广告业务中，追踪转化和数据统计是流量变现不可缺少的一环。一个成熟的广告投放平台，应该有一套完善的数据追踪和推广监测功能。为了追踪到那些页面上的数据转化，就需要在被投放的页面中添加一些代码，以追踪上报那些页面上的点击、表单提交、跳转等操作。如何指导广告主正确地安装我们的代码，激活对应的各类事件的上报统计，也引入了不少的沟通成本。在初期试运行阶段，许多广告主因为填错了转化ID或者因为代码的拼写错误，导致无法实现预期的转化上报，并且需要运营和技术支持甚至技术的介入，才能查明这些简单的安装错误。在多方的呼吁下，代码安装自动化检测工具就这样出炉了。

系统设计

代码安装自动化的检测工具需要做的是，根据用户提供内容，返回判定结果。为了能够简化用户操作，我做的这版小工具只需要用户提供页面的URL。所填的URL应是外网可以访问的，也就是可以爬取到页面的内容。而爬取和分析页面，交给node中间层去处理，无需后台的参与。之后node端将检测结果返回，并在前台渲染。其中需要注意的是，有可能广告主提供的页面的html中，并不存在转化代码，需要逐层爬取所引用的js文件, 才可能找到对应的转化事件。

用户输入页面地址URL，前台将用户的配置信息（转化跟踪id, 所选择的上报事件等）以及URL，放在一个请求里，发送给nodejs。nodejs收到URL之后爬取页面，判断转化代码是否存在，转化ID是否正确，代码位置，以及所有转化事件是否安装完全。如果首层爬取的页面并没有通过验证，则爬取引用页面的内容。因为广告主所投放的落地页相对比较简单，此处的设计是只爬取到二级页面。并且需要注意的是，因为我们将上报的自主权赋予了广告主，所以此检测工具只在字面层上检测代码是否安装完整，不具备代码运行逻辑的判断。比如，如果广告主讲代码填写在了 if (false) {转化代码} 这样的位置，我们的检测也会通过。

在这里插入图片描述

代码实现

首先，需要先判别所填入链接的协议类型，然后采用对应的协议方法，来爬取整个HTML document的内容。如果能够成功读取整个页面的内容，就可以把获取到的HTML DOCUMENT。随后，HTML DOCUMENT会传入installedCheckingProcess函数中做进一步的解析判断。

import httpCheck from 'http';
import httpsCheck from 'https';
import cheerio from 'cheerio';
import URL from 'url';

const options = URL.parse(URLforChecking);
  options.rejectUnauthorized = false;

  const webCrawling = () => (
    new Promise((resolve, reject) => {
      const reqWebCraw = protocol.get(options, (res) => {
        let html = '';
        res.on('data', (data) => {
          html += data;
        });
        res.on('end', () => {
          const result = installedCheckingProcess(html);
          resolve(result);
        });
        res.on('error', (err) => {
          reject(dispatchError(err));
        });
      });

      reqWebCraw.on('error', (err) => {
        // 错误处理，处理res无法处理到的错误
        reject(dispatchError(err));
      });
    })
  );

  const ret = await webCrawling();

为实现node端爬虫解析，我采用了一个现有的比较好用的轮子cheerio，在此推荐给大家。相关网址请参见：https://github.com/cheeriojs/cheerio 。它能够解析HTML，以DOM模型为基础，类似于jquery。只需要传入HTML document, 就可以利用类似jquery的选择器，匹配到需要的内容。

const installedCheckingProcess = async (html) => {
    const $ = cheerio.load(html, { xmlMode: true });
   // 拿到<head>标签中倒数第二个script
    const scriptLength = $('head').find('script').length;
	const basicCodeReg = new RegExp('我们想检测的代码');
    // 检测基础代码是否安装于<head>中所有script的末尾
    const basicCodeInstall = basicCodeReg.test($('head').find('script')
      .eq(scriptLength - 1)
      .html());

技术难点

本工具的一个小坑在于，如果转化代码放在了js引用文件中，就需要逐层爬取内容。但是HTML引用文件的方式有很多种，有时会为相对地址，这就需要对HTML document中的相对地址进行判断并补全。此处写了一个小函数供大家参考。

// 为node爬虫补全地址
// 输入页面内的引用地址，判断是否为相对地址，如果是则补全，最终返回absoluteUrl
export function generateAbsoluteUrl(itemUrl, urlProtocol, domain, filePath) {
  let targetUrl = '';
  if (itemUrl.indexOf('//') === 0) {
    // 不带协议的URL要补全
    targetUrl = urlProtocol.concat(itemUrl);
  } else if (itemUrl.indexOf('/') === 0) {
    // 相对URL要补全
    targetUrl = urlProtocol.concat('//').concat(domain).concat(itemUrl);
  } else if ((itemUrl.indexOf('http') === 0)) {
    targetUrl = itemUrl;
  } else {
    targetUrl = urlProtocol.concat('//').concat(path.join(filePath, itemUrl));
  }
  return targetUrl;
}

小结

目前我所做的这一版检测工具不仅可以对用户的代码做出判断，并且可以提供一些具体的提示。对于基础代码，我们先会全局在html内搜索对应的正则匹配，如果代码拼写正确，那么会接着判断这段代码内的转化ID是否正确，之后再判断代码及ID的位置。如果代码拼写正确，但ID不对，则会给出转化ID是错误的红色提示，细化指出广告主的安装问题。对于转化代码，会依次检查转化事件对应的代码，并返回未安装正确的转化事件的提示。例如：假设用户建立了转化类型为电话拨打，表单提交，加入购物车的转化跟踪，但只安装了“加入购物车”对应的代码，则错误提示会指出未正确安装的事件。

Wenzzzzz

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
2
评论
nodejs爬虫实践 - 代码安装检测小工具

项目背景在互联网广告业务中，追踪转化和数据统计是流量变现不可缺少的一环。一个成熟的广告投放平台，应该有一套完善的数据追踪和推广监测功能。为了追踪到那些页面上的数据转化，就需要在被投放的页面中添加一些代码，以追踪上报那些页面上的点击、表单提交、跳转等操作。如何指导广告主正确地安装我们的代码，激活对应的各类事件的上报统计，也引入了不少的沟通成本。在初期试运行阶段，许多广告主因为填错了转化ID或者因为...
复制链接

扫一扫