Rick Posts - Answer Overflow

Rick

•Created by Rick on 1/30/2025 in #workers-help

Unable to upload image to R2 via workers

Hey folks I am unable to upload an image to my R2 bucket with custom domain endpoints, using my workers api. Here is my code. When executed, there is no error. And the web based dashboard doesn't shows the image in the bucket.

    if (thumb) {
        if (thumb.size > UserControlsSchema.thumbMinSize
            && thumb.size < UserControlsSchema.thumbMaxSize
            && UserControlsSchema.thumbFileTypes.includes(thumb.type)
        ) {
            await ctx.env.STORAGE.put('someid', thumb.stream())
            let thumbURL = `https://images.mydomain.com/${fileId}`
        } else {
            throw new ServerError("InvalidRequestData", "User thumb doesn't meets the schema requirements");
        }
    }

    if (thumb) {
        if (thumb.size > UserControlsSchema.thumbMinSize
            && thumb.size < UserControlsSchema.thumbMaxSize
            && UserControlsSchema.thumbFileTypes.includes(thumb.type)
        ) {
            await ctx.env.STORAGE.put('someid', thumb.stream())
            let thumbURL = `https://images.mydomain.com/${fileId}`
        } else {
            throw new ServerError("InvalidRequestData", "User thumb doesn't meets the schema requirements");
        }
    }

in my wrangler.toml file, I have bound the R2 details as

[[r2_buckets]]
binding = 'STORAGE' # <~ valid JavaScript variable name
bucket_name = 'assets'

[[r2_buckets]]
binding = 'STORAGE' # <~ valid JavaScript variable name
bucket_name = 'assets'

Since I am uploading from my workers api and not from a browser POST, I do not think I need to set anything like an AUTH_SECRET, or do I? I have also tried with and without CORS in the bucket settinsg without any success.

5 replies

CDCloudflare Developers

•Created by Rick on 1/24/2025 in #workers-help

unable to lazy load images

I am currently doing local web dev using CF workers. I am generating an html using ES6 string interpolation like this

export const header = () => {
    return /*html*/ `
<div class="navbar-start gap-2">

export const header = () => {
    return /*html*/ `
<div class="navbar-start gap-2">

The problem is that when I serve my html, any image (irrespective of where it is hosted) with the property loading="lazy" is simply not being served. if I remove the loading=lazy, it works fine. When it doesn't works, the browser's network tab doesn't shows the image either. Is this a know issue?

4 replies

CDCloudflare Developers

•Created by Rick on 6/28/2023 in #pages-help

How to serve static assets and turn "Hello World Worker" c3 template into a Pages project?

1 replies

Gaming

Programming