這篇文章主要介紹如何使用puppeteer爬取網(wǎng)站并抓出404無(wú)效鏈接，文中介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！

創(chuàng)新互聯(lián)建站服務(wù)項(xiàng)目包括管城網(wǎng)站建設(shè)、管城網(wǎng)站制作、管城網(wǎng)頁(yè)制作以及管城網(wǎng)絡(luò)營(yíng)銷策劃等。多年來(lái)，我們專注于互聯(lián)網(wǎng)行業(yè)，利用自身積累的技術(shù)優(yōu)勢(shì)、行業(yè)經(jīng)驗(yàn)、深度合作伙伴關(guān)系等，向廣大中小型企業(yè)、政府機(jī)構(gòu)等提供互聯(lián)網(wǎng)行業(yè)的解決方案，管城網(wǎng)站推廣取得了明顯的社會(huì)效益與經(jīng)濟(jì)效益。目前，我們服務(wù)的客戶以成都為中心已經(jīng)輻射到管城省份的部分城市，未來(lái)相信會(huì)繼續(xù)擴(kuò)大服務(wù)區(qū)域并繼續(xù)獲得客戶的支持與信任！

檢查網(wǎng)頁(yè)無(wú)效鏈接

前言

自動(dòng)化技術(shù)可以幫助我們做自動(dòng)化測(cè)試，同樣也可以幫助我們完成別的事情，比如今天我們要做的檢查網(wǎng)站404無(wú)效鏈接。

原理

實(shí)現(xiàn)這樣的功能，大致分為以下步驟： 1.打開官網(wǎng)首頁(yè)，獲取頁(yè)面上所有的鏈接。 2.添加規(guī)則對(duì)這些鏈接過(guò)濾，把外鏈去掉。 3.遍歷訪問(wèn)這些鏈接，打開打開其中的每一個(gè)鏈接，檢查是否為404，如果是距離下來(lái)。 4.重復(fù)執(zhí)行1，2，3。直到把整個(gè)網(wǎng)站所有的鏈接都遍歷完。

準(zhǔn)備

CukeTest一款可以專業(yè)的編輯自動(dòng)化腳本的工具。cuketest.com/

puppeteer一個(gè)非常流行自動(dòng)化庫(kù)。https://github.com/GoogleChrome/puppeteer

實(shí)現(xiàn)

CukeTest中新建一個(gè)項(xiàng)目。

刪掉features目錄。新建一個(gè)demo.js文件。

安裝puppeteer

npm install puppeteer --save

主要方法講解

pupputeer內(nèi)置監(jiān)聽事件，可以很快拿到每個(gè)請(qǐng)求的響應(yīng)結(jié)果。

puppeteer可以創(chuàng)建Chromium實(shí)例。創(chuàng)建方式如下：

let puppeteer = require('puppeteer'); 
browser = await puppeteer.launch({ headless: true });
page = await browser.newPage();
await browser.close();

puppeteer 提供事件監(jiān)聽，可以監(jiān)聽到每個(gè)頁(yè)面的響應(yīng)狀態(tài)，為每個(gè)請(qǐng)求添加響應(yīng)事件，如果響應(yīng)狀態(tài)碼為404，記錄到文件中。

page.on('response',(res)=>{
 // console.log("res.url", res.url(), res.status())
 let url = res.url();
 if(res.status()==404){
  linktoFile(url, brokenlinkFile);
 }else{
  if(isvaildUrl(url)){
   linktoFile(url,validUrlFilePath);
  }
  
 } 
})

puppeteer抓取頁(yè)面上所有的鏈接

await page.goto(url);
//獲取所有的link
const hrefs = await page.evaluate(
 () => Array.from(document.body.querySelectorAll('a[href]'), ({ href }) => href)
);

將鏈接記錄到文件或者從文件讀取鏈接的方法

let filetoLinks = function (filepath) {
 if (!fs.existsSync(filepath)) {
  fs.writeFileSync(filepath);
 }
 let data = fs.readFileSync(filepath, 'utf-8')
 let links = data.trim().split('\n');
 return links;
}

let linktoFile = function (link, filepath) {
 let foundLinks = filetoLinks(filepath);
 if (!foundLinks.includes(link)) {
  fs.appendFileSync(filepath, link + '\n');
 }
}

最終代碼

let puppeteer = require('puppeteer');
const fs = require('fs');
const path = require('path');


const host = 'http://www.xxxx.cn/'; // 被測(cè)網(wǎng)站
const visitedFile = 'visitedUrl.txt'; //瀏覽過(guò)的頁(yè)面
const visitedFilePath = path.join(__dirname, visitedFile);
const brokenlinkFile = 'brokenLink.txt'; //404鏈接
const brokenlinkFilePath = path.join(__dirname, brokenlinkFile);

const validUrlFile = 'validUrlFile.txt'; //可用的鏈接
const validUrlFilePath = path.join(__dirname,validUrlFile);

let browser;
let page;

function isvaildUrl(url){
 return url.startsWith(host) && !url.includes('/#');
}

async function run() {
 browser = await puppeteer.launch({ headless: true });

 page = await browser.newPage();
 page.on('response',(res)=>{
  // console.log("res.url", res.url(), res.status())
  let url = res.url();
  let currenturl = page.url()
  if(res.status()==404){
   linktoFile(currenturl+"=="+url, brokenlinkFilePath);
  }else{
   if(isvaildUrl(url)){
    linktoFile(url,validUrlFilePath);
   }
   
  } 
 })

 await visitPage(browser,page, host);

 await browser.close();

}

async function visitPage(browser,page, url) {
 // if (!isvaildUrl(url)) return;
 await page.goto(url);
 //獲取所有的link
 const hrefs = await page.evaluate(
  () => Array.from(document.body.querySelectorAll('a[href]'), ({ href }) => href)
 );

 for (const href of hrefs) {
  //數(shù)據(jù)清洗
  if (isvaildUrl(href) && href !== host) {
   
   //符合條件的link
   // linktoFile(href, visitedFilePath);
   let res = await page.goto(href);
   
   if (res && res.status() == 404) {
    linktoFile(href, brokenlinkFilePath);
   } else {
    let visitedlinks = filetoLinks(visitedFilePath);
    if(!visitedlinks.includes(href)){
     linktoFile(href, visitedFilePath);
     await visitPage(browser,page,href);
     
    }
    
   }

   let links = filetoLinks(visitedFilePath);
   if (!links.includes(href)) {
    await visitPage(browser,page, href);
   }
  }
 }
}

let filetoLinks = function (filepath) {
 if (!fs.existsSync(filepath)) {
  fs.writeFileSync(filepath);
 }
 let data = fs.readFileSync(filepath, 'utf-8')
 let links = data.trim().split('\n');
 return links;
}

let linktoFile = function (link, filepath) {
 let foundLinks = filetoLinks(filepath);
 if (!foundLinks.includes(link)) {
  fs.appendFileSync(filepath, link + '\n');
 }
}

run();

運(yùn)行

點(diǎn)擊 【運(yùn)行】按鈕即可運(yùn)行。 同樣，在CukeTest中也支持命令行執(zhí)行，執(zhí)行命令為

cuke --runjs demo.js

以上是“如何使用puppeteer爬取網(wǎng)站并抓出404無(wú)效鏈接”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對(duì)大家有幫助，更多相關(guān)知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！