js实现md5加密 - Ocean Han

:::tip 前言

最近在写一个项目的登录功能时，出现了一个需求，要将用户的密码进行md5加密成 16 位后再进行传输

查了一些资料，找到了js-md5这个库，可以通过其中提供的api直接对数据进行加密，但是只能加密成 32 位，研究了半天也没找到解决办法

于是，只能自己封装一个了，在找资料的过程中发现了下面这个方法，感觉还不错，整理在此

:::

步骤#

1.创建公共 js 文件#

创建 utils/utils.js，里面存放封装的一些工具函数

2.引入#

在 main.js 中引入并全局挂载

1
//引入
2
import utils from "@/utils/utils.js";
3
//全局挂载
4
Vue.prototype.$utils = utils;

3.md5 加密函数#

1
// md5加密
2
function md5(string, bit) {
3
  function md5_RotateLeft(lValue, iShiftBits) {
4
    return (lValue << iShiftBits) | (lValue >>> (32 - iShiftBits));
5
  }
6
  function md5_AddUnsigned(lX, lY) {
7
    var lX4, lY4, lX8, lY8, lResult;
8
    lX8 = lX & 0x80000000;
9
    lY8 = lY & 0x80000000;
10
    lX4 = lX & 0x40000000;
11
    lY4 = lY & 0x40000000;
12
    lResult = (lX & 0x3fffffff) + (lY & 0x3fffffff);
13
    if (lX4 & lY4) {
14
      return lResult ^ 0x80000000 ^ lX8 ^ lY8;
15
    }
16
    if (lX4 | lY4) {
17
      if (lResult & 0x40000000) {
18
        return lResult ^ 0xc0000000 ^ lX8 ^ lY8;
19
      } else {
20
        return lResult ^ 0x40000000 ^ lX8 ^ lY8;
21
      }
22
    } else {
23
      return lResult ^ lX8 ^ lY8;
24
    }
25
  }
26
  function md5_F(x, y, z) {
27
    return (x & y) | (~x & z);
28
  }
29
  function md5_G(x, y, z) {
30
    return (x & z) | (y & ~z);
31
  }
32
  function md5_H(x, y, z) {
33
    return x ^ y ^ z;
34
  }
35
  function md5_I(x, y, z) {
36
    return y ^ (x | ~z);
37
  }
38
  function md5_FF(a, b, c, d, x, s, ac) {
39
    a = md5_AddUnsigned(
40
      a,
41
      md5_AddUnsigned(md5_AddUnsigned(md5_F(b, c, d), x), ac)
42
    );
43
    return md5_AddUnsigned(md5_RotateLeft(a, s), b);
44
  }
45
  function md5_GG(a, b, c, d, x, s, ac) {
46
    a = md5_AddUnsigned(
47
      a,
48
      md5_AddUnsigned(md5_AddUnsigned(md5_G(b, c, d), x), ac)
49
    );
50
    return md5_AddUnsigned(md5_RotateLeft(a, s), b);
51
  }
52
  function md5_HH(a, b, c, d, x, s, ac) {
53
    a = md5_AddUnsigned(
54
      a,
55
      md5_AddUnsigned(md5_AddUnsigned(md5_H(b, c, d), x), ac)
56
    );
57
    return md5_AddUnsigned(md5_RotateLeft(a, s), b);
58
  }
59
  function md5_II(a, b, c, d, x, s, ac) {
60
    a = md5_AddUnsigned(
61
      a,
62
      md5_AddUnsigned(md5_AddUnsigned(md5_I(b, c, d), x), ac)
63
    );
64
    return md5_AddUnsigned(md5_RotateLeft(a, s), b);
65
  }
66
  function md5_ConvertToWordArray(string) {
67
    var lWordCount;
68
    var lMessageLength = string.length;
69
    var lNumberOfWords_temp1 = lMessageLength + 8;
70
    var lNumberOfWords_temp2 =
71
      (lNumberOfWords_temp1 - (lNumberOfWords_temp1 % 64)) / 64;
72
    var lNumberOfWords = (lNumberOfWords_temp2 + 1) * 16;
73
    var lWordArray = Array(lNumberOfWords - 1);
74
    var lBytePosition = 0;
75
    var lByteCount = 0;
76
    while (lByteCount < lMessageLength) {
77
      lWordCount = (lByteCount - (lByteCount % 4)) / 4;
78
      lBytePosition = (lByteCount % 4) * 8;
79
      lWordArray[lWordCount] =
80
        lWordArray[lWordCount] |
81
        (string.charCodeAt(lByteCount) << lBytePosition);
82
      lByteCount++;
83
    }
84
    lWordCount = (lByteCount - (lByteCount % 4)) / 4;
85
    lBytePosition = (lByteCount % 4) * 8;
86
    lWordArray[lWordCount] = lWordArray[lWordCount] | (0x80 << lBytePosition);
87
    lWordArray[lNumberOfWords - 2] = lMessageLength << 3;
88
    lWordArray[lNumberOfWords - 1] = lMessageLength >>> 29;
89
    return lWordArray;
90
  }
91
  function md5_WordToHex(lValue) {
92
    var WordToHexValue = "",
93
      WordToHexValue_temp = "",
94
      lByte,
95
      lCount;
96
    for (lCount = 0; lCount <= 3; lCount++) {
97
      lByte = (lValue >>> (lCount * 8)) & 255;
98
      WordToHexValue_temp = "0" + lByte.toString(16);
99
      WordToHexValue =
100
        WordToHexValue +
101
        WordToHexValue_temp.substr(WordToHexValue_temp.length - 2, 2);
102
    }
103
    return WordToHexValue;
104
  }
105
  function md5_Utf8Encode(string) {
106
    string = string.replace(/\r\n/g, "\n");
107
    var utftext = "";
108
    for (var n = 0; n < string.length; n++) {
109
      var c = string.charCodeAt(n);
110
      if (c < 128) {
111
        utftext += String.fromCharCode(c);
112
      } else if (c > 127 && c < 2048) {
113
        utftext += String.fromCharCode((c >> 6) | 192);
114
        utftext += String.fromCharCode((c & 63) | 128);
115
      } else {
116
        utftext += String.fromCharCode((c >> 12) | 224);
117
        utftext += String.fromCharCode(((c >> 6) & 63) | 128);
118
        utftext += String.fromCharCode((c & 63) | 128);
119
      }
120
    }
121
    return utftext;
122
  }
123
  var x = Array();
124
  var k, AA, BB, CC, DD, a, b, c, d;
125
  var S11 = 7,
126
    S12 = 12,
127
    S13 = 17,
128
    S14 = 22;
129
  var S21 = 5,
130
    S22 = 9,
131
    S23 = 14,
132
    S24 = 20;
133
  var S31 = 4,
134
    S32 = 11,
135
    S33 = 16,
136
    S34 = 23;
137
  var S41 = 6,
138
    S42 = 10,
139
    S43 = 15,
140
    S44 = 21;
141
  string = md5_Utf8Encode(string);
142
  x = md5_ConvertToWordArray(string);
143
  a = 0x67452301;
144
  b = 0xefcdab89;
145
  c = 0x98badcfe;
146
  d = 0x10325476;
147
  for (k = 0; k < x.length; k += 16) {
148
    AA = a;
149
    BB = b;
150
    CC = c;
151
    DD = d;
152
    a = md5_FF(a, b, c, d, x[k + 0], S11, 0xd76aa478);
153
    d = md5_FF(d, a, b, c, x[k + 1], S12, 0xe8c7b756);
154
    c = md5_FF(c, d, a, b, x[k + 2], S13, 0x242070db);
155
    b = md5_FF(b, c, d, a, x[k + 3], S14, 0xc1bdceee);
156
    a = md5_FF(a, b, c, d, x[k + 4], S11, 0xf57c0faf);
157
    d = md5_FF(d, a, b, c, x[k + 5], S12, 0x4787c62a);
158
    c = md5_FF(c, d, a, b, x[k + 6], S13, 0xa8304613);
159
    b = md5_FF(b, c, d, a, x[k + 7], S14, 0xfd469501);
160
    a = md5_FF(a, b, c, d, x[k + 8], S11, 0x698098d8);
161
    d = md5_FF(d, a, b, c, x[k + 9], S12, 0x8b44f7af);
162
    c = md5_FF(c, d, a, b, x[k + 10], S13, 0xffff5bb1);
163
    b = md5_FF(b, c, d, a, x[k + 11], S14, 0x895cd7be);
164
    a = md5_FF(a, b, c, d, x[k + 12], S11, 0x6b901122);
165
    d = md5_FF(d, a, b, c, x[k + 13], S12, 0xfd987193);
166
    c = md5_FF(c, d, a, b, x[k + 14], S13, 0xa679438e);
167
    b = md5_FF(b, c, d, a, x[k + 15], S14, 0x49b40821);
168
    a = md5_GG(a, b, c, d, x[k + 1], S21, 0xf61e2562);
169
    d = md5_GG(d, a, b, c, x[k + 6], S22, 0xc040b340);
170
    c = md5_GG(c, d, a, b, x[k + 11], S23, 0x265e5a51);
171
    b = md5_GG(b, c, d, a, x[k + 0], S24, 0xe9b6c7aa);
172
    a = md5_GG(a, b, c, d, x[k + 5], S21, 0xd62f105d);
173
    d = md5_GG(d, a, b, c, x[k + 10], S22, 0x2441453);
174
    c = md5_GG(c, d, a, b, x[k + 15], S23, 0xd8a1e681);
175
    b = md5_GG(b, c, d, a, x[k + 4], S24, 0xe7d3fbc8);
176
    a = md5_GG(a, b, c, d, x[k + 9], S21, 0x21e1cde6);
177
    d = md5_GG(d, a, b, c, x[k + 14], S22, 0xc33707d6);
178
    c = md5_GG(c, d, a, b, x[k + 3], S23, 0xf4d50d87);
179
    b = md5_GG(b, c, d, a, x[k + 8], S24, 0x455a14ed);
180
    a = md5_GG(a, b, c, d, x[k + 13], S21, 0xa9e3e905);
181
    d = md5_GG(d, a, b, c, x[k + 2], S22, 0xfcefa3f8);
182
    c = md5_GG(c, d, a, b, x[k + 7], S23, 0x676f02d9);
183
    b = md5_GG(b, c, d, a, x[k + 12], S24, 0x8d2a4c8a);
184
    a = md5_HH(a, b, c, d, x[k + 5], S31, 0xfffa3942);
185
    d = md5_HH(d, a, b, c, x[k + 8], S32, 0x8771f681);
186
    c = md5_HH(c, d, a, b, x[k + 11], S33, 0x6d9d6122);
187
    b = md5_HH(b, c, d, a, x[k + 14], S34, 0xfde5380c);
188
    a = md5_HH(a, b, c, d, x[k + 1], S31, 0xa4beea44);
189
    d = md5_HH(d, a, b, c, x[k + 4], S32, 0x4bdecfa9);
190
    c = md5_HH(c, d, a, b, x[k + 7], S33, 0xf6bb4b60);
191
    b = md5_HH(b, c, d, a, x[k + 10], S34, 0xbebfbc70);
192
    a = md5_HH(a, b, c, d, x[k + 13], S31, 0x289b7ec6);
193
    d = md5_HH(d, a, b, c, x[k + 0], S32, 0xeaa127fa);
194
    c = md5_HH(c, d, a, b, x[k + 3], S33, 0xd4ef3085);
195
    b = md5_HH(b, c, d, a, x[k + 6], S34, 0x4881d05);
196
    a = md5_HH(a, b, c, d, x[k + 9], S31, 0xd9d4d039);
197
    d = md5_HH(d, a, b, c, x[k + 12], S32, 0xe6db99e5);
198
    c = md5_HH(c, d, a, b, x[k + 15], S33, 0x1fa27cf8);
199
    b = md5_HH(b, c, d, a, x[k + 2], S34, 0xc4ac5665);
200
    a = md5_II(a, b, c, d, x[k + 0], S41, 0xf4292244);
201
    d = md5_II(d, a, b, c, x[k + 7], S42, 0x432aff97);
202
    c = md5_II(c, d, a, b, x[k + 14], S43, 0xab9423a7);
203
    b = md5_II(b, c, d, a, x[k + 5], S44, 0xfc93a039);
204
    a = md5_II(a, b, c, d, x[k + 12], S41, 0x655b59c3);
205
    d = md5_II(d, a, b, c, x[k + 3], S42, 0x8f0ccc92);
206
    c = md5_II(c, d, a, b, x[k + 10], S43, 0xffeff47d);
207
    b = md5_II(b, c, d, a, x[k + 1], S44, 0x85845dd1);
208
    a = md5_II(a, b, c, d, x[k + 8], S41, 0x6fa87e4f);
209
    d = md5_II(d, a, b, c, x[k + 15], S42, 0xfe2ce6e0);
210
    c = md5_II(c, d, a, b, x[k + 6], S43, 0xa3014314);
211
    b = md5_II(b, c, d, a, x[k + 13], S44, 0x4e0811a1);
212
    a = md5_II(a, b, c, d, x[k + 4], S41, 0xf7537e82);
213
    d = md5_II(d, a, b, c, x[k + 11], S42, 0xbd3af235);
214
    c = md5_II(c, d, a, b, x[k + 2], S43, 0x2ad7d2bb);
215
    b = md5_II(b, c, d, a, x[k + 9], S44, 0xeb86d391);
216
    a = md5_AddUnsigned(a, AA);
217
    b = md5_AddUnsigned(b, BB);
218
    c = md5_AddUnsigned(c, CC);
219
    d = md5_AddUnsigned(d, DD);
220
  }
221
  if (bit == 32) {
222
    return (
223
      md5_WordToHex(a) +
224
      md5_WordToHex(b) +
225
      md5_WordToHex(c) +
226
      md5_WordToHex(d)
227
    ).toLowerCase();
228
  }
229
  return (md5_WordToHex(b) + md5_WordToHex(c)).toLowerCase();
230
}
231

232
//记得要将方法暴露出去
233
export default {
234
  md5,
235
};

4.使用#

全局挂载之后，就可以直接通过 this.$utils来调用其中的工具函数了

1
const { data: res } = await this.$http.post("/permissions/login", {
2
  phone_number: this.loginForm.phone_number,
3
  //加密
4
  password: this.$utils.md5(this.loginForm.password, 16),
5
  check_code: this.loginForm.check_code,
6
});