166 lines
5.5 KiB
HTML
166 lines
5.5 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
<head>
|
|||
|
<meta charset="utf-8">
|
|||
|
<!--删除苹果默认的工具栏和菜单栏,默认为no显示工具栏和菜单栏。-->
|
|||
|
<meta name="apple-mobile-web-app-capable" content="yes"/>
|
|||
|
<!--QQ强制全屏-->
|
|||
|
<meta name="x5-fullscreen" content="true">
|
|||
|
<!--UC强制全屏-->
|
|||
|
<meta name="fullscreen" content="yes">
|
|||
|
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
|
|||
|
<title></title>
|
|||
|
<link rel="stylesheet" href="/static/cdn/element-ui/2.15.1/theme-chalk/index.min.css">
|
|||
|
<script src="/static/cdn/vue/2.6.11/vue.min.js"></script>
|
|||
|
<script src="/static/cdn/element-ui/2.15.1/index.js"></script>
|
|||
|
<script src="/static/cdn/jquery/3.6.0/jquery.min.js"></script>
|
|||
|
|
|||
|
<script src="/static/js/functions.js?v=0.6.9"></script>
|
|||
|
<link rel="icon" href="/static/images/favicon.ico">
|
|||
|
<style>
|
|||
|
.chatCenter{
|
|||
|
max-width: 600px;
|
|||
|
}
|
|||
|
</style>
|
|||
|
</head>
|
|||
|
<body>
|
|||
|
<div id="app" class="chatCenter">
|
|||
|
<template>
|
|||
|
<el-input
|
|||
|
type="textarea"
|
|||
|
autosize
|
|||
|
placeholder="AES key"
|
|||
|
v-model="aesKey">
|
|||
|
</el-input>
|
|||
|
<div style="margin: 20px 0;"></div>
|
|||
|
<el-input
|
|||
|
type="textarea"
|
|||
|
:autosize="{ minRows: 2, maxRows: 4}"
|
|||
|
placeholder="加密前内容"
|
|||
|
v-model="aesContent">
|
|||
|
</el-input>
|
|||
|
<div style="margin: 20px 0;"></div>
|
|||
|
<el-input
|
|||
|
type="textarea"
|
|||
|
:autosize="{ minRows: 2, maxRows: 4}"
|
|||
|
placeholder="加密后内容"
|
|||
|
v-model="aesContent2">
|
|||
|
</el-input>
|
|||
|
<div style="margin: 20px 0;"></div>
|
|||
|
<el-button type="primary" @click="encrypt">AES加密</el-button>
|
|||
|
<el-button type="primary" @click="decrypt">AES解密</el-button>
|
|||
|
<div style="margin: 20px 0;"></div>
|
|||
|
<el-input
|
|||
|
type="textarea"
|
|||
|
autosize
|
|||
|
placeholder="公钥"
|
|||
|
v-model="publicKey">
|
|||
|
</el-input>
|
|||
|
<div style="margin: 20px 0;"></div>
|
|||
|
<el-input
|
|||
|
:autosize="{ minRows: 2, maxRows: 4}"
|
|||
|
type="textarea"
|
|||
|
autosize
|
|||
|
placeholder="私钥"
|
|||
|
v-model="privateKey">
|
|||
|
</el-input>
|
|||
|
<div style="margin: 20px 0;"></div>
|
|||
|
<el-input
|
|||
|
:autosize="{ minRows: 2, maxRows: 4}"
|
|||
|
type="textarea"
|
|||
|
:autosize="{ minRows: 2, maxRows: 4}"
|
|||
|
placeholder="加密前内容"
|
|||
|
v-model="rsaContent">
|
|||
|
</el-input>
|
|||
|
<div style="margin: 20px 0;"></div>
|
|||
|
<el-input
|
|||
|
type="textarea"
|
|||
|
:autosize="{ minRows: 2, maxRows: 4}"
|
|||
|
placeholder="加密后内容"
|
|||
|
v-model="rsaContent2">
|
|||
|
</el-input>
|
|||
|
<div style="margin: 20px 0;"></div>
|
|||
|
<el-button type="primary" @click="encryptRsa">RSA公钥加密</el-button>
|
|||
|
<el-button type="primary" @click="decryptRsa">RSA私钥解密</el-button>
|
|||
|
|
|||
|
<el-button type="primary" @click="signRsa">RSA2私钥签名</el-button>
|
|||
|
<el-button type="primary" @click="checkSignRsa">RSA2验证签名</el-button>
|
|||
|
</template>
|
|||
|
</div>
|
|||
|
</body>
|
|||
|
|
|||
|
|
|||
|
<script>
|
|||
|
|
|||
|
new Vue({
|
|||
|
el: '#app',
|
|||
|
delimiters:["<{","}>"],
|
|||
|
data: {
|
|||
|
aesKey:"",
|
|||
|
aesContent:"",
|
|||
|
aesContent2:"",
|
|||
|
publicKey:"",
|
|||
|
privateKey:"",
|
|||
|
rsaContent:"",
|
|||
|
rsaContent2:"",
|
|||
|
},
|
|||
|
methods: {
|
|||
|
encrypt(){
|
|||
|
var _this=this;
|
|||
|
$.get("/other/aesEncrypt",{content:this.aesContent,key:this.aesKey},function (res) {
|
|||
|
_this.aesContent2=res.result;
|
|||
|
})
|
|||
|
|
|||
|
},
|
|||
|
decrypt(){
|
|||
|
var _this=this;
|
|||
|
$.get("/other/aesDecrypt",{content:this.aesContent2,key:this.aesKey},function (res) {
|
|||
|
_this.aesContent=res.result;
|
|||
|
})
|
|||
|
},
|
|||
|
|
|||
|
encryptRsa(){
|
|||
|
var _this=this;
|
|||
|
$.get("/other/rsaEncrypt",{content:this.rsaContent,
|
|||
|
publicKey:this.publicKey,
|
|||
|
privateKey:this.privateKey,
|
|||
|
},function (res) {
|
|||
|
_this.rsaContent2=res.result;
|
|||
|
});
|
|||
|
|
|||
|
},
|
|||
|
decryptRsa(){
|
|||
|
var _this=this;
|
|||
|
$.get("/other/rsaDecrypt",{content:this.rsaContent2,
|
|||
|
publicKey:this.publicKey,
|
|||
|
privateKey:this.privateKey,
|
|||
|
},function (res) {
|
|||
|
_this.rsaContent=res.result;
|
|||
|
});
|
|||
|
},
|
|||
|
signRsa(){
|
|||
|
var _this=this;
|
|||
|
$.post("/other/signRsa",{content:this.rsaContent,
|
|||
|
publicKey:this.publicKey,
|
|||
|
privateKey:this.privateKey,
|
|||
|
},function (res) {
|
|||
|
_this.rsaContent2=res.result;
|
|||
|
});
|
|||
|
},
|
|||
|
checkSignRsa(){
|
|||
|
var _this=this;
|
|||
|
$.post("/other/checkSignRsa",{
|
|||
|
source:this.rsaContent,
|
|||
|
sign:this.rsaContent2,
|
|||
|
publicKey:this.publicKey,
|
|||
|
privateKey:this.privateKey,
|
|||
|
},function (res) {
|
|||
|
alert(res.result)
|
|||
|
});
|
|||
|
}
|
|||
|
},
|
|||
|
created: function () {
|
|||
|
}
|
|||
|
})
|
|||
|
</script>
|
|||
|
</html>
|