Introducing hubBrowser()
Taking screenshots, crawling websites, generating PDFs and more has never been easier with `hubBrowser()`.
This feature is available on both free and pro plans of NuxtHub but on the Workers Paid plan for your Cloudflare account.
We are excited to introduce hubBrowser(). This new method allows you to run a headless browser directly in your Nuxt application using Puppeteer.
How to use hubBrowser()
- Update
@nuxthub/coreto the latest version (v0.7.11or later) - Enable
hub.browserin yournuxt.config.ts
nuxt.config.ts
export default defineNuxtConfig({
hub: {
browser: true
}
})
- Install the required dependencies
Terminal
npx nypm i @cloudflare/puppeteer puppeteer
- Start using
hubBrowser()in your server routes
server/api/screenshot.ts
export default eventHandler(async (event) => {
const { page } = await hubBrowser()
await page.setViewport({ width: 1920, height: 1080 })
await page.goto('https://cloudflare.com')
setHeader(event, 'content-type', 'image/jpeg')
return page.screenshot()
})
- Before deploying, make sure you are subscribed to the Workers Paid plan
- Deploy your project with NuxtHub