1. 程式人生 > 程式設計 >手把手教你用Java實現一套簡單的鑑權服務

手把手教你用Java實現一套簡單的鑑權服務

前言

時遇javaEE作業,題目要求寫個簡單web登入程式,按照老師的意思是用servlet、jsp和jdbc完成。本著要麼不做,要做就要做好的原則,我開始著手完成此次作業(其實也是寫實訓作業的使用者鑑權部分),而之前寫專案的時候也有相關經驗,這次正好能派上用場。

一、何為鑑權服務

引用百度百科的話說

鑑權(authentication)是指驗證使用者是否擁有訪問系統的權利。

鑑權包括兩個方面:

使用者鑑權,網路對使用者進行鑑權,防止非法使用者佔用網路資源。
網路鑑權,使用者對網路進行鑑權,防止使用者接入了非法的網路,被騙取關鍵資訊。

而我們這裡的鑑權主要指使用者鑑權,即如何確認“你是你”。最簡單的體現便是平常用的使用者登入登出。

現今大部分系統都會有自己的鑑權服務,它是使用者與系統互動的第一步,系統需要一系列步驟明白你是誰,你可以做哪些事,明白了這些之後它才能更好的服務於你。

二、利用servlet+jdbc實現簡單的使用者登入程式

1.明確思路

首先,我們要仔細思考一下我們到底需要什麼?

先讓我們回想一下一般的登入是如何做的呢?

對於網頁,首先會出現一個登入頁面,然後呢,輸入賬號密碼,點選登入,就會彈出成功/失敗的頁面。

那如何去判斷成功/失敗呢?

思考一下,最簡單的方法便是拿到前端傳來的資料之後便將其拿到資料中去查,看看密碼是不是一樣,然後給前端回覆說——我找到了,他就是XXX或者我找不到他的記錄,讓他重新輸入賬號密碼。

然後前端對此回覆做出相應的操作,比如登入成功便跳轉到首頁,失敗讓使用者重新輸入。

2.手把手教你實現一個簡單的web登入程式

出於某些原因,我這裡手把手教你如何實現一個簡單的web登入程式。

①建立web專案

開啟idea,新建一個web專案

在這裡插入圖片描述

這裡為了方便jar包的管理,選擇maven結構的專案(至於什麼是maven結構,不懂的可以百度,瞭解概念即可),然後選擇從原型建立,選擇webapp(這裡只是方便,你也可以選擇空專案,不過會費點時間)。

在這裡插入圖片描述

點選下一步,輸入專案名稱

在這裡插入圖片描述

這裡選擇相應的maven,idea裡有自帶的maven和jar包倉庫,不過我是自己去官網下了一個(不下也完全可以)。

在這裡插入圖片描述

選擇完成,這樣一個最簡單的專案結構就出來了。

在這裡插入圖片描述

接下來需要配置一下pom.xml,因為要用到jdbc和tomcat的jar包(畢竟都是呼叫人家的介面(笑哭))

<dependencies>
    <dependency>
      <groupId>org.apache.tomcat.embed</groupId>
      <artifactId>tomcat-embed-core</artifactId>
      <version>9.0.37</version>
    </dependency>
    <dependency>
      <groupId>mysql</groupId>
      <artifactId>mysql-connector-java</artifactId>
      <version>8.0.20</version>
    </dependency>
  </dependencies>

(加在project標籤裡就行),上面配置的意思就是匯入兩個第三方工具包

②編寫簡單的登入頁面

這裡我既想要好看,又想偷懶,所以用了layui框架的模板

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>後臺管理-登陸</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="../lib/layui-v2.6.3/css/layui.css" media="all">
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <style>
        .main-body {top:50%;left:50%;position:absolute;-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);transform:translate(-50%,-50%);overflow:hidden;}
        .login-main .login-bottom .center .item input {display:inline-block;width:227px;height:22px;padding:0;position:absolute;border:0;outline:0;font-size:14px;letter-spacing:0;}
        .login-main .login-bottom .center .item .icon-1 {background:url(../images/icon-login.png) no-repeat 1px 0;}
        .login-main .login-bottom .center .item .icon-2 {background:url(../images/icon-login.png) no-repeat -54px 0;}
        .login-main .login-bottom .center .item .icon-3 {background:url(../images/icon-login.png) no-repeat -106px 0;}
        .login-main .login-bottom .center .item .icon-4 {background:url(../images/icon-login.png) no-repeat 0 -43px;position:absolute;right:-10px;cursor:pointer;}
        .login-main .login-bottom .center .item .icon-5 {background:url(../images/icon-login.png) no-repeat -55px -43px;}
        .login-main .login-bottom .center .item .icon-6 {background:url(../images/icon-login.png) no-repeat 0 -93px;position:absolute;right:-10px;margin-top:8px;cursor:pointer;}
        .login-main .login-bottom .tip .icon-nocheck {display:inline-block;width:10px;height:10px;border-radius:2px;border:solid 1px #9abcda;position:relative;top:2px;margin:1px 8px 1px 1px;cursor:pointer;}
        .login-main .login-bottom .tip .icon-check {margin:0 7px 0 0;width:14px;height:14px;border:none;background:url(../images/icon-login.png) no-repeat -111px -48px;}
        .login-main .login-bottom .center .item .icon {display:inline-block;width:33px;height:22px;}
        .login-main .login-bottom .center .item {width:288px;height:35px;border-bottom:1px solid #dae1e6;margin-bottom:35px;}
        .login-main {width:428px;position:relative;float:left;}
        .login-main .login-top {height:117px;background-color:#148be4;border-radius:12px 12px 0 0;font-family:SourceHanSansCN-Regular;font-size:30px;font-weight:400;font-stretch:normal;letter-spacing:0;color:#fff;line-height:117px;text-align:center;overflow:hidden;-webkit-transform:rotate(0);-moz-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0);}
        .login-main .login-top .bg1 {display:inline-block;width:74px;height:74px;background:#fff;opacity:.1;border-radius:0 74px 0 0;position:absolute;left:0;top:43px;}
        .login-main .login-top .bg2 {display:inline-block;width:94px;height:94px;background:#fff;opacity:.1;border-radius:50%;position:absolute;right:-16px;top:-16px;}
        .login-main .login-bottom {width:428px;background:#fff;border-radius:0 0 12px 12px;padding-bottom:53px;}
        .login-main .login-bottom .center {width:288px;margin:0 auto;padding-top:40px;padding-bottom:15px;position:relative;}
        .login-main .login-bottom .tip {clear:both;height:16px;line-height:16px;width:288px;margin:0 auto;}
        body {background:url(../images/loginbg.png) 0% 0% / cover no-repeat;position:static;font-size:12px;}
        input::-webkit-input-placeholder {color:#a6aebf;}
        input::-moz-placeholder {/* Mozilla Firefox 19+ */            color:#a6aebf;}
        input:-moz-placeholder {/* Mozilla Firefox 4 to 18 */            color:#a6aebf;}
        input:-ms-input-placeholder {/* Internet Explorer 10-11 */            color:#a6aebf;}
        input:-webkit-autofill {/* 取消Chrome記住密碼的背景顏色 */            -webkit-box-shadow:0 0 0 1000px white inset !important;}
        html {height:100%;}
        .login-main .login-bottom .tip {clear:both;height:16px;line-height:16px;width:288px;margin:0 auto;}
        .login-main .login-bottom .tip .login-tip {font-family:MicrosoftYaHei;font-size:12px;font-weight:400;font-stretch:normal;letter-spacing:0;color:#9abcda;cursor:pointer;}
        .login-main .login-bottom .tip .forget-password {font-stretch:normal;letter-spacing:0;color:#1391ff;text-decoration:none;position:absolute;right:62px;}
        .login-main .login-bottom .login-btn {width:288px;height:40px;background-color:#1E9FFF;border-radius:16px;margin:24px auto 0;text-align:center;line-height:40px;color:#fff;font-size:14px;letter-spacing:0;cursor:pointer;border:none;}
        .login-main .login-bottom .center .item .validateImg {position:absolute;right:1px;cursor:pointer;height:36px;border:1px solid #e6e6e6;}
        .footer {left:0;bottom:0;color:#fff;width:100%;position:absolute;text-align:center;line-height:30px;padding-bottom:10px;text-shadow:#000 0.1em 0.1em 0.1em;font-size:14px;}
        .padding-5 {padding:5px !important;}
        .footer a,.footer span {color:#fff;}
        @media screen and (max-width:428px) {.login-main {width:360px !important;}
            .login-main .login-top {width:360px !important;}
            .login-main .login-bottom {width:360px !important;}
        }
    </style>
</head>
<body>
<div class="main-body">
    <div class="login-main">
        <div class="login-top">
            <span>LayuiMini後臺登入</span>
            <span class="bg1"></span>
            <span class="bg2"></span>
        </div>
        <form class="layui-form login-bottom" action="/login" method="post">
            <div class="center">
                <div class="item">
                    <span class="icon icon-2"></span>
                    <input type="text" name="uname" lay-verify="required"  placeholder="請輸入登入賬號" maxlength="24"/>
                </div>

                <div class="item">
                    <span class="icon icon-3"></span>
                    <input type="password" name="pwd" lay-verify="required"  placeholder="請輸入密碼" maxlength="20">
                    <span class="bind-password icon icon-4"></span>
                </div>

            </div>
            <div class="tip">
                <span class="icon-nocheck"></span>
                <span class="login-tip">保持登入</span>
                <a href="javascript:" class="forget-password">忘記密碼?</a>
            </div>
            <div class="layui-form-item" style="text-align:center; width:100%;height:100%;margin:0px;">
                <button class="login-btn" type="submit" lay-submit="" lay-filter="login">立即登入</button>
            </div>
        </form>
    </div>
</div>
<div class="footer">
    ©版權所有 2014-2018 叄貳柒工作室<span class="padding-5">|</span><a target="_blank" href="http://www.miitbeian.gov.cn">粵ICP備16006642號-2</a>
</div>
<script src="../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script>
    //原本想用json的post傳送,結果發現後端資料得自己解析,為了降低難度,直接用form表單的post提交,這樣後端直接拿資料即可(不然還得解析Json資料)
    // layui.use(['form','jquery'],function () {
    //     var $ = layui.jquery,//         form = layui.form,//         layer = layui.layer;
    //
    //     // 登入過期的時候,跳出ifram框架
    //     if (top.location != self.location) top.location = self.location;
    //
    //     $('.bind-password').on('click',function () {
    //         if ($(this).hasClass('icon-5')) {
    //             $(this).removeClass('icon-5');
    //             $("input[name='pwd']").attr('type','password');
    //         } else {
    //             $(this).addClass('icon-5');
    //             $("input[name='pwd']").attr('type','text');
    //         }
    //     });
    //
    //     $('.icon-nocheck').on('click',function () {
    //         if ($(this).hasClass('icon-check')) {
    //             $(this).removeClass('icon-check');
    //         } else {
    //             $(this).addClass('icon-check');
    //         }
    //     });
    //
    //     // 進行登入操作
    //     form.on('submit(login)',function (data) {
    //         data = data.field;
    //         if (data.uname == '') {
    //             layer.msg('使用者名稱不能為空');
    //             return false;
    //         }
    //         if (data.pwd == '') {
    //             layer.msg('密碼不能為空');
    //             return false;
    //         }
    //         $.ajax({
    //             url:'/login',//             method:'post',//             data:data,//             dataType:'JSON',//             success:function(res){
    //                 if (res.msg==='登入成功'){
    //                     layer.msg('登入成功',function () {
    //                         window.location = '../index.html';
    //                     });
    //                 }else {
    //                     layer.msg("登入失敗");
    //                 }
    //             },//             error:function (data) {
    //             }
    //         }) ;
    //
    //
    //         return false;
    //     });
    // });
</script>
</body>
</html>

當然以上程式碼有一部分註釋掉了,原因是如果用JSON格式傳送post請求,後端的servlet(準確的說是Tomcat的解析)並沒有幫我們解析封裝這部分資料,所以我們無法直接get到,得自己另外解析資料,當然也有一些第三方的工具包可以幫我們做這些事情(如阿里的fastjson等),這裡為了使其更加簡單,所以採用表單提交post請求的方式,這樣解析的工作就不用我們做了。

效果是這樣的:

在這裡插入圖片描述

如果你沒學過layui或者對前端不太行,你也可以這樣

<!DOCTYPE html>
<htmllang="en">
<head>
    <meta charset="UTF-8">
    <title>使用者登入</title>
</head>
<body>
<form action="/login" method="post">
    使用者名稱:<input type="text" name="uname">
    密碼:<input type="password" name="pwd">
    <input type="submit" value="login">
</form>
 
</body>
</html>

一樣的功能,不過看上去的效果就不怎麼好了。

③編寫servlet程式

當有了前端的頁面,看上去好了很多,但實質校驗的程式我們還沒有寫。

想象一下我們就是後端程式,當前端的資料歷經艱險,從錯綜複雜的網路中到達我們的伺服器,然後經過系統分發到相應埠,這時恰在此埠的tomcat程式接受到了HTTP請求並對其封裝,經過一系列騷操作後分發到了我們手中,而我們要做的就是拿著這個封裝好的請求進行校驗操作,然後對返回物件進行相應修改。

而這也是servlet類所需要做的(如果你想更好的理解servlet,可以看看bravo1988的回答),

package com.dreamchaser.loginTest;

import com.dreamchaser.loginTest.mapper.UserMapper;

import javax.servlet.ServletException;
import javax.servlet.ServletOutputStream;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

public class LoginServlet extends HttpServlet {
    static UserMapper userMapper=UserMapper.getUserMapper();

    @Override
    protected void doPost(HttpServletRequest request,HttpServletResponse response) throws ServletException,IOException {
        doGet(request,response);
    }

    @Override
    protected void doGet(HttpServletRequest req,HttpServletResponse resp) throws ServletException,IOException {
        String uname=req.getParameter("uname");
        String pwd=req.getParameter("pwd");
        ServletOutputStream outputStream = resp.getOutputStream();
        String result;
        if (pwd.equals(userMapper.getPwdByName(uname))){
            //響應
            result="登入成功";
        }else {
            result="登入失敗";
        }
        outputStream.write(result.getBytes());
    }
}

你可能會疑惑這個UserMapper是什麼,別急,後面會介紹。

④封裝jdbc操作,編寫簡單的資料庫連線池

在操作資料庫之前,最好寫個簡單的資料庫連線池。一個是簡化我們的操作,一個是節省開銷,提高效能(Connection是個非常耗費資源的物件,頻繁的建立和回收將會是一筆巨大的開銷)

package com.dreamchaser.loginTest.utils;

import java.sql.Connection;
import java.sql.Driver;
import java.sql.DriverManager;
import java.sql.SQLException;
import java.util.HashMap;
import java.util.Map;

/**
 * 一個簡單的資料庫連線池
 */
public class Pool {
    private static Driver driver;

    static {
        try {
            driver = new com.mysql.cj.jdbc.Driver();
            DriverManager.registerDriver(driver);
        } catch (SQLException throwables) {
            throwables.printStackTrace();
        }
    }

    private static Map<Connection,Integer> pool=new HashMap<>();
    private static String url="jdbc:mysql://localhost:3306/depository?serverTimezone=Asia/Shanghai";
    private static String user="root";
    private static String password="jinhaolin";


    /**
     * 從連線池中獲取一個空閒連線,如果沒有則建立一個新的連線返回
     * synchronized確保併發請求時,資料庫連線的正確性
     * @return
     */
    public synchronized static Connection getConnection(){
        for (Map.Entry entry:pool.entrySet()){
            if (entry.getValue().equals(1)) {
                entry.setValue(0);
                return (Connection) entry.getKey();
            }
        }

        Connection connection=null;
        try {
            connection=DriverManager.getConnection(url,user,password);
            pool.put(connection,0);
        } catch (SQLException throwables) {
            throwables.printStackTrace();
        }
        return connection;
    }

    /**
     * 釋放connection連線物件
     * @param connection
     */
    public synchronized static void releaseConnection(Connection connection){
        pool.put(connection,1);
    }

}

當然上述實現非常簡陋,併發效能也不是很好,高併發時可能還會發生OOM,不過湊活著用吧(笑哭)。

⑤操作資料庫

package com.dreamchaser.loginTest.mapper;

import com.dreamchaser.loginTest.utils.Pool;

import java.sql.*;

/**
 * 查詢使用者的Mapper
 */
public class UserMapper {
    static UserMapper userMapper=new UserMapper();
    //單例
    public static UserMapper getUserMapper(){
        return userMapper;
    }
    private UserMapper(){
    }
    //預設資料庫中使用者名稱唯一
    public String getPwdByName(String name){
        Connection connection= Pool.getConnection();
        try {
            PreparedStatement statement=connection.prepareStatement("select pwd from `user` where uname=?");
            statement.setString(1,name);
            ResultSet rs=statement.executeQuery();
            //resultSet初始下標無法訪問,要呼叫next方法後移一位
            rs.next();
            return rs.getString(1);
        } catch (SQLException throwables) {
            throwables.printStackTrace();
        }
        return null;
    }
}

這裡採用單例的設計模式,保證UserMapper物件只有一個。(非常簡陋,實現也不優雅,看著自己的程式碼,突然感覺框架好方便啊(GAuoRxKdDN笑哭))

這裡的作用就是根據使用者名稱查詢密碼。

⑥配置web.xml

雖然寫了servlet,但是tomcat並不知道你這個servlet的類在哪啊,所以必須讓tomcat知道,配置web.xml的目的就是通知tomcat在哪(更準確的說是servlet容器)的一種方式(當然也可以用註解)。
配置如下:

<!DOCTYPE web-app PUBLIC
 "-//Sun Microsystems,Inc.//DTD Web Application 2.3//EN"
 "http://java.sun.com/dtd/web-app_2_3.dtd" >

<web-app>
  <display-name>Archetype Created Web Application</display-name>
  <servlet>
    <servlet-name>LoginServlet</servlet-name>
    <servlet-class>com.dreamchaser.loginTest.LoginServlet</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>LoginServlet</servlet-name>
    <url-pattern>/login</url-pattern>
  </servlet-mapping>

</web-app>

servlet-class裡寫你這個Servlet類的路徑即可。

⑦idea執行配置

idea配置還是比較方便的。

點選編輯配置,

在這裡插入圖片描述

點選+(新增按鈕),選擇tomcat伺服器(選哪個都可以,我選了tomcat本地)

在這裡插入圖片描述

然後選擇相應的伺服器程式,配置專案訪問的埠,就是tomcat在哪個埠執行(注意不要佔用已有埠,預設8080,我這裡是因為8080被佔了,所以用了9090)

在這裡插入圖片描述

這裡還得配置一下工件,因為專案要執行一般有兩種方式:

  • 一種是打成war包放在tomcat的webapps目錄下
  • 一種是打成jar包直接執行(SpringBoot就是用這種方式,因為它內建tomcat)

在這裡插入圖片描述

這裡工件的作用就是打成war包,至於每次執行部署?idea都會幫你搞定!是不是很方便?

這裡那個應用程式上下文的作用就是給訪問路徑加個字首

在這裡插入圖片描述

一般直接寫成"/"就行了,這樣我們要訪問login.html,只需訪問http://localhost:9090/login.html就行了,是不是很方便?

⑧執行程式

點選執行

在這裡插入圖片描述

訪問localhost:9090/login.html(我因為是在login.html外面放了一個pages包,所以路徑是http://localhost:9090/pages/login.html)

在這裡插入圖片描述

訪問成功,試試賬號密碼

在這裡插入圖片描述

我現在資料庫裡只有root這一條資料,試試效果

輸入錯誤的密碼

在這裡插入圖片描述

輸入正確的密碼

在這裡插入圖片描述

到這裡,我們鬆了一口氣,終於完成了簡單的登入功能。

三、回顧

別急,我們雖然實現了登入這個功能,但是這個實現是在太簡陋了,各方各面都沒考慮,返回頁面也只登入成功,登入失敗的提示。
我們回顧一下,仔細想想有哪些問題。

1.密碼未加密裸奔

我們在做上面的登入時查詢時,密碼是查詢出來直接比對的,也就是說資料庫的密碼是明文儲存,而註冊登入請求中密碼都是明文傳輸,這樣做的安全性極低,當黑客破解進入了你的資料庫時,你的資料庫的賬戶資訊都在“裸奔”,比如前些年的csdn密碼洩露事件

在這裡插入圖片描述

如果我們儲存在資料庫的使用者密碼是加密過的,那麼就算黑客進入了你的資料庫,損失也不會像明文儲存那樣大。

2.登入資訊未儲存

對於這個登入操作,登入成功後並未做其他處理,也就是說每次訪問都要登入(如果對請求進行了攔截),或者這個登入操作就是擺設,使用者訪問其他資源依舊暢通無阻。

3.對於其他資源並未進行許可權管理

對於其他資源,如果不進行許可權管理,那麼登入認證便失去了意義,不如做成一個靜態網頁來的省事。

四、優化設計

針對上述缺點,我們可以進行以下改進:

1.密碼加密儲存

針對密碼未加密裸奔的問題,我們可以選擇在註冊的時候對密碼進行加密,然後儲存;對於登入功能,我們對前端傳過來的密碼進行加密,再根據這個密碼去資料庫中取資料,這樣我們就實現了對密碼的加密儲存

2.儲存登入資訊

對於登入操作,我們必須記錄下此次登入狀態,並在該使用者繼續訪問其他資源時予以放行,避免使用者多次進行登入操作

3.對資源進行管理

對於系統資源我們必須進行管理,在使用者沒有相應許可權時拒絕使用者的訪問請求,這個可以用過濾器或者SpringBoot的攔截器實現。

五、關於鑑權問題

在正式講思路之前,我還是想聊聊鑑權問題。

1.Cookie/Session機制

關於這個問題我不得不說說cookie/session機制(想了解的具體可以看這篇cookie和session的詳解與區別)。

總的來說,就是瀏覽器中有個叫做cookie的東西(其實就是個檔案),它可以用來儲存一些資訊,每次傳送請求時,瀏覽器會自動把cookie欄位資訊加在請求頭裡傳送出去

在這裡插入圖片描述

這有什麼用呢?

學過計算機網路的人應該都清楚我們的http請求是無法儲存狀態的,通俗點來講就是這次的請求無法知道上次的請求是什麼,而這也對一些場景帶來的一些不便,就比如說登入,我們就需要儲存上次登入的資訊。

可http請求無法儲存狀態,所以我們必須把一些資訊寫入到下次的請求裡,保證伺服器知道之前的關鍵資訊,以便對之後的請求做出特定的操作。

而cookie便是解決這個問題而出現的,當我們需要儲存一些資訊(狀態),就可以把資訊存入cookie,瀏覽器每次傳送請求時都會把cookie放在請求頭中(但這個要注意跨域問題,cookie在遇到跨域訪問時會失效,不過這個無關此次主題,就不細講了,感興趣的自行百度吧)。

總而言之,cookie就是儲存在瀏覽器(客戶端)的資料(檔案),每次訪問時會帶上對應的cookie。

而session是什麼呢?
session和cookie類似,也是用來存放資訊的,不過它是放在伺服器上的。不過呢,session的本質是存在於伺服器記憶體中的物件,閱讀原始碼我們可以發現其對應的就是一個ConcurrentMap(執行緒安全的map容器)

在這裡插入圖片描述

每一個客戶端會對應服務端一個session物件,而如何得到的關鍵就在於cookie中的JSESSIONID(tomcat預設是這個名字,名稱可以變,但用法是一樣的),其值便對應這map容器的鍵,而map的值便是session物件。這樣每次使用者傳送請求來時,伺服器就能準確的找到對應的session物件了。

在這裡插入圖片描述

2.用Cookie/Session解決鑑權問題?

明白了Cookie/Session的機制以後,我們不難設計出一套簡單的登入方案——登入成功後在對應的session物件中存放User資訊並設定失效時間,每次訪問資源都看看session中有沒有對應user物件,如果有就說明之前登入過了,直接通過即可,否則說明未登入,此時可以跳轉至登入頁面讓使用者進行登入。

這一切看似都很完美,從某種角度上來說確實如此,但它沒有缺點嗎?

Cookie/Session機制的缺點

1.無法解決跨域問題

在跨域訪問時,cookie會失效,這是為了防止csrf攻擊(跨站請求偽造),但對於開發者來說造成了一定的困擾,因為現實中的伺服器不可能只有一臺,大概率是叢集分佈,雖然可以用反向代理避免跨域訪問,但終究是有侷限之處的。

2.session機制依賴於cookie

從cookie/session機制中我們不難看出,session的實現依賴於前端的cookie,因為其session的確定必須要前端請求中cookie,沒有了cookie,session是無法確定的。

而這會帶來什麼問題呢?那就是對於多端訪問,如手機App端,其並沒有cookie的直接實現(可以實現,其實也就是在請求頭中加入cookie欄位,但使用此方式並不普遍,也挺麻煩的),如果cookie很難使用,那麼session也無法使用。

3.可拓展性不強

如果將來搭建了多個伺服器,雖然每個伺服器都執行的是同樣的業務邏輯,但是session資料是儲存在記憶體中的(不是共享的),使用者第一次訪問的是伺服器1,當用戶再次請求時可能訪問的是另外一臺伺服器2,伺服器2獲取不到session資訊,就判定使用者沒有登陸過。

與此同時,當你使用session的時候你會發現一個很尷尬的事情——你無法直接獲取到存放session的map(除非你用反射),這樣就導致你的操作受限,比如你想以某個身份強制下線某個使用者時,session將會變得力不從心。

4.伺服器壓力增大

session存在於伺服器記憶體中,如果session很多,那麼伺服器壓力便會很大。會頻繁觸發gc操作,導致伺服器響應變慢,吞吐量下降。

5.安全性問題

Cookie/Session機制並不是絕對安全,你必須小心應對,當然我接下來說的token方式同樣也有這樣那樣的問題,但是我們要明白一件事情——沒有絕對安全的系統!

當前的所謂安全措施不過是在增加黑客入侵系統的成本,但你要注意的是你在增加黑客入侵的難度和成本的同時,也同樣在增加自己系統的維護成本,它必然是以一定的效能作為代價的

所以如何權衡安全和效能,這是永遠是一件值得我們深思的事情

3.使用token機制解決鑑權問題

什麼是token呢?

事實上它只是我們自己實現的一套類似cookie/Session的機制。

至於為啥叫token?

你也可以叫它cat,dog之類的,只要你喜歡,隨便你怎麼取名字(笑哭)。

好了,開個玩笑,咱們回到正題,在我看來,token只是脫胎於cookie/session的一套機制,它的實現原理幾乎是和cookie/session一模一樣的(9成像,當然也有很多根據自己業務的變種)。

如果說cookie/session機制可以描述為下圖:

在這裡插入圖片描述

那麼token機制可以描述為以下形式:

在這裡插入圖片描述

怎麼樣?是不是很像?其實它們核心原理是一樣的。

那token機制相較於cookie/session機制有啥好處呢?

  • 1.可以直接操作token令牌池
  • 2.對於手機App端友好
  • 3.跨域問題可以間接解決
  • 4.對於伺服器叢集,token令牌池可以放在redis資料庫中(當然也可以是其他方案),這樣可以實現使用者登入狀態多伺服器共享

其實,總的來說,就只有一條(笑哭),那就是靈活!因為token機制是我們自己實現的(當然也可以藉助框架),這樣操作這些東西的時候就不必拘泥於條條框框,可以根據自己的業務需求制定適合的鑑權方案。

悄悄告訴你一句:csdn也是用token的哦!(不過具體實現可能並不一樣)

在這裡插入圖片描述

在這裡插入圖片描述

當然,相較於cookie/session機制而言,它也有個巨大的弊端——在網頁應用中,使用token機制會比使用cookie/session機制麻煩很多,所有都得“從頭再來”,不像cookie/session可以開箱即用。

六、用SpringBoot+SSM實現一套簡單的鑑權服務(註冊,登入,許可權控制)

這裡我是用token來實現鑑權服務的。
以下是我畫的大致流程圖(可能有點醜,有點亂)

在這裡插入圖片描述

在展示程式碼實現時,你可能會對某些類比較疑惑,以下是對這些類的說明:

  • RestResponse 這是我用來封裝響應格式的,Status用來封裝響應狀態
  • CrudUtil 這是我用來封裝CRUD操作的工具類,該類主要為了簡化controller的響應操作

同時我會省略Service層和Dao層實現

1.註冊服務

①註冊頁面

<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,maximum-scale=1">
    <link rel="stylesheet"  href="static/css/public.css">
    <link rel="stylesheet"  href="static/lib/layui-v2.6.3/css/layui.css">
    <style>
        body {
            background: url("static/images/loginbg.png") 0% 0% / cover no-repeat;
            position: static;
            font-size: 12px;
        }
    </style>
</head>
<body>
<div class="layui-container">
    <div class="layui-main layui-card" style="width: 500px;border-radius: 10px">
        <fieldset class="layui-elem-field" style="margin-top: 20%">
            <legend style="font-size: 30px;padding-top: 20px;text-align: center">使用者註冊</legend>
            <div class="layui-field-box">
                <div class="layui-form layuimini-form" style="margin: 20px;margin-top: 30px">
                    <div class="layui-form-item">
                        <label class="layui-form-label required">使用者名稱</label>
                        <div class="layui-input-block">
                            <input type="text" name="uname" lay-verify="required" lay-reqtext="使用者名稱不能為空"
                                   placeholder="請輸入使用者名稱" value="" class="layui-input">
                            <tip>填寫自己真實姓名</tip>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label required">性別</label>
                        <div class="layui-input-block">
                            <input type="radio" name="sex" value="男" title="男" checked="">
                            <input type="radio" name="sex" value="女" title="女">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label required">手機</label>
                        <div class="layui-input-block">
                            <input type="number" name="phone" lay-verify="phone" placeholder="請輸入手機號" value=""
                                   class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label required">郵箱</label>
                        <div class="layui-input-block">
                            <input id="email" type="email" name="email" lay-verify="email" placeholder="請輸入郵箱" value=""
                                   class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label required">密碼</label>
                        <div class="layui-input-block">
                            <input type="text" name="pwd" lay-verify="required" placeholder="請輸入密碼" value=""
                                   class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label required">入職時間</label>
                        <div class="layui-input-block">
                            <input type="text" name="entryDate" id="date" lay-verify="date" placeholder="請選擇入職時間"
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label required" style="display: inline">郵箱驗證碼</label>
                        <input type="text" class="layui-input" name="code" placeholder="請輸入驗證碼" lay-verify="required"
                               maxlength="5" style="width:160px;display: inline">
                        <button id="saveBtn" lay-filter="saveBtn" class="layui-btn layui-btn-normal layui-btn-sm"
                                style="display: inline;margin-left: 10px">傳送驗證碼
                        </button>
                    </div>


                    <div class="layui-form-item" style="margin-top: 20px">
                        <div class="layui-input-block">
                            <button class="layui-btn layui-btn-lg" style="width: 150px" lay-submit
                                    lay-filter="registerBtn">註冊
                            </butGAuoRxKdDNton>
                        </div>
                    </div>
                </div>
            </div>
        </fieldset>


    </div>
</div>

<script src="static/lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script>
    layui.use(['form','layer','laydate','element'],function () {
        var form = layui.form,layer = layui.layer,laydate = layui.laydate,element=layui.element,$ = layui.$;

        //日期
        laydate.render({
            elem: '#date'
        });

        //監聽提交
        $('#saveBtn').bind('click',function 程式設計客棧() {
            var email = $('#email').val();
            if (email===''||email==null){
                layer.msg("請輸入正確的郵箱!");
            }else {
                $.ajax({
                    url: "/sendCode",data:'{"email":'+JSON.stringify(email)+'}',type: "post",dataType: 'JSON',contentType: "application/json;charset=utf-8",success: function (data) {
                        if (data.status !== 200) {
                            layer.msg(data.statusInfo.message);//失敗的表情
                            return;
                        } else {
                            layer.msg("驗證碼傳送成功,請前往郵箱檢視",{
                                icon: 6,//成功的表情
                                time: 1000 //1秒關閉(如果不配置,預設是3秒)
                            },function () {

                            });
                        }
                    }
                });
            }
        });
        //監聽提交
        form.on('submit(registerBtn)',function (data) {
            $.ajax({
                url: "/register",data: JSON.stringify(data.field),success: function (data) {
                    if (data.status !== 200) {
                        layer.msg(data.statusInfo.message);//失敗的表情
                        return;
                    } else {
                        layer.msg("註冊成功",{
                            icon: 6,//成功的表情
                            time: 1000 //1秒關閉(如果不配置,預設是3秒)
                        },function () {
                            window.location = '/login';
                        });
                    }
                }
            });
            return false;
        });

    });
</script>
</body>
</html>

②傳送驗證碼

sendcode介面

/**
     * 驗證是否有此賬號,然後傳送驗證碼
     * @param map 主要認證主體,如賬號,郵箱,qq的openID,wechat的code等
     * @return restResponse,附帶憑證token
     */
    @PostMapping("/sendCode")
    public RestResponse sendCode(@RequestBody Map<String,Object> map){
        if (userService.findUserByCondition(map)==null){
            String principal;
            if (map.get("phone")!=null){
                principal=String.valueOf(map.get("phone"));

            }else if (map.get("email")!=null){
                principal=String.valueOf(map.get("email"));
            }else {
                return CrudUtil.ID_MISS_RESPONSE;
            }
            //建立一個驗證碼
            VerificationCode v=new VerificationCode();
            //將驗證碼存入驗證碼等待池
            VerificationCodePool.addCode(principal,v);
            //傳送郵箱驗證碼
            sendEmail(principal,v.getCode());
            return new RestResponse();
        }
        return new RestResponse("",304,new StatusInfo("傳送驗證碼失敗,該賬戶已存在!","傳送驗證碼失敗,該賬戶已存在!"));
    }

郵件傳送方法(呼叫SpringBoot提供的mail服務(需要導包))

/**
     * 傳送帶有驗證碼的郵件資訊
     */
    private void sendEmail(String email,String code){
        //傳送驗證郵件
        try {
            SimpleMailMessage mailMessage = new SimpleMailMessage();

            //主題
            mailMessage.setSubject("倉庫管理系統的驗證碼郵件");

            //內容
            mailMessage.setText("歡迎使用倉庫管理系統,您正在註冊此賬戶。" +
                    "\n您收到的驗證碼是: "+code+" ,請不要將此驗證碼透露給別人。");

            //傳送的郵箱地址
            mailMessage.setTo(email);
            //預設傳送郵箱郵箱
            mailMessage.setFrom(fromEmail);

            //傳送
            mailSender.send(mailMessage);
        }catch (Exception e){
            throw new MyException(e.toString());
        }
    }

驗證碼物件

package com.dreamchaser.depository_manage.security.bean;

import lombok.Data;

import java.time.Instant;
import java.util.Random;

/**
 * 驗證碼,預設有效期為五分鐘
 * @author 金昊霖
 */
@Data
public class VerificationCode {
    /**
     * 預設持續時間
     */
    private final long DEFAULT_TERM=60*5;
    /**
     * 驗證碼
     */
    private String code;
    /**
     * 建立時刻
     */
    private Instant instant;
    /**
     * 有效期
     */
    private long term;

    /**
     * 根據時間判斷是否有效
     * @return boolean值
     */
    public boolean isValid(){
        return Instant.now().getEpochSecond()-instant.getEpochSecond()<=term;
    }

    public VerificationCode(Instant instant,long term) {
        //生成隨機驗證碼code
        generateCode();
        this.instant = instant;
        this.term = term;
    }


    public VerificationCode(Instant instant) {
        //生成隨機驗證碼code
        generateCode();
        this.instant = instant;
        this.term=DEFAULT_TERM;
    }

    public VerificationCode() {
        //生成隨機驗證碼code
        generateCode();
        this.instant=Instant.now();
        this.term=DEFAULT_TERM;
    }

    private void generateCode(){
        StringBuilder codeNum = new StringBuilder();
        int [] numbers = {0,1,2,3,4,5,6,7,8,9};
        Random random = new Random();
        for (int i = 0; i < 5; i++) {
            //目的是產生足夠隨機的數,避免產生的數字重複率高的問題
            int next = random.nextInt(10000);
            codeNum.append(numbers[next % 10]);
        }
        this.code= codeNum.toString();
    }


}

驗證碼池

package com.dreamchaser.depository_manage.security.pool;

import com.dreamchaser.depository_manage.security.bean.VerificationCode;

import java.util.Map;
import java.util.concurrent.ConcurrentHashMap;

/**
 * 驗證碼等待池
 * @author 金昊霖
 */
public class VerificationCodePool {
    private static Map<String,VerificationCode> pool=new ConcurrentHashMap<>(10);

    /**
     * 增加一條驗證碼
     * @param principal 主要內容,如郵箱,電話號碼等
     * @param verificationCode 驗證碼
     */
    public static void addCode(String principal,VerificationCode verificationCode){
        pool.put(principal,verificationCode);
    }

    /**
     * 根據principal主要資訊獲取未過期的驗證碼,如果沒有未過期的令牌則返回null
     * @param principal 主要內容,如郵箱,電話號碼等
     * @return verificationCode 未過期的驗證碼或者null
     */
    public static VerificationCode getCode(String principal){
        VerificationCode verificationCode=pool.get(principal);

        //如果沒有相應驗證碼則直接返回null
        if (verificationCode==null){
            return null;
        }

        //判斷令牌是否過期
        if (verificationCode.isValid()){
            //將驗證碼取出
            pool.remove(principal);
            return verificationCode;
        }else{
            //清除過期驗證碼
            pool.remove(principal);
            return null;
        }
    }

    /**
     * 根據主要資訊principal刪除對應的驗證碼
     * @param principal 主要資訊
     */
    public static void removeCode(String principal){
        pool.remove(principal);
    }
}

③註冊使用者

MD5加密類

	/*
	 * Copyright (c) JForum Team All rights reserved. Redistribution and use in source and binary forms,with or without modification,are permitted provided that the following conditions are met: 1) Redistributions of
	 * source code must retain the above copyright notice,this list of conditions and the following disclaimer. 2) Redistributions in binary form must reproduce the above copyright notice,this list of conditions and the
	 * following disclaimer in the documentation and/or other materials provided with the distribution. 3) Neither the name of "Rafael Steil" nor the names of its contributors may be used to endorse or promote products
	 * derived from this software without specific prior written permission. THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES,INCLUDING,BUT NOT LIMITED TO,* THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT,INDIRECT,INCIDENTAL,SPECIAL,EXEMPLARY,* OR CONSEQUENTIAL DAMAGES (INCLUDING,PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,DATA,OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY,WHETHER IN
	 * CONTRACT,STRICT LIABILITY,OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE This file creation date: Mar 29,2003 /
	 * 1:15:50 AM The JForum Project http://www.jforum.net
	 */
	package com.dreamchaser.depository_manage.utils;
	
	import java.security.MessageDigest;
	import java.security.NoSuchAlgorithmException;
	
	/**
	 * MD5加密
	 */
	public class Md5 {
	
		/**
		 * Encodes a string
		 * @param str String to encode
		 * @return Encoded String
		 */
		public static String crypt(String str) {
			if (str == null || str.length() == 0) {
				throw new IllegalArgumentException("String to encript cannot be null or zero length");
			}
			StringBuilder hexString = new StringBuilder();
			try {
				MessageDigest md = MessageDigest.getInstance("MD5");
				md.update(str.getBytes());
				byte[] hash = md.digest();
				for (byte b : hash) {
					if ((0xff & b) < 0x10) {
						hexString.append("0").append(Integer.toHexString((0xFF & b)));
					} else {
						hexString.append(Integer.toHexString(0xFF & b));
					}
				}
			} catch (NoSuchAlgorithmException e) {
				e.printStackTrace();
			}
			return hexString.toString();
		}
	
	}

註冊使用者介面

/**
     * 註冊使用者(通常為手機或者郵箱註冊)
     * @param map 引數列表,包括賬號(手機註冊就是phone,郵箱就是email)、密碼
     * @return 成功則返回憑證,否則返回驗證失敗
     */
    @PostMapping("/register")
    public RestResponse register(@RequestBody Map<String,Object>map){
        String principal;
        Object password=map.get("pwd");
        Object code=map.get("code");
        UserToken userToken;
        //判斷必要引數是否滿足
        if (password==null||code==null){
            return CrudUtil.ID_MISS_RESPONSE;
        }

        //從map中獲取對應引數
        if (map.get("email")!=null){
            principal=String.valueOf(map.get("email"));
            userToken=new UserToken(LoginType.EMAIl_PASSWORD,principal,String.valueOf(password));
        }else {
            return CrudUtil.ID_MISS_RESPONSE;
        }
        //驗證碼正確且成功插入資料
        if (checkCode(principal,String.valueOf(code))){
            //對密碼進行加密然後儲存使用者資訊
            map.put("pwd",Md5.crypt(String.valueOf(map.get("pwd"))));
            //如果使用者記錄插入成功
            if (userService.insertUser(map)==1){
                String token= Md5.crypt(userToken.getPrincipal()+userToken.getInstant());
                //返回憑證
                return new RestResponse().setData(token);
            }
        }else {
            //驗證碼錯誤
            return CrudUtil.CODE_ERROR;
        }
        return 

這裡的LoginType是登入方式,這個之後會提到

檢驗驗證碼方法

/**
     * 用於註冊使用者的方法,主要為號碼驗證和郵箱驗證提供驗證碼核對的服務
     * @param principal 認證主體
     * @param code 驗證碼
     * @return 是否驗證通過
     */
    private boolean checkCode(String principal,String code){
        if (code!=null){
            VerificationCode verificationCode=VerificationCodePool.getCode(principal);
            if (verificationCode!=null){
                return code.equals(verificationCode.getCode());
            }
        }
        return false;
    }

2.登入服務

登入介面

這裡為了方便起見,我把token儲存在cookie中

<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>後臺管理-登陸</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="static/lib/layui-v2.6.3/css/layui.css" media="all">
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <style>
        html,body {width: 100%;height: 100%;overflow: hidden}
        body {background: #1E9FFF;}
        body:after {content:'';background-repeat:no-repeat;background-size:cover;-webkit-filter:blur(3px);-moz-filter:blur(3px);-o-filter:blur(3px);-ms-filter:blur(3px);filter:blur(3px);position:absolute;top:0;left:0;right:0;bottom:0;z-index:-1;}
        .layui-container {width: 100%;height: 100%;overflow: hidden}
        .admi程式設計客棧n-login-background {width:360px;height:300px;position:absolute;left:50%;top:40%;margin-left:-180px;margin-top:-100px;}
        .logo-title {text-align:center;letter-spacing:2px;padding:14px 0;}
        .logo-title h1 {color:#1E9FFF;font-size:25px;font-weight:bold;}
        .login-form {background-color:#fff;border:1px solid #fff;border-radius:3px;padding:14px 20px;box-shadow:0 0 8px #eeeeee;}
        .login-form .layui-form-item {position:relative;}
        .login-form .layui-form-item label {position:absolute;left:1px;top:1px;width:38px;line-height:36px;text-align:center;color:#d2d2d2;}
        .login-form .layui-form-item input {padding-left:36px;}
        .captcha {width:60%;display:inline-block;}
        .captcha-img {display:inline-block;width:34%;float:right;}
        .captcha-img img {height:34px;border:1px solid #e6e6e6;height:36px;width:100%;}
    </style>
</head>
<body>
<div class="layui-container">
    <div class="admin-login-background">
        <div class="layui-form login-form">
            <form class="layui-form" action="">
                <div class="layui-form-item logo-title">
                    <h1>倉庫資訊管理系統登入</h1>
                </div>
                <div class="layui-form-item">
                    <label class="layui-icon layui-icon-username" ></label>
                    <input type="text" name="principal" lay-verify="required|account" placeholder="請輸入郵箱" autocomplete="off" class="layui-input" >
                </div>
                <div class="layui-form-item">
                    <label class="layui-icon layui-icon-password" ></label>
                    <input type="password" name="credentials" lay-verify="required|password" placeholder="密碼" autocomplete="off" class="layui-input">
                </div>
                <!-- 徒有其表的驗證碼,主要是不想另外弄了 -->
                <div class="layui-form-item">
                    <label class="layui-icon layui-icon-vercode" ></label>
                    <input type="text" name="captcha" lay-verify="required|captcha" placeholder="圖形驗證碼" autocomplete="off" class="layui-input verification captcha">
                    <div class="captcha-img">
                        <img id="captchaPic" src="static/images/captcha.jpg">
                    </div>
                </div>
                <div class="layui-form-item">
                    <input type="checkbox" name="rememberMe" value="true" lay-skin="primary" title="記住密碼">
                </div>
                <div class="layui-form-item">
                    <button class="layui-btn layui-btn layui-btn-normal layui-btn-fluid" lay-submit="" lay-filter="login">登 入</button>
                </div>
            </form>
        </div>
    </div>
</div>
<script  src="static/lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
<script  src="static/lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script  src="static/lib/jq-module/jquery.particleground.min.js" charset="utf-8"></script>
<script  src="static/js/cookie.js" charset="utf-8"></script>
<script>
    layui.use(['layer','form'],layer = layui.layer;


        // 登入過期的時候,跳出ifram框架
        if (top.location != self.location) top.location = self.location;

        // 粒子線條背景
        $(document).ready(function(){
            $('.layui-container').particleground({
                dotColor:'#7ec7fd',lineColor:'#7ec7fd'
            });
        });

        // 進行登入操作
        form.on('submit(login)',function (data) {
            data = data.field;
            if (data.principal === '') {
                layer.msg('使用者名稱不能為空');
                return false;
            }
            if (data.credentials === '') {
                layer.msg('密碼不能為空');
                return false;
            }
            if (data.captcha === '') {
                layer.msg('驗證碼不能為空');
                return false;
            }
            data.loginType="email";
            $.ajax({
                url:"/login",type:'postGAuoRxKdDN',dataType:'json',data:JSON.stringify(data),beforeSend:function () {
                    this.layerIndex = layer.load(0,{ shade: [0.5,'#393D49'] });
                },success:function(data){
                    if(data.status !== 200){
                        layer.msg(data.statusInfo.message);//失敗的表情
                        return;
                    }else{
                        layer.msg("登入成功",function(){
                            cookieUtil.createCookie("token",data.data)
                            window.location = '/index';
                        });

                    }
                },complete: function () {
                    layer.close(this.layerIndex);
                }
            })
            return false;
        });
    });
</script>
</body>
</html>

當然這裡封裝了cookie的操作

var cookieUtil={
    createCookie:function (name,value,days){
        var expires="";
        if (days){
            var date=new Date();
            date.setTime(date.getTime()+(days*14*24*3600*1000));
            expires=";expires="+date.toGMTString();
        }
        document.cookie=name+"="+value+expires+";path=/";
    },/*設定cookie*/
    set:function(name,expires,path,domain,secure){
        var cookie=encodeURIComponent(name)+"="+encodeURIComponent(value);
        if(expires instanceof Date){
            cookie+="; expires="+expires.toGMTString();
        }else{
            var date=new Date();
            date.setTime(date.getTime()+expires*24*3600*1000);
            cookie+="; expires="+date.toGMTString();
        }
        if(path){
            cookie+="; path="+path;
        }
        if(domain){
            cookie+="; domain="+domain;
        }
        if (secure) {
            cookie+="; "+secure;
        }
        document.cookie=cookie;
    },/*獲取cookie*/
    get:function(name){
        var cookieName=encodeURIComponent(name);
        /*正則表示式獲取cookie*/
        var restr="(^| )"+cookieName+"=([^;]*)(;|$)";
        var reg=new RegExp(restr);
        var cookieValue=document.cookie.match(reg)[2];
        /*字串擷取cookie*/
        /*var cookieStart=document.cookie.indexOf(cookieName+“=”);
        var cookieValue=null;
        if(cookieStart>-1){
            var cookieEnd=document.cookie.indexOf(";",cookieStart);
            if(cookieEnd==-1){
                cookieEnd=document.cookie.length;
            }
            cookieValue=decodeURIComponent(document.cookie.substring(cookieStart
            +cookieName.length,cookieEnd));
        }*/
        return cookieValue;
    }
}

登入介面

這裡的token憑證是根據使用者密碼+當前時刻(鹽)加密得到的

/**
     * 登入介面
     * @param map 登入資訊
     *  loginType 登入方式,目前支援的有email,qq,wechat
     *  principal 主要認證主體,如賬號,郵箱,qq的openID,wechat的code等
     *  credentials 類似於密碼,如果是qq,wechat則不需要傳改引數
     *  restResponse,附帶憑證token
     */
    @PostMapping("/login")
    public RestResponse login(@RequestBody Map<String,String> map) {
        UserToken userToken=new UserToken(LoginType.getType(map.get("loginType")),map.get("principal"),map.get("credentials"));
        return login(userToken);
    }

認證方法

/**
     * 將生成的令牌拿去認證,如果認證成功則返回帶有token憑證響應,否則返回使用者密碼錯誤的響應
     * @param userToken 未認證的令牌
     * @return restResponse 如果認證成功則返回帶有token憑證響應,否則返回使用者密碼錯誤的響應
     */
    private RestResponse login(UserToken userToken) {
        String token=loginRealms.authenticate(userToken);
        if (token!=null){
            return new RestResponse(token);
        }else {
            return CrudUtil.NOT_EXIST_USER_OR_ERROR_PWD_RESPONSE;
        }
    }

登入方式enum類

這裡可以看到我裡面有多種方式登入,不過我的程式碼裡只實現了郵箱登入,其餘方式可以自己去實現拓展

package com.dreamchaser.depository_manage.security.bean;

/**
 * 登入方式列舉類
 * @author 金昊霖
 */

public enum LoginType {
    /**
     * 通用
     */
    COMMON("common_realm"),/**
     * 使用者密碼登入
     */
    EMAIl_PASSWORD("user_password_realm"),/**
     * 手機驗證碼登入
     */
    USER_PHONE("user_phone_realm"),/**
     * 第三方登入(微信登入)
     */
    WECHAT_LOGIN("wechat_login_realm"),/**
     * 第三方登入(qq登入)
     */
    QQ_LOGIN("qq_login_realm");


    private String type;

    LoginType(String type) {
        this.type = type;
    }

    public String getType() {
        return type;
    }

    /**
     * 根據簡單的字串返回對應的LoginType
     * @param s 簡單的字串
     * @return 對應的LoginType
     */
    public static LoginType getType(String s){
        switch (s) {
            case "email":
                return EMAIl_PASSWORD;
            case "qq":
                return QQ_LOGIN;
            case "wechat":
                return WECHAT_LOGIN;
            case "phone":
                return USER_PHONE;
            default:
                return null;
        }

    }

    @Override
    public String toString() {
        return this.type;
    }
}

登入方式類

這裡面可以根據自己的業務拓展,我只實現了郵箱登入

package com.dreamchaser.depository_manage.security.bean;

import com.dreamchaser.depository_manage.entity.User;
import com.dreamchaser.depository_manage.exception.MyException;
import com.dreamchaser.depository_manage.security.pool.AuthenticationTokenPool;
import com.dreamchaser.depository_manage.service.UserService;
import com.dreamchaser.depository_manage.utils.Md5;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Component;

/**
 * 內建多種登入方式,和shiro中的realm類似
 * @author 金昊霖
 */
@Component
public class LoginRealms {
    @Autowired
    private UserService userService;

    /**
     * 認證,如果認證成功則返回憑證,否則返回null
     * @param userToken 未認證的令牌
     * @return 如果認證成功則返回憑證,否則返回null
     */
    public String authenticate(UserToken userToken){
        if (userToken.getCredentials()!=null){
            //對密碼加密
            userToken.setCredentials(Md5.crypt(userToken.getCredentials()));
        }
        if (userToken.getLoginType().equals(LoginType.EMAIl_PASSWORD)){
            return handle(userToken,emailLogin(userToken));
        }
        //else if (其他登入方式...)
        //如果無匹配的認證方式則視為驗證失敗
        return null;
    }

    /**
     * 郵箱登入方式
     * @param userToken 令牌
     * @return 認證成功返回SimpleUser
     */
    private User emailLogin(UserToken userToken){
        return userService.findUserByEmail(userToken.getPrincipal());
    }

    /**
     * 根據傳入的user是否為null(是否認證通過)來對令牌做剩下的操作(將user刻入令牌,並將該令牌放入令牌池中)
     * @param userToken 經過驗證後的令牌
     * @return token 根據令牌生成的憑證 ,如果認證未成功則返回null
     */
    private String handle(UserToken userToken,User user){
        if (user==null){
            //說明賬戶不存在
            throw new MyException(409,"該使用者不存在,請註冊後再登入!");
        }
        //判斷密碼是否正確
        if (user.getPwd().equals(userToken.getCredentials())){
            //將User資訊刻入令牌
            userToken.setUser(user);
            //獲取token憑證
            String token=Md5.crypt(userToken.getPrincipal()+userToken.getInstant());
            //將令牌放入認證令牌池
            AuthenticationTokenPool.addToken(token,userToken);
            return token;
        }
        return null;
    }
}

認證令牌類

package com.dreamchaser.depository_manage.security.bean;


import com.dreamchaser.depository_manage.entity.User;
import lombok.Data;

import java.time.Instant;


/**
 * 登入令牌,預設有效期為7天
 * @author 金昊霖
 */
@Data
public class UserToken{

    final long DEFAULT_TERM=60*60*24*7;
    /**
     * 登入方式
     */
    private LoginType loginType;
    /**
     * 微信、qq的code,郵箱,或者使用者名稱之類的
     */
    private String principal;

    /**
     * 相當於密碼(一般是加密過的)
     */
    private String credentials;

    /**
     * 放入的時間
     */
    private Instant instant;

    /**
     * 有效期(單位:秒)
     */
    private long term;

    /**
     * 可以放一些不敏感的資訊,以便下次訪問時可以直接取出,如果user屬性太多可以另外寫個類,比如SimpleUser,
     * 存放一些經常需要用到的資訊。
     */
    private User User;

    /**
     * 根據時間判斷是否有效
     * @return 有效則返回true,否則返回false
     */
    public boolean isValid(){
        return Instant.now().getEpochSecond()-instant.getEpochSecond()<=term;
    }

    public UserToken(LoginType loginType,String principal,String credentials,Instant instant,long term,User user) {
        this.loginType = loginType;
        this.principal = principal;
        this.credentials = credentials;
        this.instant = instant;
        this.term = term;
        this.User = user;
    }

    public UserToken(LoginType loginType,long term) {
        this.loginType = loginType;
        this.principal = principal;
        this.credentials = credentials;
        this.instant = instant;
        this.term = term;
    }

    public UserToken(LoginType loginType,String credentials) {
        this.loginType = loginType;
        this.principal = principal;
        this.credentials = credentials;
        this.instant = Instant.now();
        this.term=DEFAULT_TERM;
    }

    public UserToken(LoginType loginType,String principal) {
        this.loginType = loginType;
        this.principal = principal;
        this.instant=Instant.now();
        this.term=DEFAULT_TERM;
    }
}

認證令牌池

package com.dreamchaser.depository_manage.security.pool;


import com.dreamchaser.depository_manage.security.bean.UserToken;

import java.util.Map;
import java.util.concurrent.ConcurrentHashMap;

/**
 * 認證後的令牌連線池(由於獲取全域性的session比較麻煩,所以自己維護一個類似session的令牌池)
 * @author 金昊霖
 */
public class AuthenticationTokenPool {
    /**
     * 認證後的令牌連線池
     */
    private static Map<String,UserToken> pool=new ConcurrentHashMap<>(10);

    public static void addToken(String token,UserToken userToken){
        pool.put(token,userToken);
    }

    /**
     * 根據token憑證獲取未過期的令牌,如果沒有未過期的令牌則返回null
     * @param token 憑證
     * @return userToken 未過期的令牌
     */
    public static UserToken getToken(String token){
        UserToken userToken=pool.get(token);

        //如果沒有相應令牌則直接返回null
        if (userToken==null){
            return null;
        }

        //判斷令牌是否過期
        if (userToken.isValid()){
            return userToken;
        }else{
            //清除過期令牌
            pool.remove(token);
            return null;
        }
    }

    /**
     * 根據憑證刪除對應的令牌
     * @param token 憑證
     */
    public static void removeToken(String token){
        pool.remove(token);
    }

}

3.許可權控制(攔截器)

由於大作業的規模也沒這麼大,許可權並沒有劃分很細,所以這裡我只做了鑑權的操作,如果需要對不同資源採取不同的許可權控制,我的方案是寫多個攔截器,同時對於不同許可權資源路徑加上不同的字首以便區分控制。(這塊我並未細想,可能還有更好的方案,日後補充吧)

攔截器UserInterceptor

其實登出的操作也在這裡做了,相對應的logout方法只是返回響應而已(笑哭)

package com.dreamchaser.depository_manage.intercepter;

import com.dreamchaser.depository_manage.exception.MyException;
import com.dreamchaser.depository_manage.security.pool.AuthenticationTokenPool;
import lombok.extern.slf4j.Slf4j;
import org.springframework.stereotype.Component;
import org.springframework.web.servlet.handler.HandlerInterceptorAdapter;

import javax.servlet.http.Cookie;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * 認證攔截器,如果請求頭中有相應憑證則放行,否則攔截返回認證失效錯誤
 * @author 金昊霖
 */
@Slf4j
@Component
public class UserInterceptor extends HandlerInterceptorAdapter {

    @Override
    public boolean preHandle(HttpServletRequest request,HttpServletResponse response,Object handler) throws MyException {

        //拿到requset中的head
        String token =null;
        Cookie[] cookies=request.getCookies();
        for (Cookie c:cookies){
            if (c.getName().equals("token")){
                token=c.getValue();
                break;
            }
        }

        if (token==null){
            System.out.println(request.getRequestURI());
            throw new MyException(401,"未授權,請重新登入!");
        }
        //如果是訪問logout則刪除對應的令牌
        if ("/logout".equals(request.getServletPath())){
            AuthenticationTokenPool.removeToken(token);
            return true;
        }

        if (AuthenticationTokenPool.getToken(token)!=null){
            return true;
        }else {
            throw new MyException(407,"認證失效,請重新登入!");
        }
    }
}

MVC配置類

注意過濾掉註冊,登入,登出的介面

package com.dreamchaser.depository_manage.config;

import com.dreamchaser.depository_manage.intercepter.UserInterceptor;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

@Configuration
public class WebMvcConfig implements WebMvcConfigurer {

    @Override
    public void addInterceptors(InterceptorRegistry registry) {
        registry.addInterceptor(new UserInterceptor())
                .addPathPatterns("/**")
                .excludePathPatterns("/login","/register","/sendCode","/error")
                .excludePathPatterns("/static/**");
    }

    //    private static final String[] CLASSPATH_RESOURCE_LOCATIONS = {
//            "classpath:/META-INF/resources/","classpath:/resources/",//            "classpath:/static/","classpath:/public/" };
//    @Override
//    public void addResourceHandlers(ResourceHandlerRegistry registry) {
//        if (!registry.hasMappingForPattern("/webjars/**")) {
//            registry.addResourceHandler("/webjars/**").addResourceLocations(
//                    "classpath:/META-INF/resources/webjars/");
//        }
//        if (!registry.hasMappingForPattern("/**")) {
//            registry.addResourceHandler("/**").addResourceLocations(
//                    CLASSPATH_RESOURCE_LOCATIONS);
//        }
//
//    }
}



七、效果展示

1.註冊

在這裡插入圖片描述

傳送驗證碼

在這裡插入圖片描述

註冊成功

在這裡插入圖片描述

資料庫新增一條記錄,並且密碼加密儲存

在這裡插入圖片描述

2.登入

在這裡插入圖片描述

輸入錯誤的密碼

在這裡插入圖片描述

輸入正確的密碼
在這裡插入圖片描述

同時跳轉至首頁

在這裡插入圖片描述

這裡為了方便起見,我把token儲存在cookie中,看看cookie資訊

在這裡插入圖片描述

可以看到cookie中已經有token憑證

3.訪問其他資源

未登入訪問

在這裡插入圖片描述

登入後訪問

在這裡插入圖片描述

寫在最後

說實話,寫這篇博文花了我不少時間,光寫博文都花了兩個晚上,更別說自己實際去操作去找資料了。別看我現在講的頭頭是道的,當初我為了解決這個問題可花了不少心力,不說四處查資料學習,光光坑我就踩了一堆。

當然了,我寫的方案也並非是最好的,只是用Java實現的一套的簡單的鑑權服務,如果你學過SpringSecurity或者shiro這種許可權管理框架,那你肯定能或多或少看出一點它們的影子,因為我有一部分是模仿它們寫的(當然寫的很簡陋罷了)。

到此這篇關於手把手教你用Java實現一套簡單的鑑權服務的文章就介紹到這了,更多相關Java 鑑權內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!