Mount global method

rsa encryption with jsencrypt

Original link: Js parameter RSA encrypted transmission, use of jsencrypt.js - CSDN blog*
https://blog.csdn.net/p312011150/article/details/80264144
(there is a mistake in the original text. There is no need to convert +, rsa has already done base64 transcoding.)

1.Installation dependency   npm install jsencrypt  
2.stay main.js Introduce   import { JSEncrypt } from 'jsencrypt'  
3.Mount global method
//JSEncrypt encryption method
Vue.prototype.$encryptedData = function(publicKey, data) {
  //new an object
  let encrypt = new JSEncrypt()
  //Setting public key
  encrypt.setPublicKey(publicKey)
  //password is the data to be encrypted. You don't need to pay attention to the + sign here, because rsa itself has already transcoded base64, and there is no +. It's all binary data
  let result = encrypt.encrypt(password)
  return result
}
//JSEncrypt decryption method
Vue.prototype.$decryptData = function(privateKey, data) {
  // New JSEncrypt object
  let decrypt = new JSEncrypt()
  // Set private key
  decrypt.setPrivateKey(privateKey)
  // Declassified data
  let result = decrypt.decrypt(secretWord)
  return result
}

Global mixing

Install to Vue project using yarn

yarn add jsencrypt --dep

Or use npm

npm install jsencrypt --dep

Mix in

import { JSEncrypt } from 'jsencrypt'
export const RsaMixin = {
    methods: {
        //  encryption
        encryptedData(publicKey, data) {
          // New JSEncrypt object
          let encryptor = new JSEncrypt();
          // Setting public key
          encryptor.setPublicKey(publicKey);
          // Encrypted data
          return encryptor.encrypt(data);
        },
        // Decrypt
        decryptData(privateKey,data){
          // New JSEncrypt object
          let decrypt= new JSEncrypt();
          // Set private key
          decrypt.setPrivateKey(privateKey);
          // Declassified data
          decrypt.decrypt(secretWord);
        }
  }
}

Introduce

<script>
  import InvoiceRecordModal from './modules/InvoiceRecordModal'
  import { RsaMixin } from '@/mixins/RsaMixin'

  export default {
    name: "InvoiceRecordList",
    //In this case, you can call the mixed method directly
    mixins:[RsaMixin],
    data(){},
    computed:{}
  }
</script>

Methods encapsulated in single VUE file

Install to Vue project using yarn

yarn add jsencrypt --dep

Or use npm

npm install jsencrypt --dep

Introducing jsencrypt

import { JSEncrypt } from 'jsencrypt'

Method

methods: {
    //  encryption
    encryptedData(publicKey, data) {
      // New JSEncrypt object
      let encryptor = new JSEncrypt();
      // Setting public key
      encryptor.setPublicKey(publicKey);
      // Encrypted data
      return encryptor.encrypt(data);
    },
    // Decrypt
    decryptData(privateKey,data){
      // New JSEncrypt object
      let decrypt= new JSEncrypt();
      // Set private key
      decrypt.setPrivateKey(privateKey);
      // Declassified data
      decrypt.decrypt(secretWord);
    }
  }

Standing on the shoulders of giants picking apples:

Link: https://www.jianshu.com/p/084548516410 ()
Https://segmentfault.com/a/11900018896698 (Global blending and single file method)
https://www.jianshu.com/p/084548516410 (global registration)