SpringSecurity+釘釘免登

問題匯總

1、釘釘免登時(shí)，要通過dingtalk.js獲取一個(gè)只能使用一次的code，用次code在服務(wù)端獲取用戶userid；若需要實(shí)現(xiàn)自動(dòng)登錄，就不能用傳統(tǒng)的用戶名密碼登錄。
2、登錄過程中需要從后端獲取 accesstoken、jsticket、用戶userid，用userid獲取userinfo，當(dāng)accesstoken和jsticket都過期時(shí)（7200秒），四個(gè)參數(shù)皆需要通過網(wǎng)絡(luò)獲取，耗時(shí)較長(zhǎng)。
3、需要使用spring security保護(hù)RESTApi，防止匿名訪問。
4、spring security默認(rèn)表單登錄模式，用ajax 增加復(fù)雜度。

解決方案

解決思路：

1、前端獲取到code時(shí)，用corpid作為username，code作為password，重寫userDetail，用code能獲取到userid時(shí)，表明code有效，并用詞userid創(chuàng)建新用戶，corpid作為密碼，添加User權(quán)限并返回；
2、accesstoken和jsticket使用獨(dú)立的程序定時(shí)獲取，登錄時(shí)只從數(shù)據(jù)庫(kù)取出使用，不從網(wǎng)絡(luò)獲取以減少時(shí)間；前端加入loading動(dòng)畫以提升用戶體驗(yàn)；開啟remeber-me功能，減少登錄。
3、配置springSecurity即可，同時(shí)將登錄事件放置與dd.ready中，防止在釘釘之外的瀏覽器打開訪問。
4、創(chuàng)建form，并使用jQuery填充用戶名及密碼，使用jQuery模擬click登錄。安全性方面，由于corpid公開無(wú)妨，code使用次數(shù)僅有1此且5分鐘有效期，目前暫未使用加密傳遞；

解決步驟

1、引入springsecurity依賴

compile('org.springframework.boot:spring-boot-starter-security')

2、配置websecurityConfigure

@Configuration
@EnableWebSecurity
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {

    private final String KEY="TECHASER";

    //注入userBean
    @Bean
    UserDetailsService customUserService(){
        return new DingtalkUserService();
    }

    //重寫登錄驗(yàn)證
    @Override
    protected void configure(AuthenticationManagerBuilder auth)throws Exception{
        auth.userDetailsService(customUserService());
    }

    @Override
    protected void configure(HttpSecurity http) throws Exception {
        http
                .authorizeRequests()
                .antMatchers(
                        HttpMethod.GET,
                        "/",
                        "/*.html",
                        "/favicon.ico",
                        "/**/*.html",
                        "/**/*.css",
                        "/**/*.js",
                        "/**/*.map",
                        "/**/*.png",
                        "/**/*.jpg"
                ).permitAll()
                .anyRequest().authenticated()
                .and()
                .formLogin()
                .loginPage("/login").defaultSuccessUrl("/app").failureUrl("/login/failed").permitAll()
                .and().logout().logoutUrl("/logout").logoutSuccessUrl("/login").permitAll()
                .and().exceptionHandling().accessDeniedPage("/403")
                .and().csrf().disable()
                .rememberMe().rememberMeParameter("rememberMe").tokenValiditySeconds(5000).key(KEY);
        http.headers().cacheControl();
    }
}

登錄驗(yàn)證方法：重寫 loadUserByUsername即可

@Service
public class DingtalkUserService implements UserDetailsService {

    @Autowired
    private AuthService authService;

    /**
     * 使用前臺(tái)傳來(lái)的 免登code,從后端獲取userId，從error_code=0判斷code是否有效,corpId作為密碼，并添加ROLE_USER權(quán)限
     * corpId 前面添加 {noop} ,不使用密碼加密
     * @param username
     * @return
     * @throws UsernameNotFoundException
     */
    @Override
    public UserDetails loadUserByUsername(String username) throws UsernameNotFoundException {
        String code=username;
        String password="{noop}"+ Company.CORP_ID;
        UserResponse userResponse= null;
        try {
            userResponse = AuthHelper.getUserCode(authService.autoGetAccessToken(),code);
        } catch (IOException e) {
            e.printStackTrace();
        }
        System.out.println("errorCode:"+userResponse.getErrcode());
        if(userResponse.getErrcode().equals("0")){
            List<GrantedAuthority> authorities=new ArrayList<GrantedAuthority>();
            authorities.add(new SimpleGrantedAuthority("ROLE_USER"));
            System.out.println("password is "+password);
            return  new User(userResponse.getUserid(),password,authorities);
        }else {
            return new User("user","{noop}not",new ArrayList<>());
        }
    }
}

登錄頁(yè)面

<!DOCTYPE html>
<html xmlns:th="www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>Login</title>
    <script th:inline="javascript" type="text/javascript">
        /*<![CDATA[*/
        //在此拿到corpid
        var corpid = [[${corpid}]];
        /*]]>*/
    </script>
</head>
<body>

<div style="top:200px;">
    <form th:action="@{/login}" th:method="post">
        <input type="text" name="username" id="username" hidden>
        <input type="password" name="password" id="password" hidden>
        <input type="text" name="remember-me" checked value="TECHASER" hidden>
        <div class='btn-container'>
            <button class='btn btn--shockwave is-active' type="submit" style="color: #0c5460" id="submit-btn">
                點(diǎn)擊用釘釘?shù)卿?            </button>
        </div>
    </form>
</div>

<script type="text/javascript" th:src="@{http://g.alicdn.com/dingding/open-develop/1.6.9/dingtalk.js}"></script>
<script type="text/javascript" th:src="@{/jquery/jquery-3.3.1.min.js}"></script>

<script type="text/javascript">
    $(document).ready(function () {
        dd.ready(function () {
            dd.runtime.permission.requestAuthCode({
                corpId: corpid,
                onSuccess: function (info) {
                    $("#username").val(info.code);
                    $("#password").val(corpid);
                    $("#submit-btn").click().delay(2000);
                },
                onFail: function (err) {
                    alert('fail: ' + JSON.stringify(err));
                }
            });
        });
    });
</script>
</body>
</html>

需要通過網(wǎng)絡(luò)獲取的參數(shù)諸如accessToken jsTicket Userid等，可參考 http://open.dingtalk.com/

后續(xù)需要解決的問題：

1、登錄速度需要進(jìn)一步優(yōu)化
2、remember-me開啟后，需要在頁(yè)面內(nèi)提供可供退出登錄的連接
3、加密傳出數(shù)據(jù)，啟用https
4、可以看到 crsf處于disable狀態(tài)，需開啟

繞過的問題

使用 ajax方式登錄時(shí)，可以從控制臺(tái)看出已經(jīng)登錄，并返回了需要打開的文檔，但未能跳轉(zhuǎn)頁(yè)面，不明原因。

2018年8月10日補(bǔ)充更新：

解決了登錄緩慢的問題

原先登錄速度方面，由于使用了spring security，當(dāng)webApp中請(qǐng)求過多時(shí)，造成認(rèn)證授權(quán)的內(nèi)容過多，容易發(fā)生阻塞：

2018-08-10 15:27:47.665 DEBUG 18456 --- [nio-8089-exec-1] o.s.s.w.u.matcher.AntPathRequestMatcher  : Checking match of request : '/app'; against '/'
2018-08-10 15:27:47.666 DEBUG 18456 --- [nio-8089-exec-1] o.s.s.w.u.matcher.AntPathRequestMatcher  : Checking match of request : '/app'; against '/img/*'
2018-08-10 15:27:47.666 DEBUG 18456 --- [nio-8089-exec-1] o.s.s.w.u.matcher.AntPathRequestMatcher  : Checking match of request : '/app'; against '/*.html'
2018-08-10 15:27:47.666 DEBUG 18456 --- [nio-8089-exec-1] o.s.s.w.u.matcher.AntPathRequestMatcher  : Checking match of request : '/app'; against '/favicon.ico'
2018-08-10 15:27:47.666 DEBUG 18456 --- [nio-8089-exec-1] o.s.s.w.u.matcher.AntPathRequestMatcher  : Checking match of request : '/app'; against '/**/*.html'
2018-08-10 15:27:47.666 DEBUG 18456 --- [nio-8089-exec-1] o.s.s.w.u.matcher.AntPathRequestMatcher  : Checking match of request : '/app'; against '/**/*.css'
2018-08-10 15:27:47.666 DEBUG 18456 --- [nio-8089-exec-1] o.s.s.w.u.matcher.AntPathRequestMatcher  : Checking match of request : '/app'; against '/**/*.js'
2018-08-10 15:27:47.666 DEBUG 18456 --- [nio-8089-exec-1] o.s.s.w.u.matcher.AntPathRequestMatcher  : Checking match of request : '/app'; against '/**/*.map'
2018-08-10 15:27:47.666 DEBUG 18456 --- [nio-8089-exec-1] o.s.s.w.u.matcher.AntPathRequestMatcher  : Checking match of request : '/app'; against '/**/*.png'
2018-08-10 15:27:47.666 DEBUG 18456 --- [nio-8089-exec-1] o.s.s.w.u.matcher.AntPathRequestMatcher  : Checking match of request : '/app'; against '/**/*.jpg'
2018-08-10 15:27:47.666 DEBUG 18456 --- [nio-8089-exec-1] o.s.s.w.u.matcher.AntPathRequestMatcher  : Checking match of request : '/app'; against '/**/*.eot'
2018-08-10 15:27:47.666 DEBUG 18456 --- [nio-8089-exec-1] o.s.s.w.u.matcher.AntPathRequestMatcher  : Checking match of request : '/app'; against '/**/*.ttf'
2018-08-10 15:27:47.666 DEBUG 18456 --- [nio-8089-exec-1] o.s.s.w.u.matcher.AntPathRequestMatcher  : Checking match of request : '/app'; against '/**/*.woff'
2018-08-10 15:27:47.666 DEBUG 18456 --- [nio-8089-exec-1] o.s.s.w.u.matcher.AntPathRequestMatcher  : Checking match of request : '/app'; against '/**/*.woff2'
2018-08-10 15:27:47.666 DEBUG 18456 --- [nio-8089-exec-1] o.s.s.w.u.matcher.AntPathRequestMatcher  : Checking match of request : '/app'; against '/**/*.svg'
2018-08-10 15:27:47.666 DEBUG 18456 --- [nio-8089-exec-1] o.s.s.w.u.matcher.AntPathRequestMatcher  : Checking match of request : '/app'; against '/pages/*'

在請(qǐng)求靜態(tài)資源時(shí)，也會(huì)做驗(yàn)證，雖然WebSecurityConfigure中配置忽略：

@Override
    public void configure(WebSecurity web) throws Exception {
        web
                .ignoring()
                .antMatchers("/",
                        "/img/*",
                        "/*.html",
                        "/favicon.ico",
                        "/**/*.html",
                        "/**/*.css",
                        "/**/*.js",
                        "/**/*.map",
                        "/**/*.png",
                        "/**/*.jpg",
                        "/**/*.eot",
                        "/**/*.ttf",
                        "/**/*.woff",
                        "/**/*.woff2",
                        "/**/*.svg",
                        "/pages/*",
                        "/test4"
                );
    }

總是在某些請(qǐng)求是卡住五六秒，導(dǎo)致從登陸頁(yè)面跳轉(zhuǎn)至應(yīng)用首頁(yè)時(shí)發(fā)生白屏現(xiàn)象。

解決辦法是，盡量減少請(qǐng)求的次數(shù)：
1、合并css、js文件
2、開源框架使用cdn 國(guó)內(nèi)推薦使用：https://www.bootcdn.cn
3、頁(yè)面中的ajax請(qǐng)求放到頁(yè)面底部 window.onload函數(shù)中，待頁(yè)面框架加載并渲染完成后開始執(zhí)行。

此時(shí)頁(yè)面訪問速度明細(xì)提升，從最初的5~10秒到現(xiàn)在1秒內(nèi)加載完成。

最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容