WebSocket経由でPuppeteerを使う

PuppeteerでSeleniumと同じことをしたかった。

server.js

const puppeteer = require('puppeteer');
const WS = require('ws');
const PORT = 8000;
const OPTIONS = {headless: false};
const timeout = 5000;

(async () => {
	const browser = await puppeteer.launch(OPTIONS);
	const page = await browser.newPage();
	page.setDefaultTimeout(timeout);

	function action(data) {
		const doc = JSON.parse(data);
		return new Promise((resolve, reject) => {
			console.log(`func: ${doc.func}\nargs: ${doc.args}`);
			return page[doc.func](...doc.args);
		});
	}

	function connect() {
		return new Promise((resolve, reject) => {
			const server = new WS.Server({port: PORT});
			server.on('connection', (socket) => {
				console.log('Client connected');

				socket.on('close', () => {
					console.log('Client disconnected');
				});

				socket.on('message', (data) => {
					server.clients.forEach((client) => {
						if ( client === socket && client.readyState === WS.OPEN ) {
							try {
								const r = action(data);
							}
							catch (e) {
								console.error(e);
							}
						}
					});
				});
			});
		});
	}

	await connect();

    await browser.close();

})().catch(e => {
	console.error(e);
	process.exit(1);
});

client.js

const WS = require('ws');
const PORT = 8000
const rl = require('readline');

const socket = new WS(`ws://localhost:${PORT}`);

socket.onopen = () => {
	console.log('Connected to server');
	const io = rl.createInterface({
		input: process.stdin,
		output: process.stdout,
	});
	io.on('line', (input) => {
		socket.send(input);
	});
};

socket.onclose = () => {
	console.log('Connection closed');
};

検証

  1. コンソールを開いてnode server.jsを実行する
  2. 別のコンソールを開いてnode client.jsを実行する
  3. client.jsを実行しているコンソールで1行ずつ入力する:
    {"func": "goto", "args":["//i-o.io/"]}
    {"func": "click", "args": ["::-p-aria(なんか書いてます。)"]}
    {"func": "click", "args": ["::-p-aria(クロハ882-1 ソニック1号 グリーン室)"]}
    {"func": "goBack", "args": []}
    {"func": "click", "args": ["::-p-xpath(//*[@id=\"photo\"]/ul[1]/li[2]/a)"]}
2024/12/31 08:23
タグ