1

I have a EC2 server that serves the backend using HTTP to the S3 bucket Frontend and that works fine when I use the S3 address to run the app. However, after I deploy to the Cloudfront, I get the following error:

Mixed Content: The page at 'https://d3qxpzawaycmw5.cloudfront.net/#/employees' was loaded over HTTPS, but requested an 
insecure resource 'http://ec2-3-86-60-146.compute-1.amazonaws.com:3030/api/Employees?'. This request has been blocked; 
the content must be served over HTTPS.

This informs that the BE must be served using the HTTPS. If I can't change anything for the BE, is there any solution to use the Cloudfront?

Thanks.

Arefe
  • 11,321
  • 18
  • 114
  • 168

3 Answers3

3

You don't need to change anything in the instance if you don't want. The easiest way to get HTTPS for your instance, is to front it with Load Balancer as explained in:

But for this, and any other method, you need your own domain, as you need a valid public SSL certificate for it. If you use load balancer, you can easily get free SSL cert from AWS ACM.

But if ALB is to much for you, then you need to deploy SSL on the instance. This still requires your own domain, but you can't use ACM. Instead you can get free SSL certificate from https://letsencrypt.org/.

Marcin
  • 215,873
  • 14
  • 235
  • 294
  • Thanks for your answer. If I just provide the ACM SSL/TLS certificate to the EC2 instance will it work? Mind that I don't want to change anything in the codebase and it serves content locally based on the HTTP method, like `curl -v http://localhost:3030/api/status`. My main concern is not to change the codebase and keep it as it is. – Arefe Oct 11 '21 at 04:28
  • @Arefe No need to change your codebase. Usually you would add nginx on the instance to handle all ssl related tasks. – Marcin Oct 11 '21 at 04:44
  • I dont have any experience with Nginx, is there any blog post that you can refer me to? Earlier I thought only installing the certificate in the EC2 install will do the job. A detailed workthough will be helpful. – Arefe Oct 11 '21 at 04:46
  • 2
    @Arefe I often use DigitalOcean's tutorials, they are good in my experience. Depending on the OS you use, here is one example [How To Secure Nginx with Let's Encrypt on Ubuntu 20.04](https://www.digitalocean.com/community/tutorials/how-to-secure-nginx-with-let-s-encrypt-on-ubuntu-20-04) – Marcin Oct 11 '21 at 04:48
  • I use Ubuntu so this works fine. – Arefe Oct 11 '21 at 04:51
1

Put http:// at the front of cloudfront domain name

Clement Olaniyan
  • 333
  • 2
  • 11
0

This happens when you try to open the application with https but trying to connect the backend with http.
Installing/configuring SSL certificate for backend solves this problem.
If you want to use without SSL in cloudfront use HTTP and HTTPS like this in cloudfront use HTTP and HTTPS like this

Gouranga Tarafder
  • 334
  • 3
  • 6