vue [SM2 (encryption-decryption | encryption, signature verification), SM4 (encryption-decryption), Base64 (encryption-decryption), MD5 encryption, RSA encryption/decryption, encryption/decryption]

1.SM2

1. Project root directory installation: SM2 component
    npm install --save sm-crypto
2. Encryption and decryption
    // Get SM2 object
    const sm2 = require('sm-crypto').sm2;
    const cipherMode = 1 // 1 - C1C3C2, 0 - C1C2C3, default is 1
    // public key
    var publicKeyServer = 'xxxxxxxxxxx';
    // private key
    var privateKeyWeb = 'xxxxxxxx';
     
    //If the encrypted string a is given to the server here, add 04 + a
    var a=sm2.doEncrypt('SM2 encryption and decryption precautions', publicKeyServer, 1)
     console.log("SM2 encrypted content:" + a);
     
    //If the front-end decrypts the string starting with 04 returned by the back-end, remove the 04 and decrypt it.
    var b=sm2.doDecrypt(a,privateKeyWeb,1) //Decryption result
    console.log("sm2 decrypted content:" + b);
3. Add and unsign

    The backend is java and the dependencies used are as follows:
    <dependency>
        <groupId>org.bouncycastle</groupId>
        <artifactId>bcprov-jdk15on</artifactId>
        <version>1.65</version>
    </dependency>
    
    The current version of Java is basically based on the BC library. The new version 1.66BC library can already interoperate with other languages.
    Its default return is {der: true, hash: true}. Just bring this parameter when verifying.

    Signature: sm2.doSignature(msg, privateKey, { hash:true, der:true }))

    Signature verification: sm2.doVerifySignature(msg, vSign, publicKey, { hash:true, der:true })
4. Add, unsign, and list:

    const sm2 = require('sm-crypto').sm2;
    // ciphertext participating in signing
    const msg = '48656c6c6f20576f726c6420313432383537'
    // public key
    const publicKey ='04D3FD56FFAC7AFA6A39FF40A73BA2921F7AB723A59AA03B0914E893A544A69F4DCF8BB034BE4DF5072206FB01469F0F7F267A6B64CB5AA57BC564E18EA2EEDD1D'
    //The signature after adding the signature
    const vSign = '3045022100fb69fecb149ce9ae9115eb979803139cc9558c0e7bf512f994a1a16ddc8a2d6302205d40dc89e093e73a450160a44e25b1776fcc428f49750 0d59e476f5e46820ca2'
    //Verify signature
    const ver2 = sm2.doVerifySignature(msg, vSign, publicKey, { hash:true, der:true });
    
    console.log(ver2);

2.SM4

1. Project root directory installation: Sm4 component
    npm install gm-crypt
2. Encryption and decryption
    // Get SM4 object
    const SM4 = require("gm-crypt").sm4;
    //Configure sm4 parameters
    let sm4Config = {
      key: "gDg4g8CQyIrs^bv2", //The key value here is the key encrypted by sm4 in the backend
      mode: "ecb", // There are two encryption methods, ecb and cbc.
        //It also depends on how the backend is defined, but if it is cbc, an iv parameter will be added below, but not for ecb.
      cipherType: "base64" // The backend selects the Base64 method to encrypt the sm4 encryption result to the frontend for decryption
    };
    //Initialize object
    let sm4 = new SM4(sm4Config);
3. Encryption and decryption operations, examples:
    -- add
    let con = sm4.encrypt("Hello World 9999");
    -- untie
    let t =sm4.decrypt(con);
4. Encryption and decryption examples:
    // sm4 encryption and decryption
    const SM4 = require("gm-crypt").sm4;
    //Configure sm4 parameters
    let sm4Config = {
        key: "SMF_KEY:14285789", //This key value here is required from the backend
        mode: "ecb",// There are two encryption methods, ecb and cbc. It also depends on how the backend is defined.
                    //But if it is cbc, an iv will be added below.
        cipherType: "base64" // The backend selects the Base64 method to encrypt the ciphertext.
    };
    let sm4 = new SM4(sm4Config);
    let con = sm4.encrypt("Hello World 9999");
    console.log("SM4-Encryption: " + con);
    let t =sm4.decrypt(con);
    console.log("SM4-Decryption: " + t)
    
5. Overview
    There are two modes of sm4 encryption: ecb and cbc. The differences between the two modes are as follows (the following text comes from Baidu):

    1. Different advantages:
    
    ECB mode: 1. Simple; 2. Conducive to parallel computing; 3. Errors will not be transmitted;
    
    CBC mode: 1. Not prone to active attacks, with better security than baiECB, suitable for transmitting long messages, and is the standard for SSL and IPSec.
    
    2. Different disadvantages:
    
    ECB mode: 1. A mode that cannot hide plaintext; 2. It is possible to actively attack plaintext;
    
    CBC mode: 1. Not conducive to parallel computing; 2. Error propagation; 3. Initialization vector IV is required
    
    3. Different concepts
    
    1. ECB mode, also known as Electronic codebook mode: Electronic codebook, is the simplest block cipher encryption mode.
       Before encryption, it is divided into several blocks according to the encryption block size (for example, AES is 128 bits).
       Each block is then individually encrypted using the same key and decrypted in the same way.
    
    2. Cipher-block chaining (CBC, Cipher-block chaining) mode, invented by IBM in 1976.
       Each plaintext block is XORed with the previous ciphertext block before being encrypted. In this approach,
       Each ciphertext block depends on all the plaintext blocks that precede it. At the same time, in order to ensure the uniqueness of each message,
       The initialization vector IV is required in the first block. 

3.Base64

1. Install in the project root directory

    npm install --save js-base64

2. Introduce it into the project file

    let base64 = require('js-base64').Base64

3. Use in project files

    let q = base64.encode("1234567890ASDFGH");
    let u = base64.decode(q);

4. Add and decrypt real columns:

    // Base64 encryption and decryption
    let base64 = require('js-base64').Base64
    let q = base64.encode("1234567890ASDFGH");
    console.log("Base64-encryption-ciphertext:" + q);
    let u = base64.decode(q);
    console.log("Base64-decryption-plaintext:" + u);

4.md5

1. Install in the project root directory
    npm install --save js-md5
2. In the main.js file, introduce it and hang md5 on the vue prototype to make it universal.
    import md5 from 'js-md5'
    Vue.prototype.$md5 = md5
3. Use
    let pwd = '1qaz@WSX#EDC';//assumed to be password
    let newpwd = this.$md5(pwd);//Encryption
    console.log(newpwd)//View the encrypted password

5.RSA encryption/decryption

Installation
    npm install jsencrypt --save-dev
    npm install encryptlong -S

1. Dependency introduction [main.js]

    /* Introduce jsencrypt to implement data RSA encryption and error when processing long text data jsencrypt.js Message too long for RSA */
    import JSEncrypt from 'jsencrypt';
    /* Introduce encryptlong to implement data RSA encryption. Encryptlong is a long text segmented encryption and decryption function based on the jsenc rypt extension. */
    import Encrypt from 'encryptlong';
    
    Vue.prototype.$jsEncrypt = JSEncrypt

2. Location of use
let publicKey = 'MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCcBc + dUnGkfw6/DI46juK99HX6TzidbNnlqInhySf4jNz0HkaMGgO3l + /6IdGMH2X90px + qUhgQ8IF9a5B9mFM2jKMu6MBk9h0mQ nUOnz4Iarh80r6Rnc33iK554Rjep0J7z/MBSWxnZY5PTh + xXE45XfBx7gK9XpZZUEd7R7fIwIDAQAB'
let privateKey = 'MIICdwIBADANBgkqhkiG9w0BAQEFAASCAmEwggJdAgEAAoGBAJwFz51ScaR/Dr8MjjqO4r30dfpPOJ1s2eWoieHJJ/iM3PQeRowaA7eX7/oh0YwfZf3SnH6pSGBDwgX1rkH2YUzaMoy7owGT2HSZ CdQ6fPghquHzSvpGdzfeIrnnhGN6nQnvP8wFJbGdljk9OH7FcTjld8HHuAr1elllQR3tHt8jAgMBAAECgYA + a0i7LN + QKtDQeApyvPVTf3ivkoAY4xJtgbbf4KUgF + LRu0cIB + RSz/NPA7acs3cPS/IV7k 2pTZJS5g44D4SvJXPIQiz89eukoH2O2blbK2J6wOCvQgqlT1ThDZjSRzmkzX21zy8wQZQp3igjUYYrSViTHtaY2RtzY75Ep3DosQJBAMpNYsONn9PGtT + e73rT1Zswq1F//DMV + sUrZKjMVKb f6KH0yHIYdULaID2LwF/uchDm5J34jVCxC/TP6rvXkOkCQQDFb6/4K0LtLrYt/uG/lx8Zx3lQ54f0Xt9TPD4wEIeqMbD/AD + unYDFvj3JOKzsJAKPmE8pmDQxUz4AJpmM6EgrAkEAxGv + yQ BpfqYgtXUL8KZdcCEBNlCd/rwIkAhh48MBLkWZCicxuBYnRJGlXByk3IAYIHEO6JK8IuzEPx7hOyFCgQJBAJ9xA52ZajHagDsC09ICO5Z49Wq1n6BkIVu5kcsE/ loeSP6Vd9gOz9hhOspOX69PoVXPPVAs2LFgtPgwM96MEwMCQA0Iw2qOz11ta2cNhqb2EvX3xMuX19uZ26NmoSDhc0smXYXonEkq1nXOgr5k + p0G1Ud7tosFJmomc5cKWkpy8Pk='

    //Add signature
    let jse = new JSEncrypt();
    //Public key plus signature
    jse.setPublicKey(publicKey);
    let mima = jse.encrypt('Encrypting')
    console.log('Encryption:' + mima)
    // Private key signature
    jse.setPrivateKey(privateKey)
    console.log('Decrypt:' + jse.decrypt(mima))

The knowledge points of the article match the official knowledge files, and you can further learn relevant knowledge. Vue entry skill tree Home page Overview 39451 people are learning the system