1

I've deployed a ReactJS application in AWS Amplify. That ReactJS app calling a Spring boot service that runs in same AWS EC2 instance. I am getting the following error from ReactJS App that calls EC2 instance.

Mixed Content: The page at 'master.dw1qlg7lxrxk.amplifyapp.com' was loaded over HTTPS, but requested an insecure resource 'ec2-3-145-165-206.us-east-2.compute.amazonaws.com:8080/…'. This request has been blocked; the content must be served over HTTPS.

My ReactJS app is calling in https to ec2 instance (where spring boot is running), but spring boot in ec2 instance runs in http. I think, that's where this error comes. I need to how to fix this to work this together in feasible way.

Stella
  • 1,728
  • 5
  • 41
  • 95

2 Answers2

1

There are two options to solve this mix-content issue for good:

  1. Introduce an AWS Application Load Balancer that redirects all HTTP requests to its HTTPS listeners. You will then have to point those listeners to the auto-scaling group or the EC2 instances where you have to run your Spring Boot applications. You may also want to consider sending CORS headers from your Spring Boot server.

  2. You can configure your EC2 instance to support HTTPS transactions but this is a less-scalable solution as it requires reconfiguration of SSL setup when you lose your EC2 instance. This setup will also be limited to one node at a time which should be fine for POCs and small-scale applications that few people would use.

I'd personally go for option 1 most of the time if I have to do professional grade work.

Allan Chua
  • 9,305
  • 9
  • 41
  • 61
0

In this case, like Allan Chua said you need a load balancer or configure SSL on the EC2 instance.

But if I am not mistaken you are not very experienced with AWS and you are running a Spring Boot Application.

I would suggest using Elastic Beanstalk instead. This can provision everything for you and even comes out of the box with a SSL certificate for the default CNAME. It also you to easily scale up your application later!

alex
  • 240
  • 6
  • Hi @Alex, It looks good idea. This is only test POC. Can I deploy my spring boot service in Beanstalk or ReactJS app in Beasstalk or both can be deployed there? This is for testing only. Does beanstalk deployment comes with free tier? – Stella Jun 27 '23 at 15:58
  • Yes, Beanstalk you can setup to use the free tier (its based on EC2, you pay just for the resources and Beanstalk is free), but it will make it much easier for you to do your tests as it will setup the webserver for you as well. You just have to upload your application. – alex Jun 27 '23 at 16:02
  • Thank you so much Alex. Should I upload both in Beanstalk (ReactJS front end app as well Spring Boot service that has end point and calls internally to get data from AWS RDS MySql DB) ? – Stella Jun 27 '23 at 16:03
  • For a test environment you can have Elasticbeanstalk create the MySQL environment for you (don't do this for production!). For the frontend I would still use Amplify. Beanstalk is just for the spring boot backend application. – alex Jun 27 '23 at 16:12
  • Oh ok Alex. If I deploy spring boot in Beanstalk, Then, Would I be charged for Spring boot using AWS RDS behind the scene, in my free tier? in AWS RDS, i have a simple mysql table under free use. – Stella Jun 27 '23 at 16:30
  • With elastic beanstalk can still use the free tier! But must shutdown the old EC2 and database ofcourse – alex Jun 27 '23 at 16:35
  • I am creating Beanstalk environment, but it stuck at "Elastic Beanstalk is launching your environment. This will take a few minutes." – Stella Jun 27 '23 at 16:49
  • Ok, since it was stuck at launching, i clicked on restore environment and beanstalk is showing some domain url, but i click on that, it doesn't work. – Stella Jun 27 '23 at 16:54
  • Anyway, I am not going to use Beanstalk, it wasn't successful for me. – Stella Jun 27 '23 at 17:01
  • It can take some time to launch EBL. You can start with a sample java application but give it 30-60 min to provision the resources! – alex Jun 27 '23 at 17:03
  • I just need this for basic testing. I just tried uploading ReactJS build directly in S3 bucket (as website hosting), but observed 404 Not Found - No such key Key: index.html. – Stella Jun 27 '23 at 17:06