vue3
1. 安装 sm2 加密库
首先,你需要安装适合的 sm2 加密库。在前面的讨论中提到了 js-sm2 这个 javascript 实现的 sm2 加密算法库,你可以使用 npm 或者 yarn 进行安装
npm install sm-crypto # 或者 yarn add sm-crypto或者pnpm install sm-crypto
2. 引入 sm2 库并使用
在 vue 3 的项目中,一般来说你会在需要加密的组件或者文件中引入 sm2 库,并使用其提供的加密、解密等功能。以下是一个简单的示例:
// 在需要加密的组件或者文件中引入
import smcrypto from 'sm-crypto'
const signin = async () => {
const userlogin = {
username: formdata.username,
password: '04' + smcrypto.sm2.doencrypt(formdata.password, publickey.value),
code: code.value,
captcha: formdata.captcha,
publickey: publickey.value
}
loginapi(userlogin)
.then(async (res) => {
...})
}
这里是直接使用加密,也可以封装成函数vue2
安装 sm-crypto
你可以通过 npm 安装 sm-crypto:
npm install sm-crypto --save
封装 utils
'@/utils/smcrypto.js'
// utils.js
import smcrypto from 'sm-crypto';
// sm2 加密
export function encrypt (plaintext, publickey) {
try {
const ciphermode = 1; // 1 - c1c3c2,0 - c1c2c3
const ciphertext = smcrypto.sm2.doencrypt(plaintext, publickey, ciphermode);
return ciphertext;
} catch (error) {
console.error('sm2 encryption error:', error);
return null;
}
}
在 vue 组件中使用
在你的 vue 组件中引入 smcrypto.js 并使用 encrypt方法:
import { encrypt } from '@/utils/smcrypto.js';
// 获取加密私钥
getpublickey() {
api.publickey().then((res) => {
this.param.rsatoken = res.data.rsatoken;
this.rsakey = res.data.rsakey;
});
},
//登录请求参数
let data = {
password: this.param.password,
username: this.param.username,
captchacode: this.param.captchacode,
captchaid: this.param.captchaid,
rsatoken: this.param.rsatoken,
// authcode: this.param.authcode,
checked: this.param.checked
};
data.password = encrypt(this.param.password, this.rsakey);
//发起登录请求
//...总结
到此这篇关于前端js sm2实现加密的文章就介绍到这了,更多相关前端 js sm2加密内容请搜索代码网以前的文章或继续浏览下面的相关文章希望大家以后多多支持代码网!
发表评论