• 前端base64加密


    一、Base64编码表
    码值
    字符
    码值
    字符
    码值
    字符
    码值
    字符
    0
    A
    16
    Q
    32
    g
    48
    w
    1
    B
    17
    R
    33
    h
    49
    x
    2
    C
    18
    S
    34
    i
    50
    y
    3
    D
    19
    T
    35
    j
    51
    z
    4
    E
    20
    U
    36
    k
    52
    0
    5
    F
    21
    V
    37
    l
    53
    1
    6
    G
    22
    W
    38
    m
    54
    2
    7
    H
    23
    X
    39
    n
    55
    3
    8
    I
    24
    Y
    40
    o
    56
    4
    9
    J
    25
    Z
    41
    p
    57
    5
    10
    K
    26
    a
    42
    q
    58
    6
    11
    L
    27
    b
    43
    r
    59
    7
    12
    M
    28
    c
    44
    s
    60
    8
    13
    N
    29
    d
    45
    t
    61
    9
    14
    O
    30
    e
    46
    u
    62
    +
    15
    P
    31
    f
    47
    v
    63
    /
     
     
     
    二、原理和过程
    举个栗子说明原理和过程:
      转码过程例子:3 * 8 = 4 * 6   内存1个字节占8位
              转前: s     1    3
    先转成ascii对应:115   49   51
     翻译为2进制8*3:01110011  00110001  00110011
        重新分组6*4:011100   110011   000100   110011
    然后计算机是8位的存数,6位不够,高位自动补0 
     科学计算器输入:00011100  00110011  00000100  00110011
       对应十进制为:28        51         4           51
         照表译码为:c         z          E           z
     
     
    三、Base64的JavaScript实现方式
      1 // Create Base64 Objectvar
      2 Base64 = {
      3   _keyStr: "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",
      4   encode: function (e) {
      5     var t = "";
      6     var n, r, i, s, o, u, a;
      7     var f = 0;
      8     e = Base64._utf8_encode(e);
      9     while (f < e.length) {
     10       n = e.charCodeAt(f++);
     11       r = e.charCodeAt(f++);
     12       i = e.charCodeAt(f++);
     13       s = n >> 2;
     14       o = (n & 3) << 4 | r >> 4;
     15       u = (r & 15) << 2 | i >> 6;
     16       a = i & 63;
     17       if (isNaN(r)) {
     18         u = a = 64
     19       } else if (isNaN(i)) {
     20         a = 64
     21       }
     22       t = t + this._keyStr.charAt(s) + this._keyStr.charAt(o) + this._keyStr.charAt(u) + this._keyStr.charAt(a)
     23     }
     24     return t
     25   },
     26   decode: function (e) {
     27     var t = "";
     28     var n, r, i;
     29     var s, o, u, a;
     30     var f = 0;
     31     e = e.replace(/[^A-Za-z0-9+/=]/g, "");
     32     while (f < e.length) {
     33       s = this._keyStr.indexOf(e.charAt(f++));
     34       o = this._keyStr.indexOf(e.charAt(f++));
     35       u = this._keyStr.indexOf(e.charAt(f++));
     36       a = this._keyStr.indexOf(e.charAt(f++));
     37       n = s << 2 | o >> 4;
     38       r = (o & 15) << 4 | u >> 2;
     39       i = (u & 3) << 6 | a;
     40       t = t + String.fromCharCode(n);
     41       if (u != 64) {
     42         t = t + String.fromCharCode(r)
     43       }
     44       if (a != 64) {
     45         t = t + String.fromCharCode(i)
     46       }
     47     }
     48     t = Base64._utf8_decode(t);
     49     return t
     50   }, _utf8_encode: function (e) {
     51     e = e.replace(/rn/g, "n");
     52     var t = "";
     53     for (var n = 0; n < e.length; n++) {
     54       var r = e.charCodeAt(n);
     55       if (r < 128) {
     56         t += String.fromCharCode(r)
     57       } else if (r > 127 && r < 2048) {
     58         t += String.fromCharCode(r >> 6 | 192);
     59         t += String.fromCharCode(r & 63 | 128)
     60       } else {
     61         t += String.fromCharCode(r >> 12 | 224);
     62         t += String.fromCharCode(r >> 6 & 63 | 128);
     63         t += String.fromCharCode(r & 63 | 128)
     64       }
     65     }
     66     return t
     67   }, _utf8_decode: function (e) {
     68     var t = "";
     69     var n = 0;
     70     var r = c1 = c2 = 0;
     71     while (n < e.length) {
     72       r = e.charCodeAt(n);
     73       if (r < 128) {
     74         t += String.fromCharCode(r);
     75         n++
     76       } else if (r > 191 && r < 224) {
     77         c2 = e.charCodeAt(n + 1);
     78         t += String.fromCharCode((r & 31) << 6 | c2 & 63);
     79         n += 2
     80       } else {
     81         c2 = e.charCodeAt(n + 1);
     82         c3 = e.charCodeAt(n + 2);
     83         t += String.fromCharCode((r & 15) << 12 | (c2 & 63) << 6 | c3 & 63);
     84         n += 3
     85       }
     86     }
     87     return t
     88   }
     89 }
     90 // Define the string
     91 var string = 'Hello World!';
     92 // Encode the String
     93 var encodedString = Base64.encode(string);
     94 console.log(encodedString); // Outputs: "SGVsbG8gV29ybGQh"
     95 // Decode the String
     96 var decodedString = Base64.decode(encodedString);
     97 console.log(decodedString); // Outputs: "Hello World!"
     98 
     99 //这个自定义的Base64对象可以转码的字符也不仅限于Latin1字符;
    100 var string = "Hello, 中国!";
    101 var encodedString = Base64.encode(string);//"SGVsbG8sIOS4reWbve+8gQ=="
    102 console.log(encodedString);
    103 var decodedString = Base64.decode(encodedString);
    104 console.log(decodedString); //"Hello, 中国!"

     

    四、JavaScript的api支持Base64

    javascript的api支持Base64,因此我们可以很方便的来进行编译码。

    var encodeData = window.btoa("name=xiaoming&age=10")  //编码  bmFtZT14aWFvbWluZyZhZ2U9MTA=

    var decodeData = window.atob(encodeData)   //解码  name=xiaoming&age=10

    btoa和atob是window对象的两个函数,其中btoa是binary to ascii,用于将binary的数据用ascii码表示,即Base64的编码过程,而atob则是ascii to binary,用于将ascii码解析成binary数据,看一个例子:

    1 // Define the stringvar
    2 string = 'Hello World!';
    3 
    4 // Encode the Stringvar
    5 encodedString = btoa(string);  console.log(encodedString); // Outputs: "SGVsbG8gV29ybGQh"
    6 
    7 // Decode the Stringvar
    8 decodedString = atob(encodedString);  console.log(decodedString); // Outputs: "Hello World!"

    但是window.btoa这中编码方式不能直接作用于Unicode字符串,只能将ascci字符串或二进制数据转换成Base64编码过的字符串。

    如果要对Unicode字符进行编码可以将做如下转换:

    var encodeData = window.btoa(window.encodeURIComponent("name=小明&age=10"))  //编码  bmFtZSUzRCVFNSVCMCU4RiVFNiU5OCU4RSUyNmFnZSUzRDEw

    var decodeData = window.decodeURIComponent(window.atob(encodeData))  //解码  name=小明&age=10

    五、通过nodeJs包管理工具安装base64插件:

    npm install --save js-base64

    引入base64:

    import { Base64 } from 'js-base64';

    使用base64:

      编码:Base64.encode();  

      译码:Base64.decode();

  • 相关阅读:
    java8接口新特性
    美团后台开发面试经验
    美团后台开发面试经验
    HashMap源码阅读之get/put/resize方法
    腾讯系统测试面试经验
    携程实习生春招面经-后台开发
    Python-if else流程判断
    python中信息拼接打印
    数据库查询-关于exists的使用
    关于网站防护的建议
  • 原文地址:https://www.cnblogs.com/sunyuweb/p/9092367.html
Copyright © 2020-2023  润新知