Puppeteer设置Cookies避免重复登录

Mirroring the state of one of your existing Chrome Profiles in Puppeteer can prove extremely useful for local projects and testing.

Unless you’re interested in simulating an entire login process, utilising pre-existing settings - in this case, cookies - can significantly reduce your time spent replicating a state that exists elsewhere on your machine.

The following process requires NodeJS, NPM and Puppeteer. You’ll need to install all of those items in that order before going any further. Follow the instructions on their respective websites to get them installed on your system

The first issue is accessing the cookies. Cookies are encrypted for good reason: they contain sensitive information. On macOS, they’re ‘signed’ with a Chrome encryption key into an SQLite database which is managed by the OS keychain. In order to decrypt the signed cookies, your Node application must have access to the Chrome key inside the keychain. This requires authorisation by the logged in macOS user.

Thankfully, there is an NPM module chrome-cookies-secure that is setup to handle this process. Copy and run the following code in your terminal (in the root of your project directory) to add the chrome-cookies-secure module to your project:

npm i --save chrome-cookies-secure

If you’re not prompted to authorise Node access to your keychain on the module install, don’t worry. You will be prompted when you run the basic NodeJS app described a little further down.

Next you’ll need to identify the path to the Chrome Profile you want to mirror (you may have multiple you’d like to choose from).

Open Chrome and make sure you’re browsing with the profile you want to retrieve the cookies for, and navigate to chrome://version. You’ll find the Profile of the current browser session under Profile Path.

You can view all of your Chrome Profile directories at Users/yourName/Library/Application Support/Google/Chrome.

This is often written as ~/Library/Application Support/Google/Chrome where ~ refers to the user’s root directory (In Finder Macintosh HD > Users > userName = ~).

Now you have the basic information you need to retrieve your cookies within your Node app! Below is a simple code snippet to demonstrate the functionality. Let’s take a look at our https://www.google.com cookies.

In a file of your choosing inside your project folder (I’ve called mine server.js) paste in the following code:

const chrome = require('chrome-cookies-secure');

const url = 'https://www.google.com';

chrome.getCookies(url, 'puppeteer', function(err, cookies) {
    if (err) {
        console.log(err, 'error');
        return
    }
    // do stuff here...
    console.log(cookies, 'cookies');
}, 'yourProfile') // e.g. 'Profile 2'

The module does not yet fully support Promises or async/await, but we’re looking to add support. You can help us add it in at https://github.com/bertrandom/chrome-cookies-secureUpdate! March 2020 - there is a PR for a Promise wrapper awaiting approval - https://github.com/bertrandom/chrome-cookies-secure/pull/21

Next, ensuring you’re in the project root directory in your terminal, run node yourfilename.js. You should see the cookies for the given profile and url you have chosen appear right there in the terminal, e.g:

In this example, we are looking at Google’s cookies. In the next section you will want to change this to a website where you are currently logged in

Now you can see your cookies in NodeJS, you can load them into Puppeteer!

Update your code to the following and run node yourfilename.js.

const chrome = require('chrome-cookies-secure');
const puppeteer = require('puppeteer');

const url = 'https://www.yoururl.com';

const getCookies = (callback) => {
    chrome.getCookies(url, 'puppeteer', function(err, cookies) {
        if (err) {
            console.log(err, 'error');
            return
        }
        console.log(cookies, 'cookies');
        callback(cookies);
    }, 'yourProfile') // e.g. 'Profile 2'
}

getCookies(async (cookies) => {
    const browser = await puppeteer.launch({
        headless: false
    });
    const page = await browser.newPage();

    await page.setCookie(...cookies);
    await page.goto(url);
    await page.waitFor(1000);
    browser.close()
});

You’ll see Puppeteer open and navigate to your chosen site, and hopefully, providing there are no further security measures such as 2FA, you’ll see that you are logged in!

It’s worth noting there can be a thirty minute delay between new cookies in your Chrome Profile being reflected on your hard-drive (thus being accessible in your Node app). This is because Chrome persists cookies to storage once every thirty minutes. So if you have new cookies, give it 30 minutes and check it again.

You’ll also need to fully qualify URLs in order to retrieve all possible cookies for a given site i.e https://www.google.com not https://google.com.

But that’s it!

You should now be able to do what you want to do with Puppeteer, utilising a login state, preferences, or whatever else, from one of your Chrome Profiles!