如何使用angularjs登录spring security

Question

我想使用 angularjs 发送用户名和密码登录到 spring security 而不是普通的 login.jsp 。 我有一些像下面这样的配置：

-security_config.xml

<http use-expressions="true" auto-config="true">
        <access-denied-handler error-page="/403page" />
        <anonymous enabled="false" />
        <intercept-url pattern="/api/**" access="hasRole('ROLE_USER')" />
        <custom-filter ref="resourceServerFilter" before="PRE_AUTH_FILTER" />
        <access-denied-handler ref="oauthAccessDeniedHandler" />
        <form-login login-page='/login' username-parameter="username"
            password-parameter="password" default-target-url="/api/users"
            authentication-failure-url="/login?authfailed" />
        <logout logout-success-url="/login?logout" />
    </http>
<authentication-manager alias="authenticationManager"
        xmlns="http://www.springframework.org/schema/security">
        <authentication-provider>
            <password-encoder ref="encoder" />
            <jdbc-user-service data-source-ref="dataSource"
                users-by-username-query="select username,password, enabled from users where username=?"
                authorities-by-username-query="select username, role from user_roles where username =?  " />
        </authentication-provider>
    </authentication-manager>
<beans:bean id="encoder"
        class="org.springframework.security.crypto.bcrypt.BCryptPasswordEncoder">
        <beans:constructor-arg name="strength" value="10" />
    </beans:bean>

-登录控制器.java

@RequestMapping("login")
    public ModelAndView getLoginForm(@RequestParam(required = false) String authfailed, String logout,String denied) {
        String message = "";
        if (authfailed != null) {
            message = "Invalid username of password, try again !";
        } else if (logout != null) {
            message = "Logged Out successfully, login again to continue !";
        } else if (denied != null) {
            message = "Access denied for this user !";
        }
        return new ModelAndView("loginForm", "message", message);
    }

    @RequestMapping("user")
    public String geUserPage() {
        return "user";
    }

-loginForm.jsp

<form method="post" action="<c:url value='j_spring_security_check' />">

    <table>
                    <tr>
                        <td colspan="2" style="color: red">${message}</td>

                    </tr>
                    <tr>
                        <td>User Name:</td>
                        <td><input type="text" name="username" />
                        </td>
                    </tr>
                    <tr>
                        <td>Password:</td>
                        <td><input type="password" name="password" />
                        </td>
                    </tr>
                    <tr>
                        <td>&nbsp;</td>
                        <td><input type="submit" value="Login" />
                        </td>

                    </tr>
                </table>
            </form>

当我这样使用时，我可以正常登录，但我不想使用上面的 loginForm.jsp。 我想通过angularjs 使用restful web 服务将用户名和密码发送到spring security 进行登录。 我能怎么做？ 请帮我！

Answer 1

在您的示例中，您不需要控制器 (LoginController.java) 来处理安全性，Spring Security 会为您完成。 删除此代码。

在 AngularJs 中，你需要发送一个 POST 请求来登录。 像这样 ：

        var data = "username="+username+"&password="+password+"&submit=Login";

        $http({
            method: 'POST',
            url: $window.domaineName + 'j_spring_security_check',
            data: data,
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
              }
        })  
        .success(function(data, status){
             //login success
        })
        .error(function(data, status){
            // login failure
        })

为了注销，您需要发送另一个 Http POST 请求：

       $http({
            method: 'POST',
            url: $window.domaineName + 'j_spring_security_logout',
        })  
        .success(function(data, status){
            // logout success
        })
        .error(function(data, status){
            // logout failure
        })