首页 > 其他分享 >vue加goframe使用AES加解密(记录)

vue加goframe使用AES加解密(记录)

时间:2023-04-17 19:57:35浏览次数:35  
标签:AES vue const 加解密 iv mode 加密 CryptoJS

vue加goframe使用AES加解密

首先,需要在前端使用Vue的crypto-js库来进行AES加解密,可以使用以下命令进行安装:

npm install crypto-js

然后在需要加解密的组件中引入该库:

import CryptoJS from 'crypto-js'

对于加密,可以使用以下代码:

const key = CryptoJS.enc.Utf8.parse('1234567890123456') // 加密密钥,必须为16位
const iv = CryptoJS.enc.Utf8.parse('1234567890123456') // 偏移量,必须为16位
const encrypted = CryptoJS.AES.encrypt(data, key, {
  iv: iv,
  mode: CryptoJS.mode.CBC,
  padding: CryptoJS.pad.Pkcs7
})
const encryptedStr = encrypted.toString()

其中,data为需要加密的字符串,encryptedStr为加密后的字符串。

对于解密,可以使用以下代码:

const key = CryptoJS.enc.Utf8.parse('1234567890123456') // 加密密钥,必须为16位
const iv = CryptoJS.enc.Utf8.parse('1234567890123456') // 偏移量,必须为16位
const decrypted = CryptoJS.AES.decrypt(data, key, {
  iv: iv,
  mode: CryptoJS.mode.CBC,
  padding: CryptoJS.pad.Pkcs7
})
const decryptedStr = decrypted.toString(CryptoJS.enc.Utf8)

其中,data为需要解密的字符串,decryptedStr为解密后的字符串。

在后端使用goframe框架进行AES加解密,可以使用go语言内置的crypto/aes包。以下是一个简单的示例:

package main

import (
	"crypto/aes"
	"crypto/cipher"
	"encoding/base64"
	"fmt"
)

func main() {
	key := []byte("1234567890123456") // 加密密钥,必须为16位
	iv := []byte("1234567890123456")  // 偏移量,必须为16位

	// 加密
	plaintext := []byte("hello world")
	block, err := aes.NewCipher(key)
	if err != nil {
		panic(err)
	}
	ciphertext := make([]byte, len(plaintext))
	mode := cipher.NewCBCEncrypter(block, iv)
	mode.CryptBlocks(ciphertext, plaintext)
	encryptedStr := base64.StdEncoding.EncodeToString(ciphertext)
	fmt.Println(encryptedStr)

	// 解密
	ciphertext, err = base64.StdEncoding.DecodeString(encryptedStr)
	if err != nil {
		panic(err)
	}
	plaintext = make([]byte, len(ciphertext))
	mode = cipher.NewCBCDecrypter(block, iv)
	mode.CryptBlocks(plaintext, ciphertext)
	decryptedStr := string(plaintext)
	fmt.Println(decryptedStr)
}

其中,encryptedStr为加密后的字符串,decryptedStr为解密后的字符串。

标签:AES,vue,const,加解密,iv,mode,加密,CryptoJS
From: https://www.cnblogs.com/ZJMars/p/17327251.html

相关文章

  • vue常用组件之confirm用法及说明
    vue常用组件之confirm用法及说明原文链接:https://www.jb51.net/article/263587.htm+目录vue组件之confirmvue自定义confirm弹窗(全局组件)全局组件方式vue组件之confirm一些自带的方法,比如alert,confirm等,往往由于浏览器不同而展现出不同的样式,为了统一,我们可以自己实现简单封装,......
  • vue3微信公众号商城项目实战系列(6)用户登录
    1.一个商城要实现购物的功能,需要能识别用户的身份,这样才能完成加购物车,下单,付款等操作。但微信公众号商城和PC端商城有些不一样,区别在于微信公众号商城使用微信支付的时候需要一个openid的参数(以后再具体讲)这个参数必须访问微信公众号提供的接口才能获取到,基于这个原因,用户登录......
  • Vue3 ref函数处理基本类型或对象类型
    基本类型视频对象类型视频2.ref函数作用:定义一个响应式的数据语法:constxxx=ref(initValue)创建一个包含响应式数据的引用对象(reference对象,简称ref对象)。JS中操作数据:xxx.value模板中读取数据:不需要.value,直接:<div>{{xxx}}</div>备注:接收的数据可以是:基本......
  • vue插槽
    我们经常会有封装组件的需求,组件需要的往往不只有数据,有时候我们要给一个模块做内容方面的可自定义,比如我封装了一个黑板,但是我有时希望上面是字,又有时希望上面是图画,这就要用到插槽了一.插槽的基本用法子组件<template><el-row><slot></slot></el-ro......
  • 使用vue-cli创建第一个vue项目
    命令提示符切换至需要创建项目的目录:直接在路径输入cmd在按键盘的enter键打开的终端就直接切换到该目录下(1)输入以下命令:vuecreate项目名称(2)我这里选手动选择,键盘上下按钮,选完后按enter键(3)我这里选Babel和CSS,键盘上下按钮,选中或取消选中按空格,选完后按enter键(4)我这里选......
  • vue登录路由权限管理
    前言在开发Web应用程序时,常常需要进行登录验证和权限管理。Vue是一款流行的JavaScript框架,提供了一套灵活的路由管理工具,可以方便地实现登录路由权限管理。本篇博客将介绍如何使用Vue来实现这些功能。登录验证首先,我们需要在Vue应用程序中对用户进行登录验证。在Vue中,我们可以通......
  • vscode调试 vue
    1.配置vue.config.js加上devtool:'source-map'//开发环境可以加,生产环境,别人可以看到源代码,不完全不要加 2.添加launch.jsonvscode打开调试窗口,在下图箭头指向的位置点击打开配置文件launch.json:   3.配置远程调试1)浏览器快捷方式设置浏览器桌面快捷方式......
  • vue全家桶进阶之路32:Vue3 WatchEffect和watch 监听
    在Vue3中,watchEffect是一个用于监听响应式数据变化的API。它可以在函数内部自动跟踪数据的依赖,并在依赖变化时重新运行函数。watchEffect 的作用以及各个参数的功能讲解:watchEffect(effect:(onInvalidate:InvalidateCbRegistrator)=>void|(()=>void)|Promise<vo......
  • vuex的使用
    目录简介vuex的环境调用逻辑定义vuex中的内容简介官网:https://vuex.vuejs.org/zh/在Vue中实现集中式状态(数据)管理的一个Vue插件,对vue应用中多个组件的共享状态进行集中式的管理(读/写),也是一种组件间通信的方式,且适用于任意组件间通信。Vuex是一个专为Vue.js应用程序开发......
  • Vue - watcher原理
    原理Watcher原理是先把自己设置到全局唯一指定的位置(window.target),然后读取数据。因为读取了数据,所以会触发这个数据的getter。然后在getter中就会从全局唯一的那个位置读取真正读取数据的watcher,并把这个watcher收集到Dep中去。通过这样的方式,watcher可以主动去订阅任意一个数......