He implementado un diálogo que muestra cada vez que un usuario accede al sitio web. Sin embargo, quiero que el diálogo vuelva a aparecer después de 24 horas si alguien accede al sitio haciendo clic en la cookie. Desafortunadamente, pasé mucho tiempo investigando y no encontré ninguna solución que se aplique a mi escenario. A continuación se muestra el código que estoy tratando de modificar,
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"); }localStorage no tiene tiempo de caducidad, pero puede comparar las marcas de tiempo:
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()); }Usaría date-fns/differenceInHours o una biblioteca similar, pero depende de usted :)
En un script global:
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... })Le sugiero que use la cookie, contra localStorage, porque allí se soluciona la caducidad, no tiene que codificar para esta función. ¡Aquí hay un ejemplo a continuación!
Y encontré una publicación sobre las diferencias entre localSotrage y cookie, si desea saber más sobre este tema.
Cookies vs LocalStorage: ¿Cuál es la diferencia?
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)