野球リーグスコア管理システムとキャップ野球情報局に関する進捗です。
旧システムについてはこちらの記事をご覧ください。
前回、puppeteer-clusterで同時起動の制御をしたはずだったのだが、
書き方が悪いのか同時アクセスすると暴走してVPSの応答がなくなってしまうので、vercelに分離した。
herokuと同じようにサーバサイドのプログラムをデプロイできるサービス。
netlifyはフロントエンド特化。
vercelはnow.json
でルーティングを記述している。
正規表現で各メソッドにreq.query.id
を渡す場合の記述の仕方はこんな感じ。
"routes": [
{ "src": "/cap-baseball/(?<id>[^/]*)", "dest": "/screenshotCap.js?id=$1" },
{ "src": "/(?<id>[^/]*)", "dest": "/screenshot.js?id=$1" }
]
このあたりは前回の記事で説明しているので不要かなと思う。
cluster使わない書き方に戻してます。
const browser = await puppeteer.launch({
args: chrome.args,
executablePath: await chrome.executablePath,
headless: chrome.headless,
});
const page = await browser.newPage();
await page.goto("https://pawapro-gen.netlify.app/view/" + id);
await page.setCacheEnabled(false);
await page.waitForSelector("#main");
const fullPage = await page.$("#main");
const fullPageSize = await fullPage.boundingBox();
const VIEWPORT = { width: 600, height: 450, deviceScaleFactor: 1 };
await page.setViewport(
Object.assign({}, VIEWPORT, { height: fullPageSize.height })
);
await page.waitFor(5000);
const elements = await page.$$("#main");
let img;
for (const [index, element] of elements.entries()) {
img = await element.screenshot();
}
await page.close();
await console.log("screenshot done.");
return img;