Cloudflare Developers•5mo ago

How to stream R2 file inside FormData in fetch request body?

I was wondering if it’s possible to stream an R2 object to an external API using FormData instead of reading the whole blob into memory. The file size can be more than 2GB.

export default {
    async fetch(request: Request, env: Env) {
        const key = 'some_video.mp4';

        const object = await env.MY_R2_BUCKET.get(key);

        const form = new FormData();

        const fileStream = object!.body;
        const fileBlob = await object!.blob();

        form.set('some_text_field', 'value here');
        // I want to use the `fileStream` here instead of `fileBlob`
        form.set('video', fileBlob, 'video.mp4');

        const resp = await fetch('https://api.example.com/some/endpoint', {
            method: 'POST',
            body: form,
        });

        console.log(await resp.text());
    },
};

export default {
    async fetch(request: Request, env: Env) {
        const key = 'some_video.mp4';

        const object = await env.MY_R2_BUCKET.get(key);

        const form = new FormData();

        const fileStream = object!.body;
        const fileBlob = await object!.blob();

        form.set('some_text_field', 'value here');
        // I want to use the `fileStream` here instead of `fileBlob`
        form.set('video', fileBlob, 'video.mp4');

        const resp = await fetch('https://api.example.com/some/endpoint', {
            method: 'POST',
            body: form,
        });

        console.log(await resp.text());
    },
};

6 Replies

kian•5mo ago

You can’t I would imagine it’s mainly a limitation due to FormData’s boundary

Manzoor Wani•5mo ago

Is there a way to stream the file and data without using FormData?

kian•5mo ago

Put the metadata in a header or query param and then pass the body as-is

Manzoor Wani•5mo ago

That works when you need to only stream the file. It doesn't work when you have both a file and some form fields.

kian•5mo ago

Well, that’s why I said the header or query param If you want to stream the body then that has to be the only thing in the body

Manzoor Wani•5mo ago

How are browsers able to stream the files added to FormData? Is there some difference in the implementation of spec in Workers?

Gaming

Programming

How to stream R2 file inside FormData in fetch request body?