当前位置:首页 » 《资源分享》 » 正文

国密SM2前端加密解密示例

25 人参与  2024年04月11日 15:55  分类 : 《资源分享》  评论

点击全文阅读


目录

一、 安装sm2依赖

二、编写代码

1、data中绑定数据

2、公钥加密

3、私钥解密

4、按钮绑定一下,数据可见一下

三、完整代码


一、 安装sm2依赖

npm install --save sm-crypto

二、编写代码

1、data中绑定数据

要改变的数据phone和过程数据copyphone,公钥publicKey和私钥privateKey

具体生成测试公钥私钥可参照SM2加解密

C1为65字节第1字节为压缩标识,这里固定为0x04

publicKey是'04'+公钥X+公钥Y

privateKey直接复制粘贴

实际运行情况下可参考RuoYi前后端分离(登录密码加密)更改为SM2加密,密钥由后端传输

export default {    data() {        return {            copyphone: '',            phone: '',            publicKey: "",            privateKey: "",        }    },

2、公钥加密

    getphone() {            const sm2 = require('sm-crypto').sm2;            var publicKey = this.publicKey;//加密使用            var encrText = this.phone;//例如var enxrText = this.phone;            const cipherMode = 1;            let encryptData = sm2.doEncrypt(encrText, publicKey, cipherMode) // 加密结果            this.copyphone = encryptData;            return '04' + encryptData;//04可不要具体看后端要求        },

3、私钥解密

returnphone() {            const sm2 = require('sm-crypto').sm2;            var privateKey = this.privateKey;            var encrText = this.copyphone;            const cipherMode = 1            let decryptData = sm2.doDecrypt(encrText, privateKey, cipherMode) // 解密结果            this.copyphone = decryptData;//赋值方便处理            return decryptData;        }

4、按钮绑定一下,数据可见一下

<template>    <div>        <navigation_bar></navigation_bar>        <el-tag>原始数据</el-tag><el-input v-model="phone" placeholder="请输入待转换数据">         </el-input>        <el-tag>过程数据</el-tag><el-input v-model="copyphone"></el-input>        <el-tag>公钥</el-tag><el-input v-model="publicKey"></el-input>        <el-tag>私钥</el-tag><el-input v-model="privateKey"></el-input>        <el-button type="primary" @click="getphone()">sm2加密按钮</el-button>        <el-button type="primary" @click="returnphone()">sm2解密按钮</el-button>    </div></template>

三、完整代码

请放在Vue项目下运行

<template>    <div>        <el-tag>原始数据</el-tag><el-input v-model="phone" placeholder="请输入待转换数据"></el-input>        <el-tag>过程数据</el-tag><el-input v-model="copyphone"></el-input>        <el-tag>公钥</el-tag><el-input v-model="publicKey"></el-input>        <el-tag>私钥</el-tag><el-input v-model="privateKey"></el-input>        <el-button type="primary" @click="getphone()">sm2加密按钮</el-button>        <el-button type="primary" @click="returnphone()">sm2解密按钮</el-button>    </div></template><script>// npm install --save sm-crypto// 第一步就是安装依赖//解密使用 var privateKey = "私钥";//加密使用 var publicKey  = "公钥"; export default {    data() {        return {            copyphone: '',            phone: '',            publicKey: "自己生成好的填进来",            privateKey: "自己生成好的填进来",        }    },    methods: {        getphone() {            const sm2 = require('sm-crypto').sm2;            //C1为65字节第1字节为压缩标识,这里固定为0x04            //publicKey是'04'+公钥X+公钥Y            //密钥对生成https://i.goto327.top/CryptTools/SM2.aspx            var publicKey = this.publicKey;//加密使用            var encrText = this.phone;//例如var enxrText = this.phone;            const cipherMode = 1;            let encryptData = sm2.doEncrypt(encrText, publicKey, cipherMode) // 加密结果            this.copyphone = encryptData;            return '04' + encryptData;//04可不要具体看后端要求        },        returnphone() {            const sm2 = require('sm-crypto').sm2;            var privateKey = this.privateKey;            var encrText = this.copyphone;            const cipherMode = 1            let decryptData = sm2.doDecrypt(encrText, privateKey, cipherMode) // 解密结果            this.copyphone = decryptData;//赋值方便处理            return decryptData;        }    }}</script>


点击全文阅读


本文链接:http://zhangshiyu.com/post/93827.html

<< 上一篇 下一篇 >>

  • 评论(0)
  • 赞助本站

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

最新文章

  • 你要战功我给你,妖兽入侵你哭啥高质量好文叶天凌筱完本_你要战功我给你,妖兽入侵你哭啥高质量好文(叶天凌筱)
  • 夫君和小三霸占了我的将军府,我杀疯了阅读_雪儿谭绍木兰全集_小说后续在线阅读_无删减免费完结_
  • 鹿溪小说(鹿溪)终章+番外(穿进恐怖游戏后,我和反派HE了)一口气阅读
  • 完结文留给儿子的副卡月月刷爆,他却因睡桥底被送进收容所列表_完结文留给儿子的副卡月月刷爆,他却因睡桥底被送进收容所(娄墨霆宋佑轩)
  • 你活着,却死在我等你的第三年后续+番外_谨言佳佳温以宁全集_小说后续在线阅读_无删减免费完结_
  • 相思溺于夏时雨小说(裴景澈初念可)章节目录+起始篇章(相思溺于夏时雨)全章无套路在线
  • 未婚夫重生归来叫停手术,把剥开肚子的我困在手术台上40分钟(裴临渊阮离歌)
  • 完结文离婚是你提,净身出户你又哭什么精彩分享列表_完结文离婚是你提,净身出户你又哭什么精彩分享(苏铭余素伊)
  • 全书浏览哥哥重生救我,我带队灭了组织!(陈致远陈知韫)_哥哥重生救我,我带队灭了组织!(陈致远陈知韫)全书结局
  • 全文算命赚功德,我直接飞升成仙(楚天河林风)列表_全文算命赚功德,我直接飞升成仙
  • 八零丈夫抛妻弃子后悔不当初完整文本_顾尧全文_小说后续在线阅读_无删减免费完结_
  • 殉情三年,侯门主母休夫日百棺开道附加(殉情三年,侯门主母休夫日百棺开道)(沈宁鸢谢挽舟)全本浏览阅读连载中

    关于我们 | 我要投稿 | 免责申明

    Copyright © 2020-2022 ZhangShiYu.com Rights Reserved.豫ICP备2022013469号-1