spring boot+iview 前后端分离架构之登陆密码RSA加密(三十二)

spring boot 与 iview 前后端分离架构之登陆密码RSA加密(三十二)

  • 公众号
  • 密码加密
    • RSA工具类的编写
    • 生成RSA的公钥和私钥
    • 改造我们的登录模块
      • 改造application-dev.yml
      • 改造UserService
    • 前端改造
      • 引入jsencrypt,实现前端的RSA加密
      • 改造main.js
      • login.vue改造
    • 运行项目

公众号

在这里插入图片描述
大家可以直接微信扫描上面的二维码关注我的公众号,然后回复【bg32】 里面就会给到源代码的下载地址同时会附上相应的视频教程,并定期在我的公众号上给大家推送相应的技术文章,欢迎大家关注我的公众号。

密码加密

在我们登录的时候,我们的密码前文都是使用明文进行密码的传输的,那么为了防止密码在传输的过程中被截获,因此我们采用RSA公钥加密的方式来对密码进行加密,后端使用RSA的私钥进行密码的解密。

RSA工具类的编写

在后端我们编写一个RsaUtil工具类,该类实现对密码进行解密的功能,代码如下:

private static final int DEFAULT_RSA_KEY_SIZE = 2048;

    private static final String KEY_ALGORITHM = "RSA";

    /**
     * 生成RSA 公私钥,可选长度为1025,2048位.
     */
    public static Map generateRsaKey(int keySize) {
        Map result = new HashMap<>(2);
        try {
            KeyPairGenerator keyPairGen = KeyPairGenerator.getInstance(KEY_ALGORITHM);

            // 初始化密钥对生成器,密钥大小为1024 2048位
            keyPairGen.initialize(keySize, new SecureRandom());
            // 生成一个密钥对,保存在keyPair中
            KeyPair keyPair = keyPairGen.generateKeyPair();
            // 得到公钥字符串
            result.put("publicKey", new String(Base64.encodeBase64(keyPair.getPublic().getEncoded())));
            // 得到私钥字符串
            result.put("publicKey", new String(Base64.encodeBase64(keyPair.getPrivate().getEncoded())));
        } catch (GeneralSecurityException e) {
            e.printStackTrace();
        }
        return result;
    }

生成RSA的公钥和私钥

直接调用我们的RsaUtil工具类的generateRsaKey方法就会帮助我们生成我们所需要的公钥和私钥。

改造我们的登录模块

改造application-dev.yml

在该文件底下配置私钥的信息,改造如下:

auth:
  # authToken的过期时间
  authTokenExpire: 3600
  # refreshToken过期时间
  refreshTokenExpire: 7200
  # 放行的权限列表,采用小写的冒号分隔
  releaseUrl: /user/refreshToken
  # false表示用户单点登陆,true表示用户多点登录
  singleLanding: false
  # 私钥的key
  privateKey: 私钥的信息

改造UserService

    // 注入私钥信息
    @Value("${auth.privateKey}")
    private String privateKey;
    // 改造登录方法
    public ReturnInfo login(String loginAccount, String loginPassword) {
        loginPassword = RsaUtil.decrypt(loginPassword, privateKey);
        return authProvider.login(loginAccount, loginPassword);
    }

前端改造

引入jsencrypt,实现前端的RSA加密

打开package.json在dependencies底下引入以下的依赖

"jsencrypt": "^3.0.0-rc.1"

接着下载依赖

cnpm install

改造main.js

main.js中引入全局的签名方法

import JsEncrypt from 'jsencrypt';

/**
 * 配置全局的加密方法
 * @param obj 需要加密的字符串
 */
Vue.prototype.$encruption = function (obj) {
  let encrypt = new JsEncrypt();
  encrypt.setPublicKey(
    `-----BEGIN PUBLIC KEY-----MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC+r+ZME01ZtSKuZJqf892FGNcP1k4q47D+xPDQHpeudHSsjN/0+Tit4mEL3nbc4mFzHbNwcXz/y588LbtOoDhqRVaZAessTESvjgbeJFKFvD0eqCD3zeTL2FfABPJS2w47e5khwLjaVJpz0F/7S6gsAxf4n3GiHud3XibCWZItTQIDAQAB-----END PUBLIC KEY-----`
  )
  return encrypt.encrypt(obj);
};

login.vue改造

登录的时候对密码进行RSA加密
spring boot+iview 前后端分离架构之登陆密码RSA加密(三十二)_第1张图片

 loginPassword: this.$encruption(this.loginForm.loginPassword)

运行项目

接着我们将项目运行起来,然后登录我们会看到我们的控制台这边已经实现了密码的加密传输了。
spring boot+iview 前后端分离架构之登陆密码RSA加密(三十二)_第2张图片
上一篇文章地址:spring boot+iview 前后端分离架构之文件上传的实现(三十一)
下一篇文章地址:spring boot 与 iview 前后端分离架构之基于socketIo的消息推送的实现(三十三)

你可能感兴趣的:(java,spring,boot,iview,vue,spring,boot,与,iview实现前后端分离架构)