当前位置：首页 > article >正文

AI导航工具我开源了利用node爬取了几百条数据

article 2025/1/28 1:13:54

序言

别因今天的懒惰，让明天的您后悔。输出文章的本意并不是为了得到赞美，而是为了让自己能够学会总结思考；当然，如果有幸能够给到你一点点灵感或者思考，那么我这篇文章的意义将无限放大。

背景

随着AI的发展市面上的AI网站或者软件也是越来越多了，但是我们知道的网站可能只有那么比较出名的那么几个，但是实际上好用的AI网站起码都得几百上千了（也有不少套壳的），我有时候需要用AI软件的时候都是百度各种找，实在是不太方便，然后我想反正自己也要用原来的服务器空置到的，何不废物利用呢？所以久有了这个网站的诞生吉云工具箱；代码库 dream-utools 有兴趣的朋友可以去看一下，我将数据都转为了js数据，可以直接部署你私有网站；当然如果你觉得有用就收藏哈。

在这里插入图片描述

代码库

我自己本身想自己去搭建这么一个网站，但是我觉得太麻烦了；还不如直接找一些开源的代码直接复制使用，我在GitHub上找了好几个开源库以后发现这个库比较符合我的需求，而且界面看起来也是比较简单好看的 gengyun-nav

数据来源

由于开源库的数据来源的通过接口返回的，所有没有现成的数据；所以就想到去爬取一些数据（本来是准备一个一个的去写的）；我查看了这类网站的一个特性都是返回的html；我就将爬取到的html数据保存到一个txt文件中。一下代码就是解析html中的数据。

以下的代码都是爬取数据的示例代码，如果你们在爬取数据的时候请根据自己的实际情况进行修改即可。

获取每一个分类


// 导航栏
async function menus() {
  const data = await fs.readFile("./index.txt");

  const html = data.toString();
  // 解析class=content的div
  const $ = cheerio.load(html);
  const content = $(".content").html();
  // 解析class=align-items-center的div=> 是class=content的div的子元素=>获取所有多个class=align-items-center的div
  const alignItemsCenter = $(".content")
    .find(".d-flex.flex-fill.flex-tab.align-items-center")
    .map((i, el) => {
      return $(el).html();
    })
    .get();
  // console.log(alignItemsCenter);
  let arr = [];
  // 循环获取所有多个class=align-items-center的div
  for (let i = 0; i < alignItemsCenter.length; i++) {
    const element = alignItemsCenter[i];
    // 获取navItem a标签的内容
    const a = $(element)
      .find(".nav-item")
      .find("a")
      .map((i, el) => {
        return $(el).html();
      })
      .get();

    arr.push({
      id: uuid(),
      name: "办公工具",
      pid: 0,
      ind: i,
      icon: "CashOutline",
      children: a.map((v) => {
        return {
          id: uuid(),
          name: v,
          icon: "CashOutline",
        };
      }),
    });
  }
  //   将arr写入json文件
  await fs.writeFile("./menus.json", JSON.stringify(arr, null, 2));
}

menus();

获取每个分类的内容（每一个AI网站）

// 工具类
async function index() {
  const data = await fs.readFile("./index.txt");

  const html = data.toString();
  // 解析class=content的div
  const $ = cheerio.load(html);
  const alignItemsCenter = $(".content-layout")
    .find(".tab-content .mt-4")
    .map((i, el) => {
      return $(el).html();
    })
    .get();

  let obj = {};

  //   console.log(99999, alignItemsCenter);
  const dataJson = await fs.readFile("./index.json");

  for (let i = 0; i < alignItemsCenter.length; i++) {
    const element = alignItemsCenter[i];
    // 获取navItem a标签的内容
    // const a = $(element).find(".url-body .default").find("a").map((i, el) => {
    //   return $(el).html();
    // })
    // .get();
    const itemsList = $(element)
      .map((i, el) => {
        return $(el).html();
      })
      .get();
    // console.log(99999999999, itemsList);

    let arr = [];

    for (const item of itemsList) {
      // item里面有两个a标签，第一个是图片，第二个是链接；获取第二个a标签的链接和title
      const a = $(item).find("a").eq(1);
      const href = a.attr("href"); // 获取a标签的href属性
      // 获取第一个a标签font-weight-normal的内容
      const text = $(item).find(".text-xs").text();
      const title = $(item).find(".font-weight-normal").text();
      const img = $(item).find("a").find("img").attr("data-src");
      // console.log(777, href, text, title);
      
      // 获取a标签的链接和title
      // const img = $(item).find("a").find("img").attr("data-src");
      // const text = $(item).find("a").find(".text-xs").text();
      // const title = $(item).find("a").find(".font-weight-normal").text();

      // 获取a标签的href属性
      // const a = $(item).find(".togo");
      // console.log(777, a);
      arr.push({
        id: uuid(),
        icon:img,
        name: title,
        description:text,
        href: href,
      });
    }

    obj[i] = arr;
  }

    // await fs.writeFile("./index.json", JSON.stringify(obj, null, 2));

  // console.log(99,alignItemsCenter);
}

// index();