CORS errors when deploying Spring Boot and Angular app in Docker

Question

I have deployed 3 docker containers - for the database, the backend (Spring boot) and the frontend (Angular). However, when I am visiting the website (Google Cloud VM), I am getting CORS error for all the requests to backends. The backend is run on 8080.

I am getting CORS when I am visiting the IP:80

Why is this happening? What is the workaround?

Here is the way I have used CrossOrigin in the controller.

@CrossOrigin("*")
@RestController
@RequestMapping("/api")
public class CustomerController {

Any help is appreciated.

@awesomemypro I'm facing the same error, could you please share the details of solution ? — Krupa
– Krupa, Commented Nov 18, 2020 at 14:50

markusw · Accepted Answer · 2019-11-07 10:18:03Z

1

You are not allowed to call URLs from your scripts that are not found under the same domain that you page was rendered:

For security reasons, browsers restrict cross-origin HTTP requests initiated from scripts. For example, XMLHttpRequest and the Fetch API follow the same-origin policy. This means that a web application using those APIs can only request resources from the same origin the application was loaded from, unless the response from other origins includes the right CORS headers.

Source: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

You actually have 3 Options:

Add the 8080 port (port of your Spring Boots Tomcat server) to your exceptions (see: https://spring.io/guides/gs/rest-service-cors/)
Use a reverse proxy like nginx that routes your requests to the API or serves the Angular resources depending on the request
Serve the Angualr resources from your Spring Boot app

edited Nov 7, 2019 at 10:18

answered Nov 7, 2019 at 7:46

markusw

2,07517 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

awesomemypro Over a year ago

808? My angular app runs on 4200, but I access it through 80 (as mentioned in the docker-compose.yml). The backend runs on 8080.

srikanth r · Accepted Answer · 2019-11-07 07:44:05Z

1

@Cross : will be applied for Single Page it wont be applicable for entire application So I would suggest you to follow the approach as defined in below Similar scenario link: CORS Config. where you can defined the filter for entire application with more control over the configuration for CORS.

And also if you have Spring security integrated with your app you need to handle some more config changes in order to make it work.

Hope this was helpful

answered Nov 7, 2019 at 7:44

srikanth r

3324 silver badges21 bronze badges

Collectives™ on Stack Overflow

CORS errors when deploying Spring Boot and Angular app in Docker

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related