Hi! Would love start using this API! 4dc10b1f5e6ded482cc85051fbdf49c9

V

vassbenceOP•10/15/23, 10:11 AM

And so the recommended way to use this service is to keep browsers alive as much as possible with Durable Objects?

Vvassbence Hi! Would love start using this API! 4dc10b1f5e6ded482cc85051fbdf49c9

Z

zegevlier•10/15/23, 10:11 AM

Look one message above yours

V

vassbenceOP•10/15/23, 10:12 AM

My bad! Posted in the correct thread. My question still stands

V

vassbenceOP•10/15/23, 10:13 AM

Also, would love to know how one should handle large amounts of traffic, what would be the easiest way to build a queue

Vvassbence And so the recommended way to use this service is to keep browsers alive as much...

Z

zegevlier•10/15/23, 10:14 AM

AFAIK yes, how the pricing works exactly is still a bit unclear, but it seems like there is little harm in keeping sessions open as long as possible to re-use them.

Vvassbence Also, would love to know how one should handle large amounts of traffic, what wo...

Z

zegevlier•10/15/23, 10:14 AM

Probably #queues-beta

V

vassbenceOP•10/15/23, 10:14 AM

Let's say I'm generating PDF of tickets, and an event goes live, 10k people purchase a ticket. I put each ticketId in the queue which gets consumed by a worker which is calling this API via a DO

V

vassbenceOP•10/15/23, 10:14 AM

but that means there is literally 1 consumer for the queue running 1 request / sec (or worse if it takes longer)

V

vassbenceOP•10/15/23, 10:15 AM

Which would be really bad

V

vassbenceOP•10/15/23, 10:15 AM

Or I can actually fan out the work to multiple browsers, it's jut that it's going to cost a lot more?

Vvassbence Or I can actually fan out the work to multiple browsers, it's jut that it's goin...

Z

zegevlier•10/15/23, 10:18 AM

You can absolutely do that: Keep in mind that the current limits for the beta only allow 2 concurrent browsers (https://developers.cloudflare.com/browser-rendering/platform/limits/), and the current pricing (from https://blog.cloudflare.com/running-serverless-puppeteer-workers-durable-objects/) means that fanning out will increase the cost by quite a lot.

V

vassbenceOP•10/15/23, 10:19 AM

Yeah... so to keep using Cloudflare workers i'd need to write logic to fan out to a minimal amount of browsers but keep them 100% working all the time

V

vassbenceOP•10/15/23, 10:20 AM

AWS Lambda is just a better solution for this currently, at least for my use case, as each lambda can start their own puppeteer, i can easily call 10k lambdas and the pricing is a lot better.

V

vassbenceOP•10/16/23, 5:04 PM

Is the API supposed to work in localhost?

V

vassbenceOP•10/16/23, 5:05 PM

C

Chao•10/16/23, 6:51 PM

how much durable object storage does a browser object take up? Say for a browser without any pages opened?

T

Tom•10/19/23, 1:16 PM

Hello all - how can I get access to the beta? I'm looking to replace prerender.io in our stack, and would love to use Browser Rendering API. We already love using pages, workers and the new Workers AI too

TTom 👋 Hello all - how can I get access to the beta? I'm looking to replace prerende...

Z

zegevlier•10/19/23, 1:16 PM

Put your account ID here browser-rendering-apiBrowser Rendering API Beta Access

Zzegevlier Put your account ID here https://discord.com/channels/595317990191398933/1112675...

T

Tom•10/19/23, 1:20 PM

Will do, thanks!

T

Tom•10/19/23, 2:00 PM

fyi - The docs here (https://developers.cloudflare.com/browser-rendering/platform/wrangler/#bindings) mention

node_compat

node_compat

but in the getting started example (https://developers.cloudflare.com/browser-rendering/get-started/screenshots/#4-configure-wranglertoml) its

compatibility_flags = [ "nodejs_compat" ]

compatibility_flags = [ "nodejs_compat" ]

compatibility_flags = [ "nodejs_compat" ]

compatibility_flags = [ "nodejs_compat" ]

A

Ashley•10/20/23, 11:48 AM

how long does it take to spin up a new browser instance? I am running this code:

    const browser = await puppeteer.launch(env.BROWSER);
    const page = await browser.newPage();

    const [res] = await Promise.all([
        page.waitForResponse(res => res.url().includes('something') && res.request().method().toUpperCase() !== "OPTIONS", {timeout: 10 * 1000}),
        page.goto('https://someurl.com', {waitUntil: "domcontentloaded"}),
    ]);

    const browser = await puppeteer.launch(env.BROWSER);
    const page = await browser.newPage();

    const [res] = await Promise.all([
        page.waitForResponse(res => res.url().includes('something') && res.request().method().toUpperCase() !== "OPTIONS", {timeout: 10 * 1000}),
        page.goto('https://someurl.com', {waitUntil: "domcontentloaded"}),
    ]);

    const browser = await puppeteer.launch(env.BROWSER);
    const page = await browser.newPage();

    const [res] = await Promise.all([
        page.waitForResponse(res => res.url().includes('something') && res.request().method().toUpperCase() !== "OPTIONS", {timeout: 10 * 1000}),
        page.goto('https://someurl.com', {waitUntil: "domcontentloaded"}),
    ]);

    const browser = await puppeteer.launch(env.BROWSER);
    const page = await browser.newPage();

    const [res] = await Promise.all([
        page.waitForResponse(res => res.url().includes('something') && res.request().method().toUpperCase() !== "OPTIONS", {timeout: 10 * 1000}),
        page.goto('https://someurl.com', {waitUntil: "domcontentloaded"}),
    ]);

And locally, on my Mac, it takes 2-3 seconds in total. In Cloudflare however, it seems to be taking a lot longer perhaps? I don't really know, but it's getting exceeded resources and the log tail says CPU exceeded. It says for CPU, but again, I can't see how one request like this would use so much CPU... it's listed as using 75ms of CPU time, so I'm just really confused!

A

Ashley•10/20/23, 12:16 PM

This makes it even more confusing

Varying CPU times, some exceeded, some not

K

Kuririn•10/20/23, 4:21 PM

How can I check if I have access to the beta?

K

Kuririn•10/20/23, 4:22 PM

I filled out the form a few weeks ago.

K

Kuririn•10/20/23, 4:27 PM

I put my account id in the #Browser Rendering API Beta Access

KKuririn How can I check if I have access to the beta?

C

Chaika•10/20/23, 4:58 PM

I think the only way would just be trying to deploy a worker using the browser rendering binding: https://developers.cloudflare.com/browser-rendering/get-started/screenshots/
If it tells you that you don't have access.. then you don't

KKuririn I filled out the form a few weeks ago.

C

Chaika•10/20/23, 4:58 PM

If you never got anything back about filling in the form, I would assume you're not in it yet. Vero replies to everyone who puts their ID in that thread when they get enabled -- when that happens, you'd know for sure

Original message was deleted

M

Mackenly•10/21/23, 5:14 PM

It often seems a lot of forms get posted in blog posts and what not, maybe looked at a few times, and not used any further. Would be great if there were some sort of beta/early access program/request tool within the account dashboard. Really thankful for the team working on this discord.

Z

zegevlier•10/21/23, 6:04 PM

This is a bit off-topic for this channel, but I know that #magic-network-monitoring prioritized people in the discord because they usually give more feedback.

FFirefox When running the following code I keep getting a type error of `readable is not ...

I

ItsWendell•10/23/23, 6:53 PM

Any solutions found? It seems like what is returned in the PDF is not an Buffer, debugging this now more. Edit: Okay so

.pdf()

.pdf()

.pdf()

.pdf() doesn't work but this does:

        const qoutePdf = await page.createPDFStream({
            printBackground: true,
            format: 'a4',
        });

        // Create web compatible readable stream
        const { readable, writable } = new TransformStream();

        const writer = writable.getWriter();

        qoutePdf.on('data', (chunk) => {
            writer.write(chunk);
        });

        qoutePdf.on('end', () => {
            writer.close();
        });

        return new Response(readable, {
            status: 200,
            headers: {
                'Content-Type': 'application/pdf',
            },
        });

        const qoutePdf = await page.createPDFStream({
            printBackground: true,
            format: 'a4',
        });

        // Create web compatible readable stream
        const { readable, writable } = new TransformStream();

        const writer = writable.getWriter();

        qoutePdf.on('data', (chunk) => {
            writer.write(chunk);
        });

        qoutePdf.on('end', () => {
            writer.close();
        });

        return new Response(readable, {
            status: 200,
            headers: {
                'Content-Type': 'application/pdf',
            },
        });

        const qoutePdf = await page.createPDFStream({
            printBackground: true,
            format: 'a4',
        });

        // Create web compatible readable stream
        const { readable, writable } = new TransformStream();

        const writer = writable.getWriter();

        qoutePdf.on('data', (chunk) => {
            writer.write(chunk);
        });

        qoutePdf.on('end', () => {
            writer.close();
        });

        return new Response(readable, {
            status: 200,
            headers: {
                'Content-Type': 'application/pdf',
            },
        });

        const qoutePdf = await page.createPDFStream({
            printBackground: true,
            format: 'a4',
        });

        // Create web compatible readable stream
        const { readable, writable } = new TransformStream();

        const writer = writable.getWriter();

        qoutePdf.on('data', (chunk) => {
            writer.write(chunk);
        });

        qoutePdf.on('end', () => {
            writer.close();
        });

        return new Response(readable, {
            status: 200,
            headers: {
                'Content-Type': 'application/pdf',
            },
        });

E

Erwin•10/24/23, 1:44 AM

Hey lovely CF people.. I am having a proper challenge building the Open Telemetry library and auto-instrumenting it, because you are implementing exactly the same interface as say a service binding (a

fetch

fetch

method), but at least in your documentation you instruct people to invoke that in a way that is not spec compliant.

This leads to two problems:
1) I can't (easily) distinguish between a ServiceBinding and a BrowserRendering Binding
2) When I try to create a

Request

Request

out of the parameters you specify (

/v1/acquire

/v1/acquire

/v1/acquire

/v1/acquire) it (obviously) fails because

/v1/acquire

/v1/acquire

/v1/acquire

/v1/acquire is not a valid URL.

Now #2 can probably be easily solved by passing in a proper URL, but that would just prevent things from crashing.

Technically I could solve #1 by instrumenting any

fetch

fetch

function with a generic wrapper and then decide which instrumentation implementation to use based on the parameters passed into the

fetch

fetch

function, but that would be pretty brittle, because I would have to hardcode exactly what you would pass into the first request.

EErwin Hey lovely CF people.. I am having a proper challenge building the Open Telemetr...

I

ItsWendell•10/24/23, 7:25 AM

It's probably ideal to auto instrument any browser binding, regardless of clients used, but out of interest, have you tried auto-intstrumenting

@cloudflare/puppeteer

@cloudflare/puppeteer

@cloudflare/puppeteer

@cloudflare/puppeteer?

IItsWendell It's probably ideal to auto instrument any browser binding, regardless of client...

E

Erwin•10/24/23, 7:55 AM

The puppeteer library can easily add support for instrumentation by just using the OTel API functions. That will be picked up by this library and be automatically added.

E

Erwin•10/24/23, 7:56 AM

And I can write the code for the instrumenting of the binding, but I would love a proper way to identify what binding am looking at when I enumerate “Env”

K

Kuririn•10/24/23, 10:50 AM

is there a way to see my current usage of browser rendering api?

Original message was deleted

E

Erwin•10/24/23, 10:53 AM

Oh I knew that, but I wasn’t planning on adding that myself..

But I just forked the repository to see what it would take

N

Niek•10/24/23, 5:55 PM

i would also love to get access to browser rendering beta:

3e38dc7049f501248503b981bf442450

3e38dc7049f501248503b981bf442450

3e38dc7049f501248503b981bf442450

3e38dc7049f501248503b981bf442450

NNiek i would also love to get access to browser rendering beta: `3e38dc7049f501248503...

Z

zegevlier•10/24/23, 8:47 PM

Put the ID in here: browser-rendering-apiBrowser Rendering API Beta Access

Original message was deleted

E

Erwin•10/25/23, 1:01 AM

I just took a look at adding instrumentation to the

@cloudflare/puppeteer

@cloudflare/puppeteer

@cloudflare/puppeteer

@cloudflare/puppeteer package, I realised that while adding the spans is going to be very straightforward, it would be quite a bunch of work figuring out what to instrument. So if someone else wants to do that, I would be more than happy to help that. But I am going to focus on the core library in the copious spare time that I have

C

charl.dev•10/26/23, 9:51 AM

on our ent account, im getting

workers.api.error.no_access_to_browser_worker

workers.api.error.no_access_to_browser_worker

workers.api.error.no_access_to_browser_worker

workers.api.error.no_access_to_browser_worker, do we need to enable it?

getting the error when trying to run

dev

dev

or

deploy

deploy

deploy

deploy. Role is worker admin. Can dm the acc id

7

730283•10/26/23, 9:57 AM

Can develop do something

Ccharl.dev on our ent account, im getting `workers.api.error.no_access_to_browser_worker`, ...

C

charl.dev•10/26/23, 10:03 AM

dm'd the PO the be added

Z

zegevlier•10/26/23, 10:07 AM

It's not enabled by default for any accounts currently. I assume your contact at CF will be able to add it for you, but otherwise you can also put the account ID in here: browser-rendering-apiBrowser Rendering API Beta Access

C

charl.dev•10/26/23, 10:17 AM

thanks, dont want to post the account id publically, messaged vero

Z

zegevlier•10/26/23, 10:18 AM

Alright. Just FYI: The account ID is considered safe to be public.

Zzegevlier Alright. Just FYI: The account ID is considered safe to be public.

C

charl.dev•10/27/23, 7:14 AM

okta was considered safe

Ccharl.dev okta was considered safe 🙂

H

Hello, I’m Allie!•10/27/23, 7:29 AM

I mean, yes, your account ID can be used to in an attack. But, to perform said attack, the attacker needs access to your account. If they have access to your account, they can find your account ID anyway

H

Hello, I’m Allie!•10/27/23, 7:29 AM

It's like a Discord User ID. Here's mine:

459755459117711362

459755459117711362

459755459117711362

459755459117711362. It can be used in a attack, but it is by no means what determines whether you are vulnerable or not

H

Hello, I’m Allie!•10/27/23, 7:30 AM

Same thing with your domain

C

charl.dev•10/27/23, 7:31 AM

Its more around our audit guys, I'm just playing with the okta thing.

I trust cf over any provider

I have browser rendering on my personal account, so can build on that till its enabled on the ent acc

Hi! Would love start using this API! 4dc10b1f5e6ded482cc85051fbdf49c9

Similar Threads