Puppeter connects to the existing Chrome browser

Preface

Puppeteer It is a very popular headless browser and has received a lot recently star. The main function is to use and install Chromium Start a browser to simulate user operation , But this browser can be said to be one-time, unable to cache information , Many times we want to Puppeteer You can reuse locally launched browsers . After searching several articles, summarize the correct usage :

Use

1. In order to ensure a smooth link, we need to set Chrome The startup port of the browser

Right click the shortcut to set the content in the target : Add --remote-debugging-port=9222

2. Write program configuration puppeteer To configure

const axios  = require('axios');
const puppeteer=require('puppeteer');

(async()=>{
    let wsKey = await axios.get('http://localhost:9222/json/version');
    let browser=await puppeteer.connect({
        browserWSEndpoint: wsKey.data.webSocketDebuggerUrl,
        defaultViewport:null
    });
    let page=await browser.newPage()
    await page.goto('https://blogweb.cn');
    
    // await page.close()
    // await browser.disconnect()
})()

Copy

Explain

Use axios Get the corresponding link （http://localhost:9222/json/version） The communication configuration of is passed in puppeteer To configure （ The port number in the link needs to be and Chrome The port number in the target path corresponds to ）

The following is the basic configuration of creating page scrolling and page Jump

summary

1. modify Chrome Fixed port number
2. In the configuration browser Request the corresponding connection before configuration webSocket To configure
3. take webSocket Of key Put it into the corresponding configuration