Aster

A robust file uploader for Cloudflare R2. Complements Render nicely.

If you want something simpler though, try https://github.com/Erisa/simple-r2-form.

Features

• Multipart uploads
• Uploads are resumable (even after tab refreshes)
• Image editor
• Progress tracking
• Most of these are thanks to Uppy!

Notes

• Aster DOES NOT AUTHENTICATE! You should put it behind Cloudflare Access.
• Non-multipart uploads are currently disabled in the UI because Uppy doesn't display the URL: https://github.com/transloadit/uppy/issues/4618

Setup

• Configure the R2 bucket CORS policy in the Cloudflare dashboard:

[
    {
        "AllowedOrigins": ["https://[CHANGE ME TO YOUR WORKER CUSTOM DOMAIN]"],
        "AllowedMethods": ["GET", "PUT"],
        "MaxAgeSeconds": 3000,
        "AllowedHeaders": [
            "Authorization",
            "x-amz-date",
            "x-amz-content-sha256",
            "content-type"
        ],
        "ExposeHeaders": ["ETag", "Location"]
    }
]

• Create a R2 token: here with Object Read & Write permissions.

Method 1 (Local)

1. Clone locally: git clone https://github.com/kotx/aster.git
2. Install dependencies: pnpm i
3. Tweak wrangler.toml to your liking (set bucket_name, PUBLIC_BUCKET_URL, R2_BUCKET_NAME)
4. Run wrangler secret put [NAME] for R2_ACCESS_KEY, R2_SECRET_KEY
5. Run pnpm run deploy

Method 2 (GitHub Actions)

1. Fork this repository
2. Set the secrets CF_API_TOKEN (with the Edit Cloudflare Workers template) and CF_ACCOUNT_ID in the repo settings
3. Enable workflows in the Actions tab
4. Update wrangler.toml as needed (this will trigger the workflow)
5. In your Cloudflare dashboard, set the required secrets R2_ACCESS_KEY, R2_SECRET_KEY in the worker settings.

Development

Remember to add "http://127.0.0.1:8787", "http://localhost:8787" to the allowed origins CORS policy above.

Install deps:

pnpm i

Start development server:

pnpm dev