CODEWITHSUNDEEP
javaamazon-web-serviceshttpamazon-ec2amazon-elastic-beanstalk
ksernow
ksernow

Reputation: 714

AWS blocked mixed content when calling API

I have a front end application in digitalOcean with domain name testDO. This domain has SSL certificate. So all request origin are from https://testDO.com.

I have a backend server sitting in AWS created by deploying war file into beanstalk. It has the name testAWS.us-east-2.elasticbeanstalk.com

When I call API directly from the url for example http://testAWS.us-west-2.elasticbeanstalk.com/myAPI/getName it works. When I call the same API from my front end I get blocked:mixed-content. Is this because its http and not https? what is the workaround?

Upvotes: 7

Views: 13032

Answers (3)

p.kovelan
p.kovelan

Reputation: 9

You need to setup your AWS Elastic Beanstalk environment with your domain or you can use HTTPS with a self-signed certificate for development and testing purposes.

You can use upload your front end in AWS S3, In AWS static webpage Endpoints are http, so you wan't get this mixed-content problem.

Reference:

Upvotes: 1

Kannaiyan
Kannaiyan

Reputation: 13035

You can create a CloudFront Distribution and take it with https to http. You also need to enable CORS in your response to access cross origin domain requests.

Client --> CloudFront --> Your http API (Response with CORS).

Hope it helps.

Upvotes: 1

Ashan
Ashan

Reputation: 19748

Yes this is because, your HTTPS site tries to access content through HTTP which is blocked by the browser. You need to either both HTTPS or proxy the request at frontend server and terminate SSL there and forward it to your API Server in Beanstalk.

Note: Since the frontend and backend are in two different environments it will be preferred to use both HTTPS than the proxy approach for security.

Upvotes: 4

Related Questions