Skip to main content
If you do not wish to (or can’t) use local storage, an alternative way to upload images is to configure R2. It’s free.
1

Create account and login to the console

Go to the Cloudflare Dashboard, and register if needed, then login.
2

Create a new Bucket

In the dashboard sidebar, and head to the R2 page.R2 PageCreate a new Bucket.
  • Choose Automatic
  • Choose Standard
Create Bucket
3

Create your R2 Token

Create your R2 Token by going to R2 Object Storage:R2 Object StorageClick on the API dropdown, and select Manage API tokens:Manage API tokensCopy your Account ID for later, and click on “Create an API token”:Create API TokenCreate an Account API token:Account API TokenUnder “Permissions” choose “Object Read & Write” and under “Specify bucket(s)” search for your created Bucket.Permissions
4

Copy your credentials

After the R2 Token is created, copy your “Access Key ID” and “Secret Access Key”:Copy CredentialsPaste the respective information into your .env environment.
CLOUDFLARE_ACCOUNT_ID="accountId"
CLOUDFLARE_ACCESS_KEY="accessKey"
CLOUDFLARE_SECRET_ACCESS_KEY="secretAccessKey"
CLOUDFLARE_BUCKETNAME="bucketName"
CLOUDFLARE_REGION="region (like wnam)"
5

Configure Custom Domain and CORS policies

Go to configuration and connect a custom domain (if you don’t have one, you can use the one that CloudFlare provides.) Add it to your .env file.
CLOUDFLARE_BUCKET_URL="https://customdomain.com"
Custom DomainClick to edit the CORS policy and add the following JSON:
[
  {
    "AllowedOrigins": [
      "http://localhost:4200",
      "https://yourDomain.com"
    ],
    "AllowedMethods": [
      "GET",
      "POST",
      "HEAD",
      "PUT",
      "DELETE"
    ],
    "AllowedHeaders": [
      "Authorization",
      "x-amz-date",
      "x-amz-content-sha256",
      "content-type"
    ],
    "ExposeHeaders": [
      "ETag",
      "Location"
    ],
    "MaxAgeSeconds": 3600
  }
]
CORS Policy