vue crypto-js加密简单使用(加密解密)

请添加图片描述

<template>
  <div>
    <el-input v-model="password" show-password />
    <el-button type="primary" @click="encryptionBtn">加密</el-button>
    <el-button type="primary" @click="decryptBtn">解密</el-button>
  </div>
</template>

<script>
import * as CryptoJS from "crypto-js";

export default {
  name: 'Encryption',
  components: {},
  props: {},
  data() {
    return {
      password: '',
      keyStr: 'abcdefghijklnmop',
      encryptionTit: '',
      decryptTit: '',
    }
  },
  filters: {},
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  beforeDestroy() {},
  methods: {
    encryptionBtn() {
      this.encryptionTit = this.encryption(this.password, this.keyStr)
      console.log(this.encryptionTit)
    },
    decryptBtn() {
      this.decryptTit = this.decryption(this.encryptionTit, this.keyStr)
      console.log(this.decryptTit)
    },
    // 加密处理
    encryption(password, keyStr) {
      keyStr = keyStr || 'abcdefghijklnmop' // 秘钥 自定义 要保持一致
      var key = CryptoJS.enc.Latin1.parse(keyStr)
      var iv = key;
      var encrypt = CryptoJS.AES.encrypt(password, key, { iv: iv, mode: CryptoJS.mode.CFB, padding: CryptoJS.pad.NoPadding })
      return encrypt.toString()
    },
    // 解密处理
    decryption(password, keyStr) {
      keyStr = keyStr || 'abcdefghijklnmop' // 秘钥 自定义 要保持一致
      var key = CryptoJS.enc.Latin1.parse(keyStr)
      var iv = key;
      var decrypt = CryptoJS.AES.decrypt(password, key, { iv: iv, mode: CryptoJS.mode.CFB, padding: CryptoJS.pad.NoPadding })
      return CryptoJS.enc.Latin1.stringify(decrypt).toString()
    }
  }
}
</script>

<style scoped lang="less">
</style>


版权声明:本文为qq_42619759原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。