html简单登录界面代码_简单代码实现JWT(jsonwebtoken)完成SSO单点登录

本文作者&＃xff1a;加耀              

投稿来源&＃xff1a;

https://zhuanlan.zhihu.com/p/64377462?utm_source&＃61;wechat_session&utm_medium&＃61;social&utm_oi&＃61;775841244587773952

使用JWT完成SSO单点登录

前两个月在公司面试过程中&＃xff0c;发现很多求职者在简历中都写有实现过单点登录&＃xff0c;并且使用的技术种类繁多&＃xff0c;刚好公司项目中实现单点登录的是使用一款叫做JWT(json web token)的框架&＃xff0c;其实现原理也挺简单的&＃xff0c;遂想&＃xff0c;是否自己可以用简单代码实现一个简易版的JWT来完成单点登录认证(SSO)&＃xff0c;所谓SSO单点登录&＃xff0c;其实是指的一类解决方案&＃xff0c;有很多种方式都可以实现&＃xff0c;这里描述的JWT就是其中一种&＃xff1b;

首先&＃xff0c;我们先来JWT官方看一下JWT的简单介绍吧&＃xff1b;

JWT的官网地址是&＃xff1a;https://jwt.io/&＃xff0c;我们在JWT的官网可以看到一个完整的JWT是由三个部分组成&＃xff0c;分别是Header头部、Payload数据部分、Signature签名三部分组成&＃xff1b;如图&＃xff1a;

如果将上图进行简化&＃xff0c;JWT数据结构大抵如下

// Header
{
"alg": "HS256",
"typ": "JWT"
}

// Payload
{
// reserved claims
"sub": "1234567890",
"name": "John Doe",
"iat": "1516239022"
}

// $Signature
HS256(Base64(Header) &＃43; "." &＃43; Base64(Payload), "自定义密钥kyey" )

// JWT
JWT &＃61; Base64(Header) &＃43; "." &＃43; Base64(Payload) &＃43; "." &＃43; $Signature


为了更便捷的看懂JWT的生成和认证流程&＃xff0c;这里给画了一张简略图供参考

如上图所示&＃xff0c;根据指定的加密算法和密钥对数据信息加密得到一个签名&＃xff0c;然后将算法、数据、签名一并使用Base64加密得到一个JWT字符串&＃xff1b;而认证流程则是对JWT密文进行Base64解密后使用相同的算法对数据再次签名&＃xff0c;然后将两次签名进行比较&＃xff0c;判断数据是否有被篡改&＃xff1b;

在整体流程上&＃xff0c;算是比较简单了&＃xff1b;再理解JWT的生成和认证原理后&＃xff0c;我们就可以着手开始写代码了&＃xff0c;我们可以使用一些其它的方式来完成类似的功能&＃xff0c;从而实现JWT类似的效果&＃xff1b;

首先&＃xff0c;我们创建一个SpringBoot工程(方便调试不用自己写请求映射)&＃xff0c;创建好工程后&＃xff0c;首先我们需要配置JWT的相关信息&＃xff0c;比如&＃xff1a;加密方式(当做是Header部分)、数据信息及token有效时间、JWT生成和认证算法等

在这里&＃xff0c;我们先定义一个枚举FailureTime&＃xff0c;用来定义支持的过期时间策略

public enum FailureTime {
    /**
     * 秒
     */
    SECOND,
    /**
     * 分
     */
    MINUTE,
    /**
     * 时
     */
    HOUR,
    /**
     * 天
     */
    DAY

}


在上面的代码中&＃xff0c;我们定义好这个jwt支持的过期时间策略有秒、分、时、天四种四种类型&＃xff1b;定义好规则后&＃xff0c;我们再来写一个类&＃xff0c;用来根据规则生成token相应的过期时间的工具类

public class FailureTimeUtils {

    /**
     * &＃64;demand: 根据指定的时间规则和时间生成有效时间
     * &＃64;parameters:
     * &＃64;creationDate&＃xff1a;
     * &＃64;email: huangjy19940202&＃64;gmail.com
     */
    public static Date creatValidTime(FailureTime failureTime, int jwtValidTime) {
        Date date &＃61; new Date();
        if (failureTime.name().equals(FailureTime.SECOND)) {
            return createBySecond(date, jwtValidTime);
        }
        if (failureTime.name().equals(FailureTime.MINUTE)) {
            return createBySecond(date, jwtValidTime * 60);
        }
        if (failureTime.name().equals(FailureTime.HOUR)) {
            return createBySecond(date, jwtValidTime * 60 * 60);
        }
        if (failureTime.name().equals(FailureTime.DAY)) {
            return getDateAfter(date, jwtValidTime);
        }
        return null;
    }

    /**
     * 得到几天后的时间
     *
     * &＃64;param day
     * &＃64;return
     */
    public static Date getDateAfter(Date date, int day) {
        Calendar now &＃61; Calendar.getInstance();
        now.setTime(date);
        now.set(Calendar.DATE, now.get(Calendar.DATE) &＃43; day);
        return now.getTime();
    }

    /**
     * 得到几天前的时间
     *
     * &＃64;param date
     * &＃64;param day
     * &＃64;return
     */
    public static Date getDateBefore(Date date, int day) {
        Calendar now &＃61; Calendar.getInstance();
        now.setTime(date);
        now.set(Calendar.DATE, now.get(Calendar.DATE) - day);
        return now.getTime();
    }

    /**
     * 得到多少秒之后的时间
     *
     * &＃64;param date
     * &＃64;param jwtValidTime
     * &＃64;return
     */
    public static Date createBySecond(Date date, int jwtValidTime) {
        Calendar calendar &＃61; Calendar.getInstance();
        calendar.setTime(date);
        calendar.add(Calendar.SECOND, jwtValidTime);
        return calendar.getTime();
    }

}


上面的代码中&＃xff0c;我们定义了几个方法&＃xff0c;分别是计算几天后的当前时间和多少秒后的当前时间&＃xff1b;然后我们再来定义一个枚举用来定义所支持的加密算法;

public enum Header {

    SM3("sm3","国密3加密算法,其算法不可逆&＃xff0c;类似于MD5"),
    SM4("sm4","国密4加密算法&＃xff0c;对称加密"),
    AES("aes","AES加密算法&＃xff0c;对称加密");

    private String code;

    private String details;

    Header(String code, String details) {
        this.code &＃61; code;
        this.details &＃61; details;
    }
}


在上面代码中&＃xff0c;我们定义我们这个JWT支持的加密方式有三种&＃xff0c;分别是SM3、SM4、AES&＃xff0c;都是属于对称加密算法&＃xff1b;SM2是非对称加密算法(此处不做讲解)&＃xff1b;

下面再定义记录用户数据的部分&＃xff0c;我们创建一个JwtClaims 用来存储我们需要保存到JWT中的个性数据&＃xff0c;代码如下

import java.util.HashMap;
import java.util.Objects;

public class JwtClaims extends HashMap {
    public JwtClaims() {
        this.put(ID, null);
        this.put(NAME, null);
        this.put(PHONE, null);
        this.put(FAILURETIME, null);
    }
    String ID &＃61; "id";
    String NAME &＃61; "name";
    String PHONE &＃61; "phone";
    /**
     * 有效期
     */
    String FAILURETIME &＃61; "failureTime";
    public JwtClaims put(String key, Object value) {
        super.put(key, value);
        return this;
    }
    /**
     * 重写hashCode方法
     *
     * &＃64;return
     */
    &＃64;Override
    public int hashCode() {
        return Objects.hash(super.hashCode(), this);
    }
}


在上面我们将JWT中需要用到的数据都定义好了后&＃xff0c;下面我们就可以开始写JWT相关的算法了&＃xff0c;代码如下所示&＃xff1a;

&＃64;Slf4j
public class Jwts extends ConcurrentHashMap {

    private static Jwts jwts;

    static {
        jwts &＃61; new Jwts();
    }

    /**
     * 默认加密密钥
     */
    private final String jwtSafetySecret &＃61; "0dcac1b6ec8843488fbe90e166617e34";

    /**
     * 指定加密算法和密钥
     *
     * &＃64;param header
     * &＃64;param jwtSafetySecret
     * &＃64;return
     */
    public static Jwts header(Header header, String jwtSafetySecret) {
        HashMap map &＃61; new HashMap<>();
        map.put("code", header);
        map.put("jwtSafetySecret", jwtSafetySecret);
        jwts.put("header", map);return jwts;
    }/**
     * &＃64;param jwtClaims
     * &＃64;return
     */public Jwts payload(JwtClaims jwtClaims) {
        jwts.put("payload", jwtClaims);return jwts;
    }/**
     * 签名并生成token
     *
     * &＃64;return
     */public String compact() throws Exception {// 头部
        HashMap headerObj &＃61; (HashMap) jwts.get("header");// 数据
        JwtClaims jwtClaims &＃61; (JwtClaims) jwts.get("payload");
        jwtClaims.put("uuid", UUID.randomUUID());// 生成签名
        Object jwtSafetySecretObj &＃61; headerObj.get("jwtSafetySecret");// 从头部信息中去除密钥信息
        headerObj.remove("jwtSafetySecret");
        String jwtSafetySecret &＃61; jwtSafetySecretObj &＃61;&＃61; null ? this.jwtSafetySecret : jwtSafetySecretObj.toString();
        Object code &＃61; headerObj.get("code");
        String encryptionType &＃61; code &＃61;&＃61; null ? "AES" : code.toString();// 开始签名
        String signature &＃61; dataSignature(headerObj, jwtClaims, encryptionType, jwtSafetySecret);// 生成token
        String token &＃61; Base64Utils.getBase64(JSONObject.toJSONString(headerObj)) &＃43; "."
                &＃43; Base64Utils.getBase64(JSONObject.toJSONString(jwtClaims)) &＃43; "."
                &＃43; signature;
        System.out.println("生成的token为:" &＃43; token);return token;
    }/**
     * 生成摘要
     */private static String dataSignature(HashMap headerObj, JwtClaims jwtClaims, String encryptionType, String jwtSafetySecret) throws Exception {
        String dataSignature &＃61; null;if (encryptionType.equals(Header.AES.name())) {
            dataSignature &＃61; AESUtils.encrypt(JSONObject.toJSONString(headerObj) &＃43; JSONObject.toJSONString(jwtClaims), jwtSafetySecret);
        } else if (encryptionType.equals(Header.SM3.name())) {
            dataSignature &＃61; SM3Cipher.sm3Digest(JSONObject.toJSONString(headerObj) &＃43; JSONObject.toJSONString(jwtClaims), jwtSafetySecret);
        } else if (encryptionType.equals(Header.SM4.name())) {
            dataSignature &＃61; new SM4Util().encode(JSONObject.toJSONString(headerObj) &＃43; JSONObject.toJSONString(jwtClaims), jwtSafetySecret);
        }return dataSignature;
    }/**
     * &＃64;demand: 校验token完整性和时效性   
     */public static Boolean safetyVerification(String tokenString, String jwtSafetySecret) throws Exception {// 有坑&＃xff0c;转义字符
        String[] split &＃61; tokenString.split("\\.");if (split.length !&＃61; 3) {throw new RuntimeException("无效的token");
        }// 头部信息
        HashMap obj &＃61; JSON.parseObject(Base64Utils.getFromBase64(split[0]), HashMap.class);// 数据信息
        JwtClaims jwtClaims &＃61; JSON.parseObject(Base64Utils.getFromBase64(split[1]), JwtClaims.class);// 签名信息
        String signature &＃61; split[2];// 验证token是否在有效期内if (jwtClaims.get("failureTime") !&＃61; null) {
            Date failureTime &＃61; (Date) jwtClaims.get("failureTime");int i &＃61; failureTime.compareTo(new Date());if (i > 0) {throw new RuntimeException("此token已过有效期");
            }
        }// 验证数据篡改
        Object code &＃61; obj.get("code");
        String encryptionType &＃61; code &＃61;&＃61; null ? "AES" : code.toString();// 比较签名
        String signatureNew &＃61; dataSignature(obj, jwtClaims, encryptionType, jwtSafetySecret);return signature.equals(signatureNew.replaceAll("\r\n","")) ? true : false;
    }
}

在上述的代码中&＃xff0c;我们定义了一个静态变量jwts&＃xff0c;此处涉及线程安全&＃xff0c;暂时先不调整&＃xff0c;后期再做优化&＃xff1b;在上述代码中&＃xff0c;完成了对Header和payload签名操作&＃xff0c;然后生成一个新的token&＃xff0c;其原理和下图相似&＃xff1b;

然后在代码中我们还完成了对Token认证的操作&＃xff0c;其方法为&＃xff1a;safetyVerification&＃xff0c;在方法中&＃xff0c;我们通过对token中的三部分进行签名和比对并且完成token时效性判断(当没有配置token时效性是则表示永久有效)&＃xff1b;在这个步骤中可以有效防止数据被篡改&＃xff0c;从而保证数据安全&＃xff1b;

对JWT加密和解密方面的核心代码大抵如此&＃xff0c;其它的引入了一些工具类类似国密加密算法、AES算法及Base64加密算法&＃xff0c;这些在完整代码中都有&＃xff0c;此处就不一一展示&＃xff1b;GitLab地址&＃xff1a;

• https://gitlab.com/qingsongxi/myjwt

代码结构如下图所示&＃xff1a;

在这里&＃xff0c;我们需要定义一个配置文件application.properties&＃xff0c;在配置文件中加入相关参数&＃xff0c;比如 对称加密密钥、token有效期、需要拦截的URL等等

# 密钥key
jwt.safety.secret&＃61;y2W89L6BkRAFljhN
# token有效期
jwt.valid.time&＃61;7
# 需要jwt拦截的url
jwt.secret-url&＃61;/findCustomerById
# 端口
server.port&＃61;80


在这里我们需要定义一个拦截器&＃xff0c;用来拦截需要token才能访问的URL&＃xff1b;

/**
 * &＃64;author: JiaYao
 * &＃64;demand: 自定义web拦截器
 */
&＃64;Slf4j
&＃64;Component
public class WebInterceptor implements HandlerInterceptor {

    /**
     * JWT密钥
     */
    &＃64;Value("${jwt.safety.secret}")
    private String jwtSafetySecret;

    &＃64;Override
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object o) throws Exception {
        //  进入拦截器 WebInterceptor...
        String authorization &＃61; request.getHeader("Authorization");
        if (authorization &＃61;&＃61; null || !authorization.startsWith("Bearer ")) {
            return noAccess403(response);
        } else {
            try {
                String token &＃61; authorization.substring(7).replaceAll(" ", "");
                // 验证token的完整性和有效性
                if (StringUtils.isNotEmpty(token) && Jwts.safetyVerification(token, jwtSafetySecret)) {
                    JwtClaims jwtClaims &＃61; JSON.parseObject(Base64Utils.getFromBase64(token.split("\\.")[1]), JwtClaims.class);
                    request.setAttribute("claims", jwtClaims);
                    return true;
                }
            } catch (Exception e) {
                e.printStackTrace();
                return noAccess(response);
            }
        }
        return false;
    }

    /**
     * 在未登录状态或登录状态失效时请求需要登录状态才能请求的URL
     *
     * &＃64;param httpServletResponse
     * &＃64;return
     * &＃64;throws Exception
     */
    public boolean noAccess(HttpServletResponse httpServletResponse) throws Exception {
        httpServletResponse.setContentType("text/json; charset&＃61;UTF-8");
        httpServletResponse.getWriter().write(JSON.toJSONString(Json.newInstance(Apistatus.CODE_401)));
        return false;
    }

    /**
     * 在未登录状态或登录状态失效时请求需要登录状态才能请求的URL
     *
     * &＃64;param httpServletResponse
     * &＃64;return
     * &＃64;throws Exception
     */
    public boolean noAccess403(HttpServletResponse httpServletResponse) throws Exception {
        httpServletResponse.setContentType("text/json; charset&＃61;UTF-8");
        httpServletResponse.getWriter().write(JSON.toJSONString(Json.newInstance(Apistatus.CODE_403)));
        return false;
    }

    &＃64;Override
    public void postHandle(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, Object
            o, ModelAndView modelAndView) throws Exception {
    }

    &＃64;Override
    public void afterCompletion(HttpServletRequest httpServletRequest, HttpServletResponse
            httpServletResponse, Object o, Exception e) throws Exception {
    }
}


/**
 * &＃64;author: JiaYao
 * &＃64;demand: 将拦截器添加到列表中&＃xff0c;即观察者与被观察者
 * &＃64;parameters:
 * &＃64;creationDate&＃xff1a; 2018/12/19 0019 9:16
 */
&＃64;Configuration
public class WebRequestInterceptor extends WebMvcConfigurerAdapter {

    &＃64;Autowired
    private WebInterceptor webInterceptor;

    /**
     * 需要JWT拦截的Url
     */
    &＃64;Value("${jwt.secret-url}")
    private String jwtSecretUrl;
    /**
     * JWT密钥
     */
    &＃64;Value("${jwt.safety.secret}")
    private String jwtSafetySecret;

    &＃64;Override
    public void addInterceptors(InterceptorRegistry registry) {
        jwtSecretUrl &＃61; jwtSecretUrl.replaceAll(" ", "");
        registry.addInterceptor(webInterceptor).addPathPatterns(jwtSecretUrl.split(","));
    }

}


到这里&＃xff0c;我们的JWT小工具基本上就算是已经写完了&＃xff0c;只需要整合到具体的业务中就可以开始投入使用&＃xff0c;下面编写一个访问控制层&＃xff0c;在里面定义两个方法&＃xff0c;一个是请求登录获取token&＃xff0c;另一个是请求需要登录下才能请求的资源&＃xff1b;

/**
 * 类 名: LoginController
 */
&＃64;Slf4j
&＃64;RestController
public class LoginController {

    &＃64;Autowired
    private LoginService loginService;

    /**
     * 登录
     *
     * &＃64;param customerId
     * &＃64;return
     */
    &＃64;GetMapping(value &＃61; "/login")
    public Json login(String customerId) {
        try {
            return Json.newInstance(loginService.login(customerId));
        } catch (Exception e) {
            log.error("登录失败&＃xff0c;错误信息{}", e.getMessage());
            return Json.CODE_500;
        }
    }

    /**
     * 根据用户id查询用户信息
     *
     * &＃64;param request
     * &＃64;return
     */
    &＃64;GetMapping(value &＃61; "/findCustomerById")
    public Json findCustomerById(HttpServletRequest request) {
        try {
            String customerId &＃61; ((JwtClaims) request.getAttribute("claims")).get("id").toString();
            return Json.newInstance(loginService.findCustomerById(customerId));
        } catch (Exception e) {
            log.error("登录失败&＃xff0c;错误信息{}", e.getMessage());
            return Json.CODE_500;
        }
    }

}


然后再来编写一个业务层代码

&＃64;Service
public class LoginService {

    &＃64;Value("${jwt.safety.secret}")
    private String jwtSafetySecret;

    &＃64;Value("${jwt.valid.time}")
    private int jwtValidTime;

    /**
     * 登录
     *
     * &＃64;param customerId
     * &＃64;return
     */
    public String login(String customerId) {
        Customer customer &＃61; new Customer();
        customer.setId(customerId);
        customer.setName("jiayao");
        customer.setPhone("1234567890");
        return createTokenString(customer);
    }

    /**
     * 根据id查用户
     *
     * &＃64;param customerId
     * &＃64;return
     */
    public Customer findCustomerById(String customerId) {
        Customer customer &＃61; new Customer();
        customer.setId(customerId);
        customer.setName("jiayao");
        customer.setPhone("1234567890");
        return customer;
    }

    /**
     * 生成token
     *
     * &＃64;param customer
     * &＃64;return
     */
    public String createTokenString(Customer customer) {
        String jwtToken &＃61; null;
        try {
            jwtToken &＃61; Jwts.header(Header.SM4, jwtSafetySecret)
                    .payload(new JwtClaims()
                            .put("id", customer.getId())
                            .put("name", customer.getName())
                            .put("phone", customer.getPhone())
                            .put("failureTime", FailureTimeUtils.creatValidTime(FailureTime.DAY, jwtValidTime))
                            .put("mytest", "我的个性属性"))
                    .compact();
        } catch (Exception e) {
            e.printStackTrace();
        }
        return jwtToken.replaceAll("\r\n","");
    }

}


在上述代码中&＃xff0c;有一个createTokenString的方法&＃xff0c;此方法可进一步抽取为一个静态的工具类&＃xff0c;在里面我们指定加密方式和密钥信息、指定token有效策略&＃xff1b;

启动项目后我们通过Postman请求登录接口获取token信息&＃xff0c;如下&＃xff1a;

如上图所示&＃xff0c;通过请求登录接口我们成功获取到了token&＃xff0c;我们使用这个token去请求一个需要登录才能请求的资源试试&＃xff1b;

如上图所示&＃xff0c;经过拦截器后通过request请求向里面添加属性claims&＃xff0c;将用户数据添加进来&＃xff0c;然后进入方法后就可以直接拿到用户数据从而确定是哪个用户登录的&＃xff0c;即使在多系统情况下&＃xff0c;采用同样的逻辑一样是可以解析的&＃xff0c;从而实现单点登录&＃xff1b;

在上述代码中还有一个问题是&＃xff1a;生成的token在有效期内无法被销毁&＃xff0c;那么就会存在一个安全问题&＃xff0c;即用户多次登录生成多个token&＃xff0c;但是前面生成的token还是处于有效状态&＃xff0c;无法被及时销毁&＃xff1b;鉴于这点&＃xff0c;可以采用Redis缓存来解决这个问题&＃xff0c;并且还可以实现多个系统共享Redis数据从而保证在在同一时间内只有一个有效的token&＃xff1b;

可能有朋友会问&＃xff0c;在用户数据的map中&＃xff0c;有添加一个UUID是做什么用的&＃xff0c;下午在测试的时候我发现对于同一个用户多次生成的token都是相同的&＃xff0c;而Jwt(json web token) 中每次生成的都是不一样的&＃xff0c;所以我在这里试想了一下&＃xff0c;添加一个uuid后可以使数据部分发生变化&＃xff0c;从而保证token的唯一性&＃xff1b;

GitLab地址&＃xff1a;

• https://link.zhihu.com/?target&＃61;https%3A//gitlab.com/qingsongxi/myjwt.git

最后

乐于输出干货的Java技术公众号&＃xff1a;Java3y。公众号内有200多篇原创技术文章、海量视频资源、精美脑图&＃xff0c;不妨来关注一下&＃xff01;

推荐阅读

• 地哥的腾讯面试经历

• 面试必考的&＃xff1a;并发和并行有什么区别&＃xff1f;

• 什么是CountDownLatch&＃xff1f;

• 通俗易懂讲解一条SQL是怎么执行的

• 互联网公司时尚穿搭指南

• 什么是DDoS攻击&＃xff1f;

• 花了一天整理了一些我常用的工具