利用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,并将所有下载的图片保存在本地目录中。你可以根据需要扩展此程序,处理更多类型的资源或实现更复杂的爬取逻辑。

相关推荐
BillKu1 小时前
Vue3中AbortController取消请求的用法详解
前端·javascript·vue.js
heroboyluck2 小时前
rust 全栈应用框架dioxus
前端·rust·dioxus
不思念一个荒废的名字2 小时前
【黑马JavaWeb+AI知识梳理】后端Web基础01 - Maven
java·前端·maven
hunteritself2 小时前
OpenAI 上新:轻量版 Deep Research、GPT-4o 升级、o3 限额翻倍、生图 API 发布!| AI Weekly 4.21-4.27
前端·人工智能·科技·深度学习·chatgpt
刺客-Andy3 小时前
React 第三十六节 Router 中 useParams 的具体使用及详细介绍
前端·react.js·前端框架
黄同学real3 小时前
Vue 项目中运行 `npm run dev` 时发生的过程
前端·vue.js·npm
黄同学real4 小时前
vue 优化策略,大白话版本
前端·javascript·vue.js
xcLeigh4 小时前
HTML5好看的水果蔬菜在线商城网站源码系列模板8
java·前端·html5
周胡杰4 小时前
鸿蒙文件上传-从前端到后端详解,对比jq请求和鸿蒙arkts请求区别,对比new FormData()和鸿蒙arktsrequest.uploadFile
前端·华为·harmonyos·鸿蒙·鸿蒙系统
2501_915373885 小时前
electron+vite+vue3 快速入门教程
前端·javascript·electron