Help us understand the problem. What is going on with this article?

puppeteer-coreとMacにインストール済みのChromeを使って自動操作

いわゆる「ぐぐれかす」をPuppeteerで作って練習したときのメモ

ggrks.gif

インストール済みのChrome for Macを使うには?

puppeteer標準でChromiumブラウザがくっついてくるが、Chromiumダウンロードめっちゃ時間がかかるので、とりあえず手元にChromeをインストール済みなら、それを使って自動操作をしたい。

puppeteer-core を使って、手持ちのChromeのゲストセッションを開くには?と調べたら、issueで質問 してる人がいて、「公式Docに書いてるでしょ」って書いてたw

Macだったら

const launchChrome = puppeteer.launch({
    // MacにインストールされているChromeを使う。
    executablePath: '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome',
});

これでよさそう。

ゲストセッションを開くには?

デフォルトでゲストセッションが開く?よくわからないけど、なんとなく

const launchChrome = puppeteer.launch({
    // MacにインストールされているChromeを使う。
    executablePath: '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome',

    args: [
        // ゲストセッションで操作する。
        "--guest",
    ],
});

こんな感じで指定しておくとよさそう?

普段ブラウザを使うように、ウインドウを開くには?

これは、launchオプションと、pageのsetViewportの両方の指定が必要。

const launchChrome = puppeteer.launch({
    // MacにインストールされているChromeを使う。
    executablePath: '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome',

    // ブラウザ画面を表示しながら(ヘッドレスモードを無効にする)。
    headless: false,

    args: [
        // ゲストセッションで操作する。
        "--guest",

        // ウインドウサイズをデフォルトより大きめに。
        '--window-size=1280,800',
    ],
});

launchChrome.then(async (browser) => {
    // 大抵のサンプルコードはここで単純に browser.newPage() しているだけのものが多いが、
    // ブラウザを開いたときにすでに1つタブが開いている場合には、2つ目のタブが開いてしまう。
    // それを防ぐため、すでにタブが開いている場合にはそれを使うようにする。
    const page = (await browser.pages())[0] || (await browser.newPage());

    await page.setViewport({ width: 1280, height: 800 });

})

デフォルトだと、ウインドウサイズが少し小さい。なので、1280x800に指定している。

あと、多くのサンプルコードでは無造作に browser.newPage() しているが、自分の場合にはなぜかタブが2つ開いてしまったので、すでにタブが開いていたらそれを使うようなロジックにしてみた。

キーボードの打鍵速度を人間味のあるスピードにするには?

全体的にゆっくりめに操作をしたい場合

puppeteer.launch()slowMo オプションを指定すれば良い。
体感的には、50〜100くらいを指定するのがよさそう。

一部の操作だけゆっくりめに操作したい場合

page.clickpage.type などのメソッドには delay オプションがある。

たとえば、先の「ぐぐれかす」で、検索キーワード入力部分に delay: 200 (5キー/sec)を指定すると

await page.type("input[name='q']", searchKeyword, { delay: 200 });

こんなかんじで、ゆっくりキーワードが入力される。

ggrks.gif

まとめ

基本的な操作方法はぐぐればでてくるし、 api.md みればAPI仕様もシンプルにわかる。
なんだけど、puppeteerはChromiumブラウザのダウンロードが遅い!!ので、puppeteer-coreと手持ちのChromeを使ってサクッと自動操作する方法をまとめてみました。

ソースコードは↓にまとめてあります。
https://github.com/YusukeIwaki/ggrks-puppeteer

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした