Edit your Cross-Origin Resource Sharing permissions

Learn how to edit your Cross-origin resource sharing settings to allow CloudCannon to interact with your S3 bucket.

Cross-origin resource sharing (CORS) defines how web applications in one domain can interact with resources in a different domain. To allow CloudCannon to interact with your S3 bucket, you must explicitly enable cross-origin requests.

In this step, you will edit your CORS permissions.

  1. Open AWS and select your S3 bucket.
  2. Open the Permissions tab, scroll to the Cross-origin resource sharing (CORS) section, and click Edit.
  3. Copy the following JSON code into your CORS settings.
CORS.json
copied
[
  {
    "AllowedHeaders": [
      "*"
    ],
    "AllowedMethods": [
      "GET",
      "PUT",
      "POST",
      "DELETE",
      "HEAD"
    ],
    "AllowedOrigins": [
      "*"
    ],
    "ExposeHeaders": []
  }
]
  1. Click save.

The above code does not restrict which URLs are allowed to access your S3 bucket. As an optional extra step, you can edit the AllowedOrigins key to restrict access to your Sites. Origins can match a single URL, such as https://my-site.com, or multiple URLs using wildcard characters, https://*.my-site.com.

If you edit your AllowedOrigins you must also include https://app.cloudcannon.com, to ensure that CloudCannon can upload to your bucket and pull previews of your assets within the editor.

Here is an example:

CORS.json
copied
"AllowedOrigins": [
  "https://*.my-site.com",
  "https://app.cloudcannon.com"
]

Open in a new tab