Reputation: 3580
In my front end application, I'm storing media in S3 and retrieving it with a fetch request. This worked fine from my local machine, running http://localhost and making an http request to S3, but started failing when I deployed the application to the web and started serving it over https. The failure was
The page at [URL] was loaded over HTTPS, but requested an insecure resource 'http://ofanymdev.s3-website-eu-west-1.amazonaws.com/files/1707231907747-download1.jpeg'. This request has been blocked; the content must be served over HTTPS.
I went into AWS Cloudfront and created a new distribution with the origin domain being the bucket's origin, ofanymdev.s3.eu-west-1.amazonaws.com, hoping that it would allow me to access the bucket over https in the browser, and am trying to access the file above via https, but the requests just time out now.
What do I need to configure, and how do I need to configure it in order to access these files from the front end with a fetch request?
Upvotes: 0
Views: 299
Reputation: 270274
Looking at your URL:
http://ofanymdev.s3-website-eu-west-1.amazonaws.com/files/1707231907747-download1.jpeg
It contains s3-website-eu-west-1
that indicates it is being used as a Website endpoint - Amazon Simple Storage Service. This gives it extra capabilities such as:
index
and error
pageI suggest you check that you have enabled website hosting. See: Enabling website hosting - Amazon Simple Storage Service
Alternatively, your code could use a URL that does not involve website hosting:
https://ofanymdev.s3-eu-west-1.amazonaws.com/files/1707231907747-download1.jpeg
Upvotes: 1