Skip to content

kotx/aster

Repository files navigation

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.

a screenshot of aster

Features

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

Notes

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

About

A robust R2 file uploader

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Sponsor this project

 

Packages

No packages published