收藏
评论

在小程序使用jsEncrypt.js

问题描述

由于jsEncrypt.js代码里面含有window、document、navigator对象,这些对象可以在pc端的浏览器使用,但是小程序没有这些对象,所以直接在小程序引入jsEncrypt.js会直接报错,下面主要介绍如何在jsEncrypt.js里面对这些对象进行兼容。

jsEncrypt.js介绍

功能

一种RSA加密的解决方案。 这种加密模式被称为"非对称加密算法"。

(1)乙方生成两把密钥(公钥和私钥)。公钥是公开的,任何人都可以获得,私钥则是保密的。

(2)甲方获取乙方的公钥,然后用它对信息加密。

(3)乙方得到加密后的信息,用私钥解密。

如果公钥加密的信息只有私钥解得开,那么只要私钥不泄漏,通信就是安全的。

使用场景

加密验证码。

// 实例化JSEncrypt对象。并设置公钥

var cryptFirst = new JSEncrypt();

cryptFirst.setPublicKey('-----BEGIN PUBLIC KEY----- MFwwDQYJKoZIhvcNAQEBBQADSwAwSAJBALQCZoxawKSTyMTLEU5QlYNVIOBMafGq vVGp6bFv2gQ8Px5ZJVzIG1TjIUQo1IpGQBgC+JSJFaGLsv196dlcloUCAwEAAQ== -----END PUBLIC KEY-----');

// 实例化JSEncrypt对象。并设置私钥

var cryptSec = new JSEncrypt();

cryptSec.setPrivateKey('-----BEGIN PRIVATE KEY----- MIIBVQIBADANBgkqhkiG9w0BAQEFAASCAT8wggE7AgEAAkEAtAJmjFrApJPIxMsR TlCVg1Ug4Exp8aq9UanpsW/aBDw/HlklXMgbVOMhRCjUikZAGAL4lIkVoYuy/X3p 2VyWhQIDAQABAkBwdoN9MwHikNZBZSGFzUDsEZZ9rCAQtXycdcykZ95NAA5Mlb0j 77FLUhON8XEa+YVORwYn2GoP+ZZxGib7OtYBAiEA4nJRIzFn2Yr6y36r1rI6GP28 lxEDe5z/wytqm+XFswUCIQDLgJis+LVfzLM0MLVzDyuEy2GoLY46+WnaW8J2PSet gQIhANykSLzC2g6VJbN8VJFYjdVl/wkvMbaTjn4r4q/OnejFAiBPatgqaMUfpdsp uviU9o6dPGHYKC8hhMRymuzBCAy8AQIhAJlTJgdsJD7cjDCvFOv5v2Xz1JQQp03I vGjIsmEbdbEp -----END PRIVATE KEY-----'); var text = 'secret';

// 使用公钥加密数据

var enc = cryptFirst.encrypt(text);

// 现在使用私钥解密数据

var dec = cryptSec.decrypt(enc);

console.log(dec === text); // true

开始兼容处理

源代码

在线预览:源代码地址

兼容window.crypto

源代码第2754行

if (window.crypto && window.crypto.getRandomValues) {    // 生成长度为256,元素值为0的数组
    var z = new Uint32Array(256);    // 生成长度为256,元素随机值的数组
    window.crypto.getRandomValues(z);
}

兼容代码

var getRandomValues = function (array) {    

    for (var i = 0, l = array.length; i < l; i++) {

       array[i] = Math.floor(Math.random() * 256);    }    return array;

}

var z = new Uint32Array(256);

getRandomValues(z);

兼容window.removeEventListener、window.detachEvent

源代码

if (window.removeEventListener) {  

 window.removeEventListener("mousemove", onMouseMoveListener_1, false);

} else if (window.detachEvent) {    

 window.detachEvent("onmousemove", onMouseMoveListener_1);

}

兼容处理:

直接删掉,监听的事件不会影响到加密和解密

兼容navigator.appName、navigator.userAgent

源代码

if (j_lm && (navigator.appName == "Microsoft Internet Explorer")) {
    BigInteger.prototype.am = am2;
    dbits = 30;
} else if (j_lm && (navigator.appName != "Netscape")) {
    BigInteger.prototype.am = am1;
    dbits = 26;
} else { // Mozilla/Netscape seems to prefer am3
    BigInteger.prototype.am = am3;
    dbits = 28;
}

兼容处理:

直接删掉。navigator主要是对浏览器的判断

最后

去一个在线压缩js的网站压缩一下代码,然后在小程序里引入就搞定啦。

总结

兼容处理其实比较简单粗暴,主要学到了一些第三方库在小程序的兼容处理其实很简单,不用太过畏惧修改源码。


最后一次编辑于  2018-11-21
赞 3
收藏

7 个评论

  • 小猪乔治
    小猪乔治
    12-01

    它采用

    window.JSEncrypt = JSEncrypt;

    暴露JSEncrypt类。

    这个window也是undefined的。

    12-01
    赞同
    回复 1
    • 小猪乔治
      小猪乔治
      12-01
      解决办法是把它也删掉,用的时候
      12-01
      1
      回复
  • 易之晓晓
    易之晓晓
    07-14

    楼主能用嘛  我这还是有问题呢

    07-14
    赞同
    回复
  • Geng.
    Geng.
    07-05

    楼主,思路很好,问下最后改完的可以用了吗?如果可以了给个用吧

    07-05
    赞同
    回复
  • _w
    _w
    06-12
    if (j_lm && (navigator.appName == "Microsoft Internet Explorer")) {
        BigInteger.prototype.am = am2;
        dbits = 30;
    } else if (j_lm && (navigator.appName != "Netscape")) {
        BigInteger.prototype.am = am1;
        dbits = 26;
    } else { // Mozilla/Netscape seems to prefer am3
        BigInteger.prototype.am = am3;
        dbits = 28;
    }

    不能全删,留一个if的执行片段

     BigInteger.prototype.am = am3;
      dbits = 28;


    06-12
    赞同
    回复
  • 繁华荆棘一路向北
    繁华荆棘一路向北
    04-11

    读取不出navigator变量的  小程序没有

    04-11
    赞同
    回复
  • 陈志明·省医院协会
    陈志明·省医院协会
    2018-12-14

    我选择了这个https://github.com/UFO0001/WX_RSA,可以直接使用的。

    2018-12-14
    赞同
    回复 2
    • 通
      08-30
      不能用啊,依然报错
      08-30
      回复
    • 通
      08-30回复
      VM2275:1 thirdScriptError undefined; [Component] Event Handler Error @ pages/logs/logs#bound onLoginBtn undefined
      08-30
      回复
  • 陈志明·省医院协会
    陈志明·省医院协会
    2018-12-14

    楼主您好,按照您的改法做了,但是还是有报错呢。

    2018-12-14
    赞同
    回复 1
    • 浩东
      浩东
      2018-12-14

      什么错误?其实我只是提供一种解决方法的思路而已

      2018-12-14
      回复