利用axios库的爬虫程序如何使用HTTP

在 JavaScript 中,axios 是一个非常流行的 HTTP 客户端库,它可以用来发送各种 HTTP 请求(如 GET, POST 等),并处理响应。我们可以使用 axios 来编写一个简单的爬虫程序,该程序抓取网页内容并提取需要的信息。

1、安装 Axios

首先,你需要安装 axios。在 Node.js 项目中,你可以通过 npm 安装它:

npm install axios

2、编写爬虫程序

假设你要抓取某个网页上的图片,以下是一个简单的示例,演示如何使用 axios 发送 HTTP 请求并下载网页上的图片。

代码示例:

javascript 复制代码
const axios = require('axios');
const fs = require('fs');
const path = require('path');
const cheerio = require('cheerio');  // 使用 cheerio 解析 HTML 内容
​
// 下载图片的函数
async function downloadImage(imageUrl, filename) {
  const writer = fs.createWriteStream(filename);
  const response = await axios({
    url: imageUrl,
    method: 'GET',
    responseType: 'stream',  // 以流的方式处理响应
  });
  response.data.pipe(writer);  // 将响应流写入文件
  return new Promise((resolve, reject) => {
    writer.on('finish', resolve);  // 下载完成后解决 Promise
    writer.on('error', reject);  // 如果有错误则拒绝 Promise
  });
}
​
// 抓取网页并下载所有图片的函数
async function crawlAndDownloadImages(url) {
  try {
    // 1. 请求网页内容
    const response = await axios.get(url);
    const html = response.data;
​
    // 2. 使用 cheerio 解析网页内容
    const $ = cheerio.load(html);
    const imgTags = $('img');  // 获取所有 <img> 标签
​
    // 3. 提取每个 <img> 标签的 src 属性,作为图片的 URL
    const imageUrls = [];
    imgTags.each((index, img) => {
      const imgUrl = $(img).attr('src');
      if (imgUrl) {
        // 处理相对路径图片
        if (!imgUrl.startsWith('http')) {
          const parsedUrl = new URL(imgUrl, url);  // 将相对路径转换为绝对路径
          imageUrls.push(parsedUrl.href);
        } else {
          imageUrls.push(imgUrl);
        }
      }
    });
​
    // 4. 下载所有图片
    for (let i = 0; i < imageUrls.length; i++) {
      const imageUrl = imageUrls[i];
      const imageName = path.basename(imageUrl);  // 获取图片名称
      console.log(`下载图片: ${imageUrl}`);
      await downloadImage(imageUrl, path.join(__dirname, 'downloads', imageName));  // 保存图片到本地
      console.log(`图片下载完成: ${imageName}`);
    }
  } catch (error) {
    console.error('爬虫出错:', error);
  }
}
​
// 运行爬虫程序
const url = 'https://example.com';  // 替换为你想抓取的网页
crawlAndDownloadImages(url);

3、代码说明

  1. 安装依赖

    • axios:用于发送 HTTP 请求。
    • cheerio:用于解析 HTML 文档并提取 DOM 元素。
    • fs:用于文件操作(保存图片到本地)。
    • path:用于处理文件路径。
  2. downloadImage 函数 :此函数接收一个图片 URL 和文件名,使用 axios 发送 GET 请求并将返回的图片数据保存到本地。图片数据是以流的方式处理的,因此我们使用 .pipe() 方法将响应流写入到文件中。

  3. crawlAndDownloadImages 函数 :此函数抓取网页内容并解析出所有的 <img> 标签,然后提取其 src 属性(即图片 URL)。接着,它会下载每个图片。

  4. cheerio.loadcheerio 是一个非常轻量级的 jQuery 实现,可以用来解析 HTML 页面并操作 DOM 元素。我们使用 cheerio 提取所有 <img> 标签并获取其 src 属性。

  5. 图片 URL 处理 :对于相对路径的图片,我们使用 new URL(imgUrl, url) 将其转换为绝对路径。

  6. 图片下载 :使用 axios 发送 HTTP 请求并以流的形式下载图片,最后保存到本地。

  7. 运行爬虫 :调用 crawlAndDownloadImages(url) 启动爬虫,传入目标网页的 URL,程序将抓取网页上的所有图片并保存到 downloads 文件夹中。

4、执行程序

  1. 在项目目录中创建 index.js 文件,并将上述代码粘贴进去。

  2. 执行爬虫程序:

    node index.js

  3. 程序将下载网页中的所有图片并保存在当前目录下的 downloads 文件夹中。

5、总结

通过 axioscheerio,你可以轻松地编写一个爬虫程序来抓取网页并下载其中的图片。axios 负责发送 HTTP 请求,cheerio 用于解析 HTML 内容,提取需要的元素。这个爬虫程序能够处理相对路径的图片 URL,并将所有下载的图片保存在本地目录中。你可以根据需要扩展此程序,处理更多类型的资源或实现更复杂的爬取逻辑。

相关推荐
冴羽6 分钟前
SvelteKit 最新中文文档教程(1)—— 入门指南
前端·javascript·svelte
冬冬小圆帽26 分钟前
防抖和节流
开发语言·前端·javascript
lydxwj32 分钟前
vue3自定义hooks遇到的问题
前端·javascript·vue.js
野生的程序媛1 小时前
重生之我在学Vue--第8天 Vue 3 UI 框架(Element Plus)
前端·vue.js·ui
前端付杰2 小时前
从Vue源码解锁位运算符:提升代码效率的秘诀
前端·javascript·vue.js
然后就去远行吧2 小时前
小程序 wxml 语法 —— 37 setData() - 修改对象类型数据
android·前端·小程序
用户3203578360022 小时前
高薪运维必备Prometheus监控系统企业级实战(已完结)
前端
黄天才丶2 小时前
高级前端篇-脚手架开发
前端
乐闻x2 小时前
React 如何实现组件懒加载以及懒加载的底层机制
前端·react.js·性能优化·前端框架
小鱼冻干2 小时前
http模块
前端·node.js