We recommend enabling CORS (Cross-Origin Resource Sharing) when using Amazon S3 as your backend server. To enable CORS, set up a custom HTTP header for your service by following the steps below.
- Log in to the Fastly web interface and click the Configure link.
- From the service menu, select the appropriate service.
- Click the Edit configuration button and then select Clone active. The Domains page appears.
- Click the Content link. The Content page appears.
-
Click the Create header button. The Create a header page appears.
- Fill out the Create a header fields as follows:
- In the Name field, type a descriptive name for the new header (e.g.,
CORS S3 Allow
). This name is displayed in the Fastly web interface. - From the Type menu, select Cache, and from the Action menu, select Set.
- In the Destination field, type
http.Access-Control-Allow-Origin
. - In the Source field, type
"*"
. - Leave the Ignore if set menu and the Priority field set to their default values.
- In the Name field, type a descriptive name for the new header (e.g.,
- Click the Create button. The new header appears on the Content page.
- Click the Activate button to deploy your configuration changes.
IMPORTANT: Objects already cached won't have this header applied until you purge them.
Test it out
Running the command curl -I example.tld/path/to/resource
should include similar information to the following in your header:
1
2
3
Access-Control-Allow-Origin: http://example.tld
Access-Control-Allow-Methods: GET
Access-Control-Expose-Headers: Content-Length, Connection, Date...