使用Puppeteer轻松爬取网易云音乐、QQ音乐的精品歌单

使用Puppeteer轻松爬取网易云音乐、QQ音乐的精品歌单

技术杂谈小彩虹2021-06-23 20:05:59100A+A-

背景

最近在学习Puppeteer进行自动化操作,另一方面为了防止上班时间被打扰,是时候爬点歌单在上班的时候,用来抵抗外界的干扰了。

地址

项目完整代码地址:github.com/BingKui/WeC…

工具

  • NodeJS:基本环境 版本 >= v10.*.*
  • Puppeteer:Google官方出品的无头Chrome node库
  • MongoDB:用来存储爬取到的数据
  • mongoose:node 中链接、操作 MongoDB 的驱动库
  • dayjs:时间处理库
  • node-schedule:node 定时任务库,线上部署用到,本地本地没有用到
  • pm2:node 进程管理工具,线上部署使用

目标

  • 爬取网易云音乐播放量超过 1000W 的歌单
  • 爬取 QQ 音乐播放量超过 1000W 的歌单
  • 把爬取的歌单保存到数据库
  • 创建定时任务,线上部署,每天定时爬取、保存

准备工作

  • 保证本地安装了 MongoDB 数据库,并能正常连接,具体请自行百度。
  • 安装所需的库文件
  • 编写数据库连接文件

安装库文件注意

由于 Puppeteer 会下载一个 Chrome 浏览器到本地,所以可能较慢,可以使用 cnpm 或者切换为 淘宝镜像。

数据库连接文件

const mongoose = require('mongoose');
// 数据库地址
const mongoDB = 'mongodb://127.0.0.1:27017/wechat';

// 链接数据库
mongoose.connect(mongoDB);

// 监听数据库事件
const db = mongoose.connection;

// 连接异常
db.on('error', function (err) {
    console.log('Mongoose connection error: ' + err);
});

// 连接断开
db.on('disconnected', function () {
    console.log('Mongoose connection disconnected');
});

// 连接成功
db.on('connected', function () {
    console.log('Mongoose connection open to ' + mongoDB);
});

爬取网易云音乐歌单

创建浏览器对象

首先我们创建一个无头的浏览器对象。

const browser = await puppeteer.launch({timeout: 300000, headless: true, args: ['--no-sandbox']});

具体参数含义请点解这里查看

说明:args 参数为可选项,以上参数是为了兼容 CentOS ,添加的参数

打开页面

打开地址:https://music.163.com/#/discover/playlist

let url = 'https://music.163.com/#/discover/playlist';
// 创建
const page = await browser.newPage();
// 跳转到歌单页面
await page.goto(url);

分析页面结构

网易云音乐

网易云音乐的歌单页使用了 iframe 嵌套的方式,所以我们要在页面中获取到 iframe 中的内容,并提取我们需要的信息。

// 获取歌单的iframe
let iframe = await page.frames().find(f => f.name() === 'contentFrame');

获取歌单数据的元素并处理

Puppeteer 提供了可以在 iframe 中执行js的方法,我们可以直接执行,通过原生js来获取想要的数据。

// 获取歌单
const result = await iframe.evaluate(() => {
    // 获取所有元素
    const elements = document.querySelectorAll('#m-pl-container > li');
    // 创建数组,存放获取的数据
    let res = [];
    for (let ele of elements) {
        let image = ele.querySelector('.j-flag').getAttribute('src');
        let name = ele.querySelector('.tit').innerText;
        let count = ele.querySelector('.nb').innerText;
        let author = ele.querySelector('.nm').innerText;
        let address = 'https://music.163.com/#' + ele.querySelector('.msk').getAttribute('href');
        const flag = (count.indexOf('万') > -1) && (parseInt(count.split('万')[0]) > 1000);
        if (flag) {
            res.push({
                image,
                name,
                count,
                author,
                address,
                from: 'netease',
            });
        }
    }
    // 返回数据
    return res;
});

循环爬取所有热门歌单

通过分析页面可以看到,歌单一共 35 页,并且每页有 35 条数据,并且分页是通过 url 参数区分的,所以我们可以简单暴力一点,写个循环搞定(主要还是懒)。

高级操作:可以通过 Puppeteer 的方法,获取页面,然后点击下一页,判断是否能够点击下一页来确定是否存在下一页。需要了解的可以自行研究。

为了方便操作,我们把获取每页数据封装成一个方法:getOnePageData

const getOnePageData = async (page, pageNumber) => {
    const url = `https://y.qq.com/portal/playlist.html#t3=${pageNumber}&`;
    // 跳转到页面
    await page.goto(url);
    await page.setViewport({ 
        width: 1300, 
        height: 5227,
    });
    // 等待两秒,加载图片
    await page.waitFor(2000);
    // 获取歌单
    const result = await page.evaluate(() => {
        // 此处与上方方法一样,省略
        ...
    });
    return result;
}

然后循环获取数据。

// 定于数组存储数据
let musicPlayList = [];
const page = await browser.newPage();
for (let i = 0; i < 1191; i += 35) {
    const item = await getOnePageData(page, i);
    console.log(`获取到数据${item.length}条。`);
    musicPlayList = musicPlayList.concat(item);
}

保存数据到 MongoDB 数据库

定义数据模型。

// models/music.js
const mongoose = require('mongoose');
const Schema = mongoose.Schema;

const MusicSchema = new Schema({
    image: String,
    name: String,
    count: String,
    author: String,
    address: String,
    from: String,
    date: Date,
    show: Boolean, // 是否展示
});

const MusicModel = mongoose.model('playlist', MusicSchema);

module.exports = MusicModel;

封装基本的添加方法。

// server/music.js
const MusicModel = require('../models/music.js');

const save = (item) => {
    findBuName(item.name, (obj) => {
        if (obj) {
            console.log('已经保存,数据');
            obj.remove();
        }
        const saveObject = new MusicModel(item);
        saveObject.save((err) => {
            if (err) return handleError(err);
        });
    });
}

const findBuName = (name, callback) => {
    MusicModel.findOne({name}, (err, item) => {
        if (err) {
            callback && callback(false);
        }
        callback && callback(item);
    });
};

module.exports = {
    save,
};

由于爬取的数据存在重复的数据,为了减少不必要的资源浪费,保存前先进行数据的去重。

// 保存之前去重
let hash = {};
musicPlayList = musicPlayList.reduce((item, next) => {
    hash[next.address] ? '' : hash[next.address] = true && item.push(next);
    return item
}, []);

保存数据到 MongoDB 数据库。

const MusicServer = require('../server/music.js');

// 保存数据
for (let i = 0; i < musicPlayList.length; i++) {
    const item = musicPlayList[i];
    item.date = dayjs().format('YYYY-MM-DD HH:mm:ss');
    item.show = true;
    MusicServer.save(item);
}

最后关闭浏览器

最后别忘了关闭开始的时候创建的浏览器。

browser.close();

到这里,爬取网易云音乐的精品歌单已经完成了。接下来开始爬取 QQ 音乐。

爬取 QQ 音乐精品歌单

由于爬取方式基本一样,下面只介绍不同的地方。

分析页面结构

QQ音乐

分析页面,QQ 音乐,没有采用和网易云音乐一样的 iframe 方式,这样爬取更加简单。

获取歌单数据的元素并处理

可以通过在页面上执行方法就能够爬取到我们需要的数据。

// 获取歌单
const result = await page.evaluate(() => {
    const elements = document.querySelectorAll('#playlist_box > li');
    let res = [];
    for (let ele of elements) {
        const _n = ele.querySelector('.js_playlist');
        let image = 'https:' + ele.querySelector('.playlist__pic').getAttribute('src');
        let name = _n.getAttribute('title');
        let count = ele.querySelector('.playlist__other').innerText.split(':')[1].replace(/\s+/g, '');
        let author = ele.querySelector('.playlist__author').innerText.replace(/\s+/g, '');
        let address = `https://y.qq.com/n/yqq/playsquare/${_n.getAttribute('data-disstid')}.html#stat=${_n.getAttribute('data-stat')}`;
        const flag = (count.indexOf('万') > -1) && (parseInt(count.split('万')[0]) > 1000);
        if (flag) {
            res.push({
                image,
                name,
                count,
                author,
                address,
                from: 'qq'
            });
        }
    }
    return res;
});

循环爬取数据

由于 QQ 音乐采取的分页方式和网易云音乐一样,所有我们还使用相同的方法,暴力爬取(可见我是有多懒~~)。

找到页面中一共有多少页歌单,然后写个像下面的循环。

// 定于数组存储数据
let musicPlayList = [];
const page = await browser.newPage();
// 爬取是总歌单也为 120 页
for (let i = 1; i < 120; i++) {
    const item = await getOnePageData(page, i);
    console.log(`获取到数据${item.length}条。`);
    musicPlayList = musicPlayList.concat(item);
}

然后像上边一样,保存进数据库就可以了。

定时任务

由于每天歌单都会有大量的播放量,不断的更新,因此写个定时任务,每天定时爬取更新数据才是稳妥的方法,能够保证我们的数据最新。

封装爬取方法

把爬取方法封装成模块方法,然后在固定的时候调用执行爬虫。

// qq.js
const QQMusic = async () => {
    const browser = await puppeteer.launch({timeout: 300000, headless: true, args: ['--no-sandbox']});
    // 定于数组存储数据
    let musicPlayList = [];
    const page = await browser.newPage();
    for (let i = 1; i < 120; i++) {
        const item = await getOnePageData(page, i);
        console.log(`获取到数据${item.length}条。`);
        musicPlayList = musicPlayList.concat(item);
    }
    // 保存之前去重
    let hash = {};
    musicPlayList = musicPlayList.reduce((item, next) => {
        hash[next.address] ? '' : hash[next.address] = true && item.push(next);
        return item
    }, []);
    
    MusicServer.updateAllHide(() => {
        // 保存数据
        for (let i = 0; i < musicPlayList.length; i++) {
           const item = musicPlayList[i];
           item.date = dayjs().format('YYYY-MM-DD HH:mm:ss');
           item.show = true;
           MusicServer.save(item);
       }
    }, { from: 'qq' });

    await browser.close();
};
module.exports = QQMusic;

// netease.js
const NeteaseMusic = async () => {
    const browser = await puppeteer.launch({timeout: 300000, headless: true, args: ['--no-sandbox']});
    // 定于数组存储数据
    let musicPlayList = [];
    const page = await browser.newPage();
    for (let i = 0; i < 1191; i += 35) {
        const item = await getOnePageData(page, i);
        console.log(`获取到数据${item.length}条。`);
        musicPlayList = musicPlayList.concat(item);
    }

    // 保存之前去重
    let hash = {};
    musicPlayList = musicPlayList.reduce((item, next) => {
        hash[next.address] ? '' : hash[next.address] = true && item.push(next);
        return item
    }, []);

    MusicServer.updateAllHide(() => {
        // 保存数据
        for (let i = 0; i < musicPlayList.length; i++) {
           const item = musicPlayList[i];
           item.date = dayjs().format('YYYY-MM-DD HH:mm:ss');
           item.show = true;
           MusicServer.save(item);
       }
    }, { from: 'netease' });

    await browser.close();
};
module.exports = NeteaseMusic;

编写定时器

应用 node-schedule 模块,我们能够简单的创建定时任务。

// 创建爬取歌单定时任务
const qqPlayList = () => {
    TimeSchedule.scheduleJob('0 5 0 * * *', async () => {
        await QQMusic();
    });
}

const neteasePlayList = () => {
    TimeSchedule.scheduleJob('0 50 0 * * *', async () => {
        await NeteaseMusic();
    });
}

const scheduleList = () => {
    qqPlayList();
    neteasePlayList();
};

scheduleList();

注意两个爬虫之间的时间间隔,尽量大一些,方式同时两个爬虫都运行,造成服务器的过大压力(土豪机,请随意~~~)。

线上部署

使用 pm2 我们可以方便的管理我们的 NodeJS 服务。

安装 pm2

npm install -g pm2

使用 pm2 启动我们的服务。

pm2 start index.js

更多相关内容请查阅这里

预告

接下来就是使用爬到的数据生成图片了,先来两张,看看效果。敬请期待!!!

QQ歌单
网易云音乐歌单

2018-08-03补充:

图片生成项目已经完成,可以查看:拿着爬虫数据,搞事情啊!!

点击这里复制本文地址 以上内容由权冠洲的博客整理呈现,请务必在转载分享时注明本文地址!如对内容有疑问,请联系我们,谢谢!

支持Ctrl+Enter提交

联系我们| 本站介绍| 留言建议 | 交换友链 | 域名展示
本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除

权冠洲的博客 © All Rights Reserved.  Copyright quanguanzhou.top All Rights Reserved
苏公网安备 32030302000848号   苏ICP备20033101号-1

联系我们