cloud front (ssl) connection issue with ec2.
I am implementing public ssl via clod front and connecting cloud front to ec2 machine. SSL implemented successfully but (Mixed Content) issue showing that the content must be served over HTTPS. in setting of clod front domain section i enabled protocol https but issue is still same on live site (talends.com )
issue is : Mixed Content: The page at 'https://talends.com/' was loaded over HTTPS, but requested an insecure stylesheet This request has been blocked; the content must be served over HTTPS.
please guide how can we resolve this issue.
- Newest
- Most votes
- Most comments
Hi, @talends.
Check the HTML source you get when you access https://talends.com.
Perhaps the warned animate.css, style.css, etc. are not output with absolute paths (starting with http)?
This error occurs because the browser accesses HTTP EC2 directly, ignoring HTTPS CloudFront only for stylesheets.
If you modify the stylesheet path so that it is output as a relative path, the stylesheet will also be retrieved via CloudFront's HTTPS, so the problem should be resolved.
CloudFront doesn't modify the content of the message, unless you use Lambda@Edge. So the references to the EC2 instances domain name is coming from somewhere in your code.
So depending on how you generate the HTML pages (if it's CSM or your generate them as part of your Node build) you will need to make sure the base URL is set to your domain. In many cases if you don't customize this the CSM or your Node build will assume to use the name of the machine.
So please check with your chosen framework, technology or service how do you customize the base URL so that links to resources and other pages are generated correctly.
As related note, I would recommend you protect your custom origin, so that only Cloudfront can connect to it. Use the Security Group to only allow access from CloudFront IP addresses. Please see: https://aws.amazon.com/blogs/networking-and-content-delivery/limit-access-to-your-origins-using-the-aws-managed-prefix-list-for-amazon-cloudfront/
Relevant content
- asked a year ago
- asked a year ago
- asked a year ago
AWS OFFICIALUpdated 2 years ago- AWS OFFICIALUpdated 3 months ago
- AWS OFFICIALUpdated 3 months ago
- AWS OFFICIALUpdated 2 years ago
hi all assets path come from cloud front domain name (ec2 public dns). and i select Protocol (https) but on website assets loading only with http. i can not update path for assets from code becuase path come from cloud front domain name. site open on https but not assets. may be some setting miss on cloud front for content to load with https. please guide and check screenshots.
https://prnt.sc/bOWZWhpV-GGb https://prnt.sc/nkEnFEXcrXIk
@talends.
The screenshot you posted is of the CloudFront settings screen, but we don't need to look there yet. (You may see it later, but order matters in problem solving.)
The first thing to check is the content of the response you get in your browser. Open the target page in a browser to view the source and publish the capture.
okay this is issue on browswer console. Mixed Content: The page at 'https://talends.com/' was loaded over HTTPS, but requested an insecure stylesheet 'http://ec2-3-235-241-28.compute-1.amazonaws.com/talends/assets/css/animate.css'. This request has been blocked; the content must be served over HTTPS.
https://prnt.sc/ta782DT63KOJ https://prnt.sc/W6eyTFghUBRn
Is it possible to share the contents of the page displayed by accessing the following with Google Chrome?
We need to see the HTTP response content, not the developer tools or the CloudFront console.
view-source:https://talends.com/please check https://prnt.sc/jAOXEfxr7cws https://prnt.sc/3ftc6d4iVt2t