jiazhizhong/spring-boot-base-demo
1
0
Fork 0
mirror of https://github.com/RemainderTime/spring-boot-base-demo.git synced 2026-03-02 01:50:44 +08:00
Code Issues Packages Projects Releases Wiki Activity

实现简单登录成功页面并传递token

Browse Source
This commit is contained in:
xiongfeng
2022-07-05 16:22:44 +08:00
parent d98093981e
commit c0ef54f9b7
2 changed files with 48 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/main/resources/templates/login.html
View File

@@ -14,6 +14,7 @@
}
</style>
<body>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
<!-- 引入样式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
@@ -23,6 +24,7 @@
<script src="https://cdn.bootcdn.net/ajax/libs/jsencrypt/3.2.1/jsencrypt.min.js"></script>
<!--http 请求插件-->
<script src="https://cdn.bootcdn.net/ajax/libs/axios/0.27.2/axios.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/vue-router/4.1.0-beta.2/vue-router.js"></script>
<div id="app">
@@ -53,13 +55,17 @@
var json = JSON.stringify(data);
var cipher = this.encryptByPublicKey(json);
console.log("密文 ：" + cipher);
var url = "http://localhost:8088/user/login";
axios.post(url, {
encryptedData: cipher,
})
.then(function (response) {
console.log(response);
var data = response.data;
if (data.code == 200) {
window.location.href = "success.html?token=" + data.data.token
} else {
alert(data.message)
}
})
.catch(function (error) {
console.log(error);

40
src/main/resources/templates/success.html Normal file
View File

@@ -0,0 +1,40 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
<title>登录成功</title>
</head>
<body>
<div id="app">
<h1>这是登录成功页面</h1>
<h1>
token:
<span style="color: forestgreen">{{token}}</span>
</h1>
</div>
</body>
<script>
new Vue({
el: '#app',
data: {
token: ''
},
mounted: function () {
this.token = this.getData("token");
},
methods: {
getData: function (name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
var r = window.location.search.substr(1).match(reg); //匹配目标参数
if (r != null) return unescape(r[2]);
return null; //返回参数值
}
}
})
;
</script>
</html>