singleton borwser api

lluisd · Feb 5, 2024 · 15ea1b5 · 15ea1b5
1 parent acac84c
commit 15ea1b5
Show file tree

Hide file tree

Showing 2 changed files with 74 additions and 13 deletions.
diff --git a/services/browser-api.js b/services/browser-api.js
@@ -0,0 +1,71 @@
+const puppeteer = require('puppeteer-core')
+const config = require('../config')
+
+class PuppeteerApi {
+
+    browser = null
+    page = null
+    svgImage = null
+    constructor() {
+    }
+
+    getSvgImage() {
+        return this.svgImage
+    }
+
+    async newBrowser() {
+        return await puppeteer.connect({ browserWSEndpoint: `wss://${config.browserlessUrl}` })
+    }
+
+    async getBrowser() {
+
+        if (!this.browser) {
+            this.browser = await this.newBrowser()
+        }
+
+        return this.browser
+    }
+
+    async getPage() {
+        if (!this.page) {
+            this.page = await this.newPage()
+            await this.handleStart()
+        }
+        return this.page
+
+    }
+
+    async newPage() {
+        const browser = await this.getBrowser()
+        return await browser.newPage()
+    }
+
+    async handBack(page) {
+        // close the page or even reuse it?.
+        await page.close()
+
+        // you could add logic for closing the whole browser instance depending what
+        // you want.
+    }
+
+    async handleStart() {
+        await this.page.setViewport({ width: 1920, height: 1080 })
+        await this.page.goto("https://www.twitch.tv/" + config.twitch.channels, { waitUntil: 'networkidle0' })
+
+        await this.page.$eval('button[data-a-target="consent-banner-accept"]', el =>  el.click()).catch(() => {})
+        await this.page.$eval('button[data-a-target="content-classification-gate-overlay-start-watching-button"]', el =>  el.click()).catch(() => {})
+        await this.page.waitForSelector('div.persistent-player')
+        await this.page.$eval('.video-player__default-player', el => el.remove())
+        this.svgImage = await this.page.$('div.persistent-player')
+    }
+
+
+    async shutdown() {
+        await this.browser.close()
+    }
+
+
+}
+
+const browserApi = new PuppeteerApi()
+module.exports = browserApi
diff --git a/services/browser.js b/services/browser.js
@@ -1,27 +1,17 @@
-const config = require('../config')
-const puppeteer = require("puppeteer-core")
+const browserApi = require('./browser-api.js')
 require('mathjs')
 
 async function getScreenshot() {
     try {
-        const browser = await puppeteer.connect({ browserWSEndpoint: `wss://${config.browserlessUrl}` })
-        const page = await browser.newPage()
+        const page = await browserApi.getPage()
 
-        await page.setViewport({ width: 1920, height: 1080 })
-        await page.goto("https://www.twitch.tv/" + config.twitch.channels, { waitUntil: 'networkidle0' })
 
-        await page.$eval('button[data-a-target="consent-banner-accept"]', el =>  el.click()).catch(() => {})
-        await page.$eval('button[data-a-target="content-classification-gate-overlay-start-watching-button"]', el =>  el.click()).catch(() => {})
 
-        await page.waitForSelector('div.persistent-player')
-        await page.$eval('.video-player__default-player', el => el.remove())
-        const svgImage = await page.$('div.persistent-player')
         const name = Math.random().toString(36).substring(2,8)
-        const bufferImage = await svgImage.screenshot({
+        const bufferImage = await browserApi.getSvgImage().screenshot({
             path: `public/images/${name}.png`,
             omitBackground: true
         })
-        await browser.close()
 
         return {buffer: bufferImage, fileName: `${name}.png` }
     } catch (error) {