我已經實作了一個對話框,顯示用戶何時訪問該網站。但是,如果有人點擊 cookie 訪問該站點,我希望對話在 24 小時后重新出現。不幸的是,我花了很多時間進行研究,但沒有找到任何適用于我的場景的解決方案。下面是我要修改的代碼,
var is_dialogue = window.localStorage.getItem("dialogue");
if (is_dialogue != 'false') {
var today = new Date();
var hours = today.getHours();
dialogue = new Dialogue();
dialogue.setHtmlMessage(string('dialogue-heading'));
dialogue.addHtmlDetail(string('dialogue-detail'));
if (((today.getHours() 24) >= 24) || ((today.getHours() 24) <= 48))
localStorage.setItem("dialogue", "true");
}
uj5u.com熱心網友回復:
localStorage 沒有過期時間,但可以比較時間戳:
function moreThanOneDayAgo(date) {
const DAY = 1000 * 60 * 60 * 24;
const dayAgo = Date.now() - DAY;
return date < dayAgo;
}
var is_dialogue = localStorage.getItem("dialogue");
if (is_dialogue === null || moreThanOneDayAgo(is_dialogue)) {
dialogue = new Dialogue();
dialogue.setHtmlMessage(string('dialogue-heading'));
dialogue.addHtmlDetail(string('dialogue-detail'));
localStorage.setItem("dialogue", Date.now());
}
uj5u.com熱心網友回復:
我會使用date-fns/differenceInHours或類似的庫,但這取決于你:)
在全域腳本中:
const checkTimestamp = (timestamp) => {
return differenceInHours(new Date(), timestamp) > 24;
}
const isUserConsentExpired = () => {
const timestamp = localStorage.getItem(***);
return timestamp
? checkTimestamp(timestamp)
: false
}
window.onload(() => {
if(!isUserConsentExpired) {
return;
}
... open cookie dialog...
})
uj5u.com熱心網友回復:
我建議你使用 cookie 來對抗 localStorage,因為那里已經解決了過期問題,你不必為此功能撰寫代碼。下面是一個例子!
如果您想了解有關此主題的更多資訊,我發現了一篇關于 localSotrage 和 cookie 之間差異的帖子。
Cookie 與 LocalStorage:有什么區別?
function setCookie(cookieName, cookieValue, exDays) {
const date = new Date();
date.setTime(date.getTime() exDays * 24 * 60 * 60 * 1000);
let expires = "expires=" date.toUTCString();
document.cookie = `${cookieName}=${cookieValue};${expires};path=/`;
}
setCookie("cookieName", "cookieValue", 30)
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/490009.html
標籤:javascript 本地存储
