bookshelfplus/bookshelfplus
1
0
Fork 0
mirror of https://gitee.com/bookshelfplus/bookshelfplus synced 2025-09-01 22:53:29 +08:00
Code Issues Projects Releases Wiki Activity GitHub Gitee

localStorage操作统一使用localStorageUtils完成

Browse Source
This commit is contained in:
小墨
2022-04-06 13:44:47 +08:00
parent 69b46b5e97
commit 885f2b68e7
12 changed files with 149 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
bookshelfplus-frontend/public/assets/javascripts/localStorageUtils.js Normal file
View File

@@ -0,0 +1,68 @@
// 统一 localStorage 的读取与写入
var localStorageUtils = {
// 检查浏览器 localStorage 是否支持
checkLocalStorage: function () {
try {
localStorage.setItem('test', 'test');
localStorage.removeItem('test');
return true;
} catch (e) {
alert("您的浏览器不支持localStorage，请更换浏览器！");
window.location.href = "/";
return false;
}
},
// 获取 localStorage
get: function (key) {
return localStorage.getItem(key);
// return JSON.parse(localStorage.getItem(key));
},
// 设置 localStorage
set: function (key, value) {
localStorage.setItem(key, value);
// localStorage.setItem(key, JSON.stringify(value));
},
// 删除 localStorage
remove: function (key) {
localStorage.removeItem(key);
},
// 清空 localStorage
clear: function () {
localStorage.clear();
},
// 用户登录
userLogin: function ({ token, is_admin }) {
this.set('token', token);
this.set('is_admin', is_admin);
},
// 用户退出登录
userLogout: function () {
this.remove('token');
this.remove('is_admin');
},
// 获取用户登录信息 (从浏览器本地缓存读取)
getUserLogin: function () {
return {
token: this.get('token'),
is_admin: this.get('is_admin')
}
},
getToken: function () {
return this.get('token');
},
getIsAdmin: function () {
return this.get('is_admin') === 'true';
},
getIsUser: function () {
return this.get('is_admin') === 'false';
},
getLoginStatus: function () {
return !!this.get('token') && !!this.get('is_admin');
},
};

31
bookshelfplus-frontend/views/book.html
View File

@@ -40,7 +40,7 @@
cursor: pointer;
opacity: 0;
transition: all 0.3s;
position: relative;;
position: relative;
}
.download-link:hover #download-icon {
width: 1.2em;
@@ -53,7 +53,7 @@
#book-details {
margin-top: 20px;
}
#book-details > p {
#book-details>p {
margin: 0;
}
</style>
@@ -88,10 +88,10 @@
if (status === "success") {
console.log(data)
data.thumbnail = "https://img14.360buyimg.com/pop/jfs/t1/141705/31/25225/853702/61a85f89Ef68c838b/929ded96a4a7579e.png";
if(data.description == ""){
if (data.description == "") {
data.description = "暂无描述";
}
document.getElementById("container").innerHTML =`
document.getElementById("container").innerHTML = `
<div class="grid">
<div class="grid-item">
<img id="bookImage" src="${data.thumbnail}" alt="书籍缩略图">
@@ -141,19 +141,21 @@
var favortiesIcon = false;
// 获取用户收藏信息
function getUserFavouritesStatus() {
if(!localStorage || !localStorage.getItem("token") || !localStorage.getItem("is_admin")) {
localStorageUtils.checkLocalStorage();
if (!localStorageUtils.getLoginStatus()) {
// 用户未登录
$("#favorties-button").css("visibility", "visible");
return;
}
postRequest("/book/getFavoritesStatus", { token: localStorage.getItem("token"), bookId: bookId })
postRequest("/book/getFavoritesStatus", { token: localStorageUtils.getToken(), bookId: bookId })
.then(function (responseData) {
var axiosData = responseData.data;
var status = axiosData.status;
var data = axiosData.data;
if (status === "success") {
console.log(data)
if(data.status == 1) {
if (data.status == 1) {
// 用户已收藏
console.log("已收藏");
favortiesIcon = true;
@@ -164,10 +166,9 @@
}
toggleDisplayButton();
} else {
if(data.errCode == "20004") {
if (data.errCode == "20004") {
// 登陆过期，小问题，这里不弹窗显示
localStorage.removeItem("token");
localStorage.removeItem("is_admin");
localStorageUtils.userLogout();
} else {
alert(`出错啦！${data.errMsg} (错误码: ${data.errCode}) `);
}
@@ -182,18 +183,18 @@
var requestingFlag = false;
// 添加收藏/取消收藏
function toggleFavorites(toggleStatus) {
if(requestingFlag) return;
if (requestingFlag) return;
requestingFlag = true;
$("#favorties-button").css("opacity", "0.3");
postRequest("/book/toggleFavorites", { token: localStorage.getItem("token"), bookId: bookId, status: toggleStatus ? 1 : 0 })
postRequest("/book/toggleFavorites", { token: localStorageUtils.getToken(), bookId: bookId, status: toggleStatus ? 1 : 0 })
.then(function (responseData) {
var axiosData = responseData.data;
var status = axiosData.status;
var data = axiosData.data;
if (status === "success") {
console.log(data)
if(data == "success") {
if(toggleStatus) {
if (data == "success") {
if (toggleStatus) {
console.log("收藏成功");
favortiesIcon = true;
} else {
@@ -215,7 +216,7 @@
requestingFlag = false;
$("#favorties-button").attr("src", "");
$("#favorties-button").css("opacity", "1");
if(favortiesIcon) {
if (favortiesIcon) {
$("#favorties-button").attr("src", "./assets/image/svg/favorites_fill.svg");
$("#favorties-button").attr("onclick", "toggleFavorites(false)");
} else {

20
bookshelfplus-frontend/views/callback.html
View File

@@ -5,10 +5,11 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title><%=title%></title>
<title><%= title %></title>
<!-- <script src="/assets/lib/jquery/3.6.0/jquery.min.js"></script> -->
<script src="/assets/lib/axios/0.26.1/axios.min.js"></script>
<script src="/assets/javascripts/httpRequest.js"></script>
<script src="/assets/javascripts/localStorageUtils.js"></script>
<script>
// API地址
const APIHOST = '<%= global.site.api.prefix %>';
@@ -18,11 +19,12 @@
<body>
<p id="displayText">
正在跳转中，请稍后...
正在跳转中，请稍候...
</p>
<script>
// 带 token 的为绑定第三方账号，不带 token 的为第三方登录
getRequest("/third-party/callback/<%=platform%>" + location.search + (localStorage.getItem("token") ? ("&token=" + localStorage.getItem("token")) : ""))
var token = localStorageUtils.getToken();
getRequest("/third-party/callback/<%=platform%>" + location.search + (token ? ("&token=" + token) : ""))
.then(function (response) {
var axiosData = response.data;
var status = axiosData.status;
@@ -30,7 +32,7 @@
if (status === "success") {
console.log(data)
// 默认直接跳转 user 后台，如果是管理员则由 user 后台跳转
if(localStorage.getItem("token")) {
if (token) {
// 绑定第三方账号
// 绑定第三方账号成功
@@ -38,13 +40,13 @@
location.href = "/dashboard/user/myAccount";
} else {
// 第三方登录成功
localStorage.setItem("token", data.token);
// alert("登录成功");
if(data.group === "ADMIN") {
localStorage.setItem("is_admin", "true");
localStorageUtils.userLogin({
token: data.token,
is_admin: data.group === "ADMIN",
});
if (localStorageUtils.getIsAdmin()) {
window.location.href = "/dashboard/admin/index";
} else {
localStorage.setItem("is_admin", "false");
window.location.href = "/dashboard/user/index";
}
}

1
bookshelfplus-frontend/views/component/header.html
View File

@@ -9,6 +9,7 @@
<script src="/assets/lib/axios/0.26.1/axios.min.js"></script>
<script src="/assets/javascripts/httpRequest.js"></script>
<script src="/assets/javascripts/localStorageUtils.js"></script>
<script>
// API地址
const APIHOST = '<%= global.site.api.prefix %>';

3
bookshelfplus-frontend/views/component/navbar.html
View File

@@ -16,8 +16,9 @@
</div>
</div>
<script>
if (localStorage.getItem("token"))
if (localStorageUtils.getLoginStatus()) {
$("#dashboard").html("后台");
}
function navbarHighlight() {
// 导航栏中突出当前页面

2
bookshelfplus-frontend/views/dashboard/admin/Debug.html
View File

@@ -1,5 +1,5 @@
<script>
postRequest('/debug/status', { token: localStorage.getItem("token") })
postRequest('/debug/status', { token: localStorageUtils.getToken() })
.then(function (response) {
var axiosData = response.data;
var status = axiosData.status;

2
bookshelfplus-frontend/views/dashboard/component/account-cancellation.html
View File

@@ -65,7 +65,7 @@
alert("请输入您的密码");
return;
}
postRequest("/user/cancelAccount", { token: localStorage.getItem("token"), password: accountCancellationPassword })
postRequest("/user/cancelAccount", { token: localStorageUtils.getToken(), password: accountCancellationPassword })
.then(function (response) {
var axiosData = response.data;
var status = axiosData.status;

23
bookshelfplus-frontend/views/dashboard/component/header.html
View File

@@ -9,6 +9,7 @@
<script src="/assets/lib/axios/0.26.1/axios.min.js"></script>
<script src="/assets/javascripts/httpRequest.js"></script>
<script src="/assets/javascripts/localStorageUtils.js"></script>
<script>
// API地址
const APIHOST = '<%= global.site.api.prefix %>';
@@ -16,15 +17,14 @@
</script>
<% if (group == "admin") {%>
<script>
// <%= group %>
if(localStorage.getItem("is_admin") === "false") {
if(localStorageUtils.getIsUser()) {
// 是普通用户，跳转到普通用户后台页面
window.location.href = "/dashboard/user/index";
}
</script>
<%} else {%>
<script>
if(localStorage.getItem("is_admin") === "true") {
if(llocalStorageUtils.getIsAdmin()) {
// 是管理员用户，跳转到管理员用户后台页面
window.location.href = "/dashboard/admin/index";
}
@@ -32,18 +32,14 @@
<%}%>
<script>
function getUserStatus() {
if(!localStorage) {
alert("浏览器不支持 localStorage ，请更换浏览器");
localStorageUtils.checkLocalStorage();
if(!localStorageUtils.getLoginStatus()) {
localStorageUtils.userLogout();
window.location.href = "/";
}
if(!localStorage.getItem("token") || !localStorage.getItem("is_admin")) {
localStorage.removeItem("token");
localStorage.removeItem("is_admin");
window.location.href = "/";
}
postRequest("/user/getUserStatus", { token: localStorage.getItem("token") })
postRequest("/user/getUserStatus", { token: localStorageUtils.getToken() })
.then(function (responseData) {
var axiosData = responseData.data;
var status = axiosData.status;
@@ -57,8 +53,7 @@
}
} else {
if(data.errCode == "20004") { // 登陆过期
localStorage.removeItem("token");
localStorage.removeItem("is_admin");
localStorageUtils.userLogout();
window.location.href = "/login";
}
alert(`出错啦！${data.errMsg} (错误码: ${data.errCode}) `);

8
bookshelfplus-frontend/views/dashboard/component/navbar.html
View File

@@ -16,7 +16,7 @@
</div>
<script>
function logout() {
postRequest("/user/logout", { token: localStorage.getItem("token") })
postRequest("/user/logout", { token: localStorageUtils.getToken() })
.then(function (response) {
var axiosData = response.data;
var status = axiosData.status;
@@ -25,8 +25,7 @@
if (status === "success") {
console.log(data);
if (data) {
localStorage.removeItem("token");
localStorage.removeItem("is_admin");
localStorageUtils.userLogout();
location.href = "/login";
} else {
alert("退出登录失败");
@@ -39,8 +38,7 @@
console.log(error);
var choice = confirm("服务器连接失败，无法正常退出登录，是否要强行退出登录？");
if(choice) {
localStorage.removeItem("token");
localStorage.removeItem("is_admin");
localStorageUtils.userLogout();
location.href = "/login";
}
});

6
bookshelfplus-frontend/views/dashboard/component/third-party-manage.html
View File

@@ -8,7 +8,7 @@
</div>
<script>
function thirdPartyWithdraw(platform) {
postRequest("/third-party/withdrawThirdPartyBings", { token: localStorage.getItem("token"), platform: platform })
postRequest("/third-party/withdrawThirdPartyBings", { token: localStorageUtils.getToken(), platform: platform })
.then(function (response) {
var axiosData = response.data;
var status = axiosData.status;
@@ -30,8 +30,8 @@
alert("无法连接到服务器，请检查网络连接！");
});
}
if (localStorage.getItem("token") != null) {
getRequest("/third-party/getBindingStatus", { token: localStorage.getItem("token") })
if (localStorageUtils.getLoginStatus() != null) {
getRequest("/third-party/getBindingStatus", { token: localStorageUtils.getToken() })
.then(function (response) {
var axiosData = response.data;
var status = axiosData.status;

56
bookshelfplus-frontend/views/login.html
View File

@@ -35,23 +35,16 @@
}
</style>
<script>
if(!localStorage) {
alert("您的浏览器不支持localStorage，请更换浏览器！");
window.location.href = "/";
}
localStorageUtils.checkLocalStorage();
if(localStorage.getItem("token")) {
if(localStorageUtils.getToken()) {
// 用户已登录
if(localStorage.getItem("is_admin") === "true") {
if(localStorageUtils.getIsAdmin()) {
// 是管理员
window.location.href = "/dashboard/admin/index";
} else if(localStorage.getItem("is_admin") === "false") {
} else {
// 是普通用户
window.location.href = "/dashboard/user/index";
} else {
// 未知状态
localStorage.removeItem("token");
localStorage.removeItem("is_admin");
}
}
</script>
@@ -92,40 +85,45 @@
// 用户正常登录逻辑
$("#username").val("xiaomo");
$("#password").val("123456");
$("#username").keydown(function(event) {
if(event.keyCode === 13) {
if($("#password").val() === "") {
$("#username").keydown(function (event) {
if (event.keyCode === 13) {
if ($("#password").val() === "") {
$("#password").focus();
} else {
$(".btn-submit").click();
}
}
});
$("#password").keydown(function(event) {
if(event.keyCode === 13) {
if($("#username").val() === "") {
$("#password").keydown(function (event) {
if (event.keyCode === 13) {
if ($("#username").val() === "") {
$("#username").focus();
} else {
$(".btn-submit").click();
}
}
});
$(".btn-submit").click(function() {
if($("#username").val() === "" || $("#password").val() === "") {
$(".btn-submit").click(function () {
if ($("#username").val() === "" || $("#password").val() === "") {
alert("用户名或密码不能为空！");
if ($("#username").val() === "") {
$("#username").focus();
} else {
$("#password").focus();
}
return;
}
if(isOnLogin) return;
isOnLogin= true;
// 避免用户重复点击
if (isOnLogin) return;
isOnLogin = true;
var username = $("#username").val();
var password = $("#password").val();
// var encryptpwd = hex_sha1(password);
// var encryptpwd = hex_md5(password);
localStorage.removeItem("token");
localStorage.removeItem("is_admin");
localStorageUtils.userLogout();
postRequest("/user/login", { username: username, password: password })
.then(function (response) {
var axiosData = response.data;
@@ -134,14 +132,14 @@
if (status === "success") {
console.log(data);
if(data) {
localStorage.setItem("token", data.token);
// alert("登录成功");
if(data.group === "ADMIN") {
localStorage.setItem("is_admin", "true");
if (data) {
localStorageUtils.userLogin({
token: data.token,
is_admin: data.group === "ADMIN",
});
if (localStorageUtils.getIsAdmin()) {
window.location.href = "/dashboard/admin/index";
} else {
localStorage.setItem("is_admin", "false");
window.location.href = "/dashboard/user/index";
}
} else {

17
bookshelfplus-frontend/views/register.html
View File

@@ -34,12 +34,6 @@
width: 72px;
}
</style>
<script>
if(!localStorage) {
alert("您的浏览器不支持localStorage，请更换浏览器！");
window.location.href = "/";
}
</script>
</head>
<body>
<%- include("./component/navbar.html"); %>
@@ -66,6 +60,8 @@
<%- include("./component/footer.html"); %>
<script>
localStorageUtils.checkLocalStorage();
$("#username").val("xiaomo");
$("#password").val("123456");
$(".btn-register").click(function() {
@@ -81,13 +77,14 @@
if (status === "success") {
console.log(data);
if(data) {
localStorage.setItem("token", data.token);
localStorageUtils.userLogin({
token: data.token,
is_admin: data.group === "ADMIN",
});
alert("注册成功");
if(data.group === "ADMIN") {
localStorage.setItem("is_admin", "true");
if (localStorageUtils.getIsAdmin()) {
window.location.href = "/dashboard/admin/index";
} else {
localStorage.setItem("is_admin", "false");
window.location.href = "/dashboard/user/index";
}
} else {