how to make angularjs and spring security login page?

Question

This is my login controller:

app.controller('loginCtrl', function($scope,$http,$state,$location,$q) {

      var self = this;
        self.user={uname:'',password:''};
        self.users=[];
    this.postForm=function(user)
    {
         var deferred = $q.defer();
            $http.post('http://localhost:8080/HB2/login/', user)
                .then(
                function (response) {
                    deferred.resolve(response.data);
                    console.log("Success");
                },
                function(errResponse){
                    console.error('Invalid Username/Password');
                    deferred.reject(errResponse);
                }
            );
            return deferred.promise;
        };

and this is my rest login api:

@RequestMapping(value ="/login/", method = RequestMethod.POST,produces= MediaType.APPLICATION_JSON_VALUE)
    public ResponseEntity<Void> loginUser(@RequestBody loginModel user,    UriComponentsBuilder ucBuilder) {


        if ((user.getUname().equals("kartik"))&&(user.getPassword().equals("gogia"))) {

            return new ResponseEntity<Void>(HttpStatus.OK);
        }
        else
        return new ResponseEntity<Void>(HttpStatus.NO_CONTENT);
    }

Help me how to do login and to transfer to the home page.

Answer 1

You can used the login form as Rest Url like as:

@Override
    protected void configure(HttpSecurity http) throws Exception {
        http
            .formLogin()
                .loginProcessingUrl("/app/authentication/oauth")
                .usernameParameter("j_username")
                .passwordParameter("j_password")
                .permitAll()
                .and()
            .logout()
                .logoutUrl("/app/logout")
                .deleteCookies("JSESSIONID")
                .permitAll()
                .and()
            .csrf()
                .disable()
            .authorizeRequests()
                .antMatchers("/resources/**").permitAll()
                .antMatchers("/api/**").authenticated();
    }

Now when you can request from angular js controller to /app/authentication/oauth with j_username and j_password then it will automatically goes to you ApplicationDetailService.

Answer 2

You can try below code

    @RequestMapping(value="/login", method=RequestMethod.POST)
    public ModelAndView loginUser(@RequestBody loginModel user,  HttpServletRequest request, HttpServletResponse response){   
        String returnView = "home";//home.html

        try{    
            //try validating user..throw excception if user doesn't have access..                       
        }catch (InvalidUserException e){
            returnView = "error";//error.html
        }       
        ModelAndView mv = new ModelAndView(returnView);
        return mv;
    }