基于Node.js的Web爬虫: 使用Axios和Cheerio抓取网页数据
1. 环境准备
在开始之前,请确保计算机上已安装Node.js
mkdir webScraper
cd webScraper
npm init -y
npm install axios cheerio express
axios
: 用于发送HTTP请求。cheerio
: 用于解析和操作HTML。express
: 用于创建Web服务器。
2. 创建爬虫
在文件夹中创建一个新的文件 scraper.js
,并将以下代码粘贴到文件中:
scraper.js
const axios = require('axios'); // HTTP客户端库,用于发送请求
const cheerio = require('cheerio'); // HTML解析库,类似jQuery语法
const url = require('url'); // URL处理模块,用于解析相对路径// 导出数据抓取函数
module.exports = { scrapeData };/*** 网页数据抓取主函数* @param {string} baseUrl - 要抓取的目标网页URL* @returns {Promise<Array>} 抓取结果数组*/
async function scrapeData(baseUrl) {try {// 发送HTTP GET请求获取网页内容const { data } = await axios.get(baseUrl);// 加载HTML内容到cheerio实例const $ = cheerio.load(data);const results = [];// 遍历所有符合要求的<a>标签$('a.mm-pic-box').each((index, element) => {// 提取元素属性const relativeHref = $(element).attr('href');const imgElement = $(element).find('img');const pElement = $(element).find('p');// 构建结果对象results.push({title: $(element).attr('title') || '', // 链接标题属性href: url.resolve(baseUrl, relativeHref), // 转换为绝对路径的链接paragraph: pElement.first() // 第一个<p>标签内容.text() // 提取文本.replace(/[\t\n]/g, ''), // 清理空白字符image: imgElement.length ? { // 图片信息处理src: url.resolve(baseUrl, imgElement.attr('src')),} : null});});return results;} catch (error) {console.error(`Error fetching data: ${error}`);}
}// 模块测试代码
scrapeData('http://example/news/').then(data => {console.log(data);
});
在scraper.js中,使用了axios获取网页内容,用cheerio解析HTML,并导出了scrapeData函数。函数内部遍历特定类名的a标签,提取标题、链接、段落和图片信息。需要在这些关键部分添加注释,说明每个步骤的作用。
3.创建Express服务器
在文件夹中创建一个新文件 server.js,作为
一个简单的Express服务器来展示我们抓取的数据。
server.js
const express = require('express');
const { scrapeData } = require('./scraper');
const cors = require('cors'); // 跨域资源共享中间件// 创建Express应用实例
const app = express();
// 设置服务端口(环境变量优先,默认3000)
const PORT = process.env.PORT || 3000;// 配置CORS中间件
app.use(cors({origin: 'http://localhost:5173', // 允许访问的前端域名methods: ['GET'] // 允许的HTTP方法
}));// 在app.get('/scrape')路由前添加根路由// app.get('/', (req, res) => {// res.send('Scraper API is running');// });app.get('/scrape', async (req, res) => {// 从查询参数获取目标网址const baseUrl = req.query.baseUrl;// 参数校验if (!baseUrl) {return res.status(400).send('URL is required');}try {// 调用抓取函数并返回JSON结果const data = await scrapeData(baseUrl);res.json(data);} catch (error) {// 错误处理res.status(500).send('Server error');}
});// 启动HTTP服务
app.listen(PORT, '0.0.0.0', () => { // 监听所有网络接口console.log(`Server is running on http://localhost:${PORT}`);
});
对于server.js,使用Express搭建了服务器,配置了CORS,并定义了/scrape和根路由。需要注释说明中间件的作用、路由的功能以及监听的配置。
在server.js中,CORS配置、路由处理、错误响应和服务器启动部分需要注释。特别是根路由和/scrape路由的区别,以及监听的网络接口设置。
参考:基于Node.js的Web爬虫: 使用Axios和Cheerio抓取网页数据并展示_node axios cheerio-CSDN博客