Angular 2, Spring boot , spring security , login form

Question

I have a Front end application that runs on http:// localhost:4200, with angular 2 (I've used angular-cli for generating the project).
The application runs without any problems (I can get and post info from/to database using Angular 2 Http service:

getList () {
    return this._http.get("http:// localhost:8080/").map(res => res.json());
}

On the other hand, I have a Back end application running with spring boot on http:// localhost:8080/ (note the ports), that provide a REST Api for my angular 2 application.

Sending requests from http://localhost:4200/ to http://localhost:8080/ works as expected.

Before I've programmed an application with spring framework & angularJS 1, spring security took care of login and security in the same app (maven project).

Now I have two separate applications that are communicating via http (RESTful Api with spring boot , and front end Api with angular 2)

How can I set my login form and where to put it, and how to configure spring security with my angular 2 application?

Answer 1

When you spin up the Angular Application with Angular CLI, your Angular Pages are served by NodeJs in the backend. You have a couple of options here.

1. The login can be handled at NodeJS server which can in turn invoke Spring Boot application to Authenticate and Authorize.(I think, you might need to do some tweaks like using express server instead of lite server. take a look here https://stackoverflow.com/a/37561973/6785908)

2. After initial development, you can copy over your AngularJS resources to a Spring MVC (Spring Boot) server and use it to serve your pages (as well as the rest APIs), just as you were doing before.

3. Make the Angular App invoke the spring boot Service (I guess , you are using the $http.post to submit the form, if that's the case you can just change the URL so that it can hit spring boot app instead.) For the production deployment, use nginx/httpd to serve the static files (AngularJS/CSS etc) and route/proxy all the dynamic request to the spring boot app.

I would strongly suggest the 3rd option.