前端 jsencrypt 超长文本分段加密 ，好用请点赞，支持一下
原项目node-rsa 由于运行在node环境 vite没有 process环境报错 运行browser 无法使用。改为encryptlong 由于底层使用jsencrypt库，仍然会报错 于是考虑自己封装分段加密。运行报错 加入 window = this；导致更换为 jsencrypt。短数据加密正常，长数据报错。
·
先说一下遇到的问题 ：
Vite 踩坑
原项目node-rsa 由于运行在node环境 vite没有 process环境 报错 运行browser 无法使用
导致更换为 jsencrypt
运行报错 加入 window = this；
短数据加密正常，长数据报错
改为encryptlong 由于底层使用jsencrypt库，仍然会报错 于是考虑自己封装分段加密
具体代码如下，开箱即用
<!DOCTYPE html>
<html>
<head>
<title>超长文本分段加密</title>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8" />
<style>
* {
margin: 0;
padding: 0;
}
.demo-wrap {
width: 600px;
height: 50px;
margin: 50px auto auto auto;
}
input {
width: 80vw;
height: 4vh;
}
.content-box {
width: 80vw;
height: 30vh;
word-break: break-word;
font-size: 12px;
overflow: scroll;
margin-bottom: 10px;
}
</style>
<script src="http://passport.cnblogs.com/scripts/jsencrypt.min.js"></script>
</head>
<body>
<div class="demo-wrap">
<input
id="inputValue"
placeholder="输入数据或者直接点击使用默认超长JSON数据"
/>
<div style="padding: 1rem 0">
<button type="button" onclick="rsa_encrypt()">RSA加密</button>
<br />
加密后的数据:
</div>
<div id="rsa_encrypted" class="content-box"></div>
<div>
<button type="button" onclick="rsa_decrypt()">RSA解密</button>
<br />
解密后的数据:
</div>
<div id="rsa_decrypted" class="content-box"></div>
</div>
<script type="text/javascript">
function rsa_encrypt() {
let inputData = document.getElementById("inputValue").value;
let data =
inputData ||
JSON.stringify({
title: "超长测试数据",
name1: "赵、钱、孙、李 、周、吴、郑、王、冯、陈、褚、卫、蒋、沈、韩、杨、朱、秦、尤、许、吕、施、张、孔、曹、严、华、金、魏、陶、姜、戚、谢、邹、喻、柏水、窦、章、云、苏、潘、葛、奚、范、彭、郎、鲁、韦、昌、马、苗、凤",
number:
"12345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890",
name2: "花、方、俞、任、袁、柳、酆、鲍、史、唐、费、廉、岑、薛、雷、贺、倪汤、滕、 殷、罗、毕、郝、邬、安、常、乐、于、时 、傅、皮、卞、齐、康、伍余、元、卜、顾、孟、平、黄、和、穆、萧、尹。",
symbol: "~!@#$%^&*()_+{}:/.,",
province1:
"黑龙江省、吉林省、辽宁省:北京市、天津市、河北省、山西省、内蒙古自治区;陕西省、甘肃省、青海省、宁夏回族自治区、新疆维吾尔自河南省、湖北省、湖南省;",
province2:
"山东省、江苏省、安徽省、上海市、浙江省、江西省、福建重庆市、贵州省、四川省、云南省、西藏自治区;广东省、香港特别行政区、澳门特别行政区、海南省、广西",
city: "1、河北省：11个\n\n石家庄市、唐山市、秦皇岛市、邯郸市、邢台市、保定市、张家口市、承德市、沧州市、廊坊市、衡水市\n\n2、山西省：11个\n\n太原市、大同市、阳泉市、长治市、晋城市、朔州市、晋中市、运城市、忻州市、临汾市、吕梁市\n\n3、内蒙古自治区：9个\n\n呼和浩特市、包头市、乌海市、赤峰市、通辽市、鄂尔多斯市、呼伦贝尔市、巴彦淖尔市、乌兰察布市\n\n4、辽宁省：14个\n\n沈阳市、大连市、鞍山市、抚顺市、本溪市、丹东市、锦州市、营口市、阜新市、辽阳市、盘锦市、铁岭市、朝阳市、葫芦岛市\n\n5、吉林省：8个\n\n长春市、吉林市、四平市、辽源市、通化市、白山市、松原市、白城市\n\n6、黑龙江省：12个\n\n哈尔滨市、齐齐哈尔市、鸡西市、鹤岗市、双鸭山市、大庆市、伊春市、佳木斯市、七台河市、牡丹江市、黑河市、绥化市\n\n7、江苏省：13个\n\n南京市、无锡市、徐州市、常州市、苏州市、南通市、连云港市、淮安市、盐城市、扬州市、镇江市、泰州市、宿迁市\n\n8、浙江省：11个\n\n杭州市、宁波市、温州市、嘉兴市、湖州市、绍兴市、金华市、衢州市、舟山市、台州市、丽水市\n\n9、安徽省：16个\n\n合肥市、芜湖市、蚌埠市、淮南市、马鞍山市、淮北市、铜陵市、安庆市、黄山市、阜阳市、宿州市、滁州市、六安市、宣城市、池州市、亳州市\n\n10、福建省：9个\n\n福州市、厦门市、莆田市、三明市、泉州市、漳州市、南平市、龙岩市、宁德市\n\n11、江西省：11个\n\n南昌市、景德镇市、萍乡市、九江市、抚州市、鹰潭市、赣州市、吉安市、宜春市、新余市、上饶市\n\n12、山东省：16个\n\n济南市、青岛市、淄博市、枣庄市、东营市、烟台市、潍坊市、济宁市、泰安市、威海市、日照市、临沂市、德州市、聊城市、滨州市、菏泽市\n\n13、河南省：17个\n\n 郑州市、开封市、洛阳市、平顶山市、安阳市、鹤壁市、新乡市、焦作市、濮阳市、许昌市、漯河市、三门峡市、南阳市、商丘市、信阳市、周口市、驻马店市\n\n14、湖北省：12个\n\n武汉市、黄石市、十堰市、宜昌市、襄阳市、鄂州市、荆门市、孝感市、荆州市、黄冈市、咸宁市、随州市\n\n15、湖南省：13个\n\n长沙市、株洲市、湘潭市、衡阳市、邵阳市、岳阳市、常德市、张家界市、益阳市、郴州市、永州市、怀化市、娄底市\n\n16、广东省：21个\n\n广州市、韶关市、深圳市、珠海市、汕头市、佛山市、江门市、湛江市、茂名市、肇庆市、惠州市、梅州市、汕尾市、河源市、阳江市、清远市、东莞市、中山市、潮州市、揭阳市、云浮市\n\n17、广西壮族自治区：14个\n\n南宁市、柳州市、桂林市、梧州市、北海市、防城港市、钦州市、贵港市、玉林市、百色市、贺州市、河池市、来宾市、崇左市\n\n18、海南省：4个\n\n海口市、三亚市、三沙市、儋州市\n\n19、四川省：18个\n\n成都市、自贡市、攀枝花市、泸州市、德阳市、绵阳市、广元市、遂宁市、内江市、乐山市、南充市、眉山市、宜宾市、广安市、达州市、雅安市、巴中市、资阳市\n\n20、贵州省：6个\n\n贵阳市、六盘水市、遵义市、安顺市、毕节市、铜仁市\n\n21、云南省：8个\n\n昆明市、曲靖市、玉溪市、保山市、昭通市、丽江市、普洱市、临沧市\n\n22、西藏自治区：6个\n\n拉萨市、日喀则市、昌都市、林芝市、山南市、那曲市\n\n23、陕西省：10个\n\n西安市、铜川市、宝鸡市、咸阳市、渭南市、延安市、汉中市、榆林市、安康市、商洛市\n\n24、甘肃省：12个\n\n兰州市、嘉峪关市、金昌市、白银市、天水市、武威市、张掖市、平凉市、酒泉市、庆阳市、定西市、陇南市\n\n25、青海省：2个\n\n西宁市、海东市\n\n26、宁夏回族自治区：5个\n\n银川市、石嘴山市、吴忠市、固原市、中卫市\n\n27、新疆维吾尔自治区：4个\n\n乌鲁木齐市、克拉玛依市、吐鲁番市、哈密市",
});
let dataText = encodeURIComponent(data);
//换成自己的公钥
let publicKey =
"-----BEGIN PUBLIC KEY-----MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAkJEvZHh3Dhqkwo52HxL2wT3oQ+HaxlhHywkoi9mw7XWS/nqTxJ2NRp6lLoOJZvrSvSiKJ0BSONhWuPt+DKq7YReHUCmOzCfBbwTabyDWE7x/1MuB0a7qmpkpidXxmYEumA7Pspi2b1zgyVnaAHzzxv6NE+JrBmktk+TIaGvGXF/Vk3QiMETmKnBGAfCyRoSGUyftKFB4XPysxRWC6754QNRdsqDTGsoOwZOXGzx7wqkH7CJol3ZI7zyT6xY+mLEKQgaLjTC43hwVLvjClfOecW72dPW86yThbu7Yhfag+GUNtYiMCgQjCejt9NImftNOJS5pKPKfHVgRVwZlKGkH/QIDAQAB-----END PUBLIC KEY-----";
let en = new JSEncrypt();
en.setPublicKey(publicKey);
let num = Math.ceil(dataText.length / 117);
let dataArr = [];
for (let i = 0; i < num; i++) {
if (parseInt(117 * (i + 1)) <= dataText.length) {
dataArr[i] = dataText.substring(117 * i, 117 * (i + 1));
} else {
dataArr[i] = dataText.substring(117 * i, dataText.length);
}
dataArr[i] = en.encrypt(dataArr[i]);
}
document.getElementById("rsa_encrypted").innerHTML =
dataArr.join("$split$");
}
function rsa_decrypt() {
let data = document.getElementById("rsa_encrypted").innerHTML;
//换成自己的私钥
let privateKey =
"-----BEGIN RSA PRIVATE KEY-----MIIEpQIBAAKCAQEAkJEvZHh3Dhqkwo52HxL2wT3oQ+HaxlhHywkoi9mw7XWS/nqTxJ2NRp6lLoOJZvrSvSiKJ0BSONhWuPt+DKq7YReHUCmOzCfBbwTabyDWE7x/1MuB0a7qmpkpidXxmYEumA7Pspi2b1zgyVnaAHzzxv6NE+JrBmktk+TIaGvGXF/Vk3QiMETmKnBGAfCyRoSGUyftKFB4XPysxRWC6754QNRdsqDTGsoOwZOXGzx7wqkH7CJol3ZI7zyT6xY+mLEKQgaLjTC43hwVLvjClfOecW72dPW86yThbu7Yhfag+GUNtYiMCgQjCejt9NImftNOJS5pKPKfHVgRVwZlKGkH/QIDAQABAoIBAAuXQGP/TphYZYZd0rWqGROkSYeLx7UoZdUvDkusMAXR6++wV0Gn2ihj1t2UWUNi79uPsQf1ncIGAmoBa/lLBQwDTWuNcXAH7fffPT40tUVO0zb1/BoaOqAbkJuHBkBm/ZvecCOjH9ls6m7qX9KzMf5t8VS7ThZs/2UArlrE7VoBjC10uqB2P/CXtKezFRrp6PmXeHV7sWT+I6HGrZQVKaA4wMZS7O3RlA5rvsTocrJxbI9cSoLt7F3nOcabUvOHTAQYBjDSB6ps8b9mvm7Qf+1OqL+MKUyNKnuZQ4qkDysFeyI6M3F4EcNKj9YYaHc04/kX0+0aDsOqeiEmaume7GcCgYEAw2tQLBbaLsjKdRN4GDi2VcJfTEsnC84Iy5apvj1qSDAklyu5+IsoUw7iDVnMTW/XiS7qCq6Y9jhPy0jygZV3/MYNFPRYtofezI+RDS5oae7QQmFBQlf09QDjziqIK+gzeURjHZBWf61LJRM94vhIGnqTaKd/UkDEHQfBf3uNq0MCgYEAvWIx8KIhsIs/ZPKsf4zkJMA3JcZUOwy42V2qFqPRY2v+e6oqV9t9GgtsLPwo5fR9gFt+rR4q5T+zxb4f3LyRCgGQKkjVpZmppzhpQFn6fpk/CelrmdfJcGZbkWn+b0L6JzOF9lK51MuPhyAsMc9pZ9i0VeQiQsQC4C6ZmBYmK78CgYEAvom31gVCHzOwE480HYnOXrfya1UrcRsnADqart767f/i7XK5FVm5q6JrTlEsHqTaJuwTTu8GPaySQMeTjD3MjC4fOzsz9GVuG04wRAXn0MIFVXO2SZWxReHkPHTD6OuypJ7FdWHytPKmvjOQt+kVhJvXdsc6IVz82sFhLYeujjkCgYEAnssCArl/NA9dxV/xITXaabI9y0+jequtJpzxq/AJ9qorhDdnL6mbGMZxGrsH8+Bvhruw2KlN4FDshKZpAuWdW116KupNMYBJjyuunMWVUqdeAwqULTeQ8MzyhFfyfgoTw+Dgt2wf4vwXyX5BcDZwNCGw+7/Atmix3JVWNf6EXPMCgYEAujtCTkkqQOzIgarRqoITBPCruVJNcqGrQKDC52V0A8P+yfKqEYxhEhoL3zXpTNaiZDGzpBWs+CGk/n8x1y+sY0AvSJzP0UtaFC6p+SK0eEUElIu+9u70JM6PigxLe0ouYTtkz9wulyRFA1uCY4swKzS7cMqn6S8p64DYtFLEVO4=-----END RSA PRIVATE KEY-----";
let en = new JSEncrypt();
en.setPrivateKey(privateKey);
let result = [];
if (data.includes("$split$")) {
let dataArr = data.split("$split$");
for (let i = 0; i < dataArr.length; i++) {
result.push(en.decrypt(dataArr[i]));
}
result = decodeURIComponent(result.join(""));
} else {
result = decodeURIComponent(en.decrypt(data));
}
document.getElementById("rsa_decrypted").innerHTML = result;
}
</script>
</body>
</html>
技术共进，成长同行——讯飞AI开发者社区
更多推荐
3
0- 0
已为社区贡献2条内容
所有评论(0)