Maison interface Web tutoriel HTML Comment définir le délai d'expiration des éléments de stockage local

Comment définir le délai d'expiration des éléments de stockage local

Jan 11, 2024 am 09:06 AM
installation localstorage Temps d'expiration

Comment définir le délai dexpiration des éléments de stockage local

Comment définir le délai d'expiration du stockage local nécessite des exemples de code spécifiques

Avec le développement rapide d'Internet, le développement front-end nécessite souvent la sauvegarde des données dans le navigateur. Localstorage est une API Web couramment utilisée qui vise à fournir un moyen de stocker des données localement dans le navigateur. Cependant, le stockage local ne fournit pas de moyen direct de définir le délai d'expiration. Cet article explique comment définir le délai d'expiration du stockage local à travers des exemples de code.

Avant de commencer, nous devons d'abord comprendre l'utilisation de base du stockage local. Vous pouvez utiliser les deux méthodes suivantes pour faire fonctionner localstorage :

  • localStorage.setItem(key, value) : stockez la paire clé-valeur spécifiée dans localstorage.
  • localStorage.setItem(key, value):将指定的键值对存储在localstorage中。
  • localStorage.getItem(key):从localstorage中获取指定键的值。

需要注意的是,localstorage存储的值只能是字符串类型。如果需要存储其他类型的值,可以使用JSON.stringify()方法将其转换为字符串,然后在取出时使用JSON.parse()方法将其转换回原始类型。

接下来,我们将使用localstorage实现设置过期时间的功能。我们可以通过在存入数据时,同时存入一个过期时间戳,然后在取出数据时判断是否已经过期。下面是一个示例代码:

// 设置localstorage的过期时间
function setLocalStorageWithExpiration(key, value, expirationMinutes) {
  const expirationMS = expirationMinutes * 60 * 1000;
  const record = {
    value: value,
    expiration: new Date().getTime() + expirationMS
  };
  localStorage.setItem(key, JSON.stringify(record));
}

// 获取localstorage的值(同时判断是否过期)
function getLocalStorageWithExpiration(key) {
  const record = JSON.parse(localStorage.getItem(key));
  if (!record) {
    return null;
  }
  if (new Date().getTime() > record.expiration) {
    localStorage.removeItem(key);
    return null;
  }
  return record.value;
}

// 使用示例
setLocalStorageWithExpiration('username', 'John', 5); // 设置过期时间为5分钟
console.log(getLocalStorageWithExpiration('username')); // 输出:John

// 5分钟后
setTimeout(() => {
  console.log(getLocalStorageWithExpiration('username')); // 输出:null
}, 5 * 60 * 1000);

在上述示例中,setLocalStorageWithExpiration函数用于设置localstorage的过期时间。它接受三个参数:键名key、键值value和过期时间expirationMinutes(以分钟为单位)。其中,过期时间通过计算当前时间加上指定的分钟数得出,然后将键值对及过期时间存储在localstorage中。

getLocalStorageWithExpiration函数用于获取localstorage的值,并判断其是否过期。它首先从localstorage中获取指定键的值,并将其解析为一个对象。然后判断对象是否存在,如果不存在或已经过期,则返回null;如果未过期,则返回键值。

在示例中,我们设置了一个名为'username'的键值对,并将过期时间设置为5分钟。在设置完毕后,我们通过getLocalStorageWithExpiration函数获取'username'的值并打印到控制台,可以看到输出为'John'。然后,我们使用setTimeoutlocalStorage.getItem(key) : récupère la valeur de la clé spécifiée à partir de localstorage.

Il est à noter que la valeur stockée dans localstorage ne peut être que de type chaîne. Si vous devez stocker une valeur d'un autre type, vous pouvez utiliser la méthode JSON.stringify() pour la convertir en chaîne, puis utiliser la méthode JSON.parse() pour la reconvertir au type d'origine lors de sa suppression. .

Ensuite, nous utiliserons le stockage local pour implémenter la fonction de réglage du délai d'expiration. Nous pouvons stocker un horodatage d'expiration lors du stockage des données, puis déterminer s'il a expiré lors de la récupération des données. Voici un exemple de code : 🎜rrreee🎜Dans l'exemple ci-dessus, la fonction setLocalStorageWithExpiration est utilisée pour définir le délai d'expiration du stockage local. Il accepte trois paramètres : le nom de la clé, la valeur de la clé et le délai d'expiration expirationMinutes (en minutes). Parmi eux, le délai d'expiration est calculé en ajoutant l'heure actuelle et le nombre de minutes spécifié, puis la paire clé-valeur et le délai d'expiration sont stockés dans le stockage local. La fonction 🎜🎜getLocalStorageWithExpiration est utilisée pour obtenir la valeur du stockage local et déterminer s'il a expiré. Il obtient d'abord la valeur de la clé spécifiée à partir du stockage local et l'analyse en un objet. Déterminez ensuite si l'objet existe. S'il n'existe pas ou a expiré, renvoyez null s'il n'a pas expiré, renvoyez la valeur de la clé. 🎜🎜Dans l'exemple, nous configurons une paire clé-valeur appelée « nom d'utilisateur » et fixons le délai d'expiration à 5 minutes. Après la configuration, nous obtenons la valeur de « nom d'utilisateur » via la fonction getLocalStorageWithExpiration et l'imprimons sur la console. Vous pouvez voir que la sortie est « John ». Ensuite, nous utilisons la fonction setTimeout pour simuler l'obtention à nouveau de la valeur de « nom d'utilisateur » après 5 minutes et l'imprimer sur la console. Vous pouvez voir que la sortie est nulle, indiquant que la valeur-clé. la paire a expiré et a été supprimée. 🎜🎜Grâce à l'exemple ci-dessus, nous avons implémenté avec succès la fonction d'utilisation du stockage local pour définir le délai d'expiration. Il convient de rappeler que l'utilisation du stockage local comporte certains risques car il est stocké dans le navigateur client. Par conséquent, lorsque vous utilisez le stockage local pour stocker des informations sensibles ou des données importantes, veuillez faire attention à la sécurité et à la confidentialité des données. 🎜

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

Video Face Swap

Video Face Swap

Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Article chaud

Porce de variable PHP expliquée
1 Il y a quelques mois By 百草
Commentant le code en php
4 Il y a quelques semaines By 百草
<🎜>: Grow A Garden - Guide complet des marchands itinérants
4 Il y a quelques semaines By Jack chen
Conseils pour écrire des commentaires PHP
4 Il y a quelques semaines By 百草

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Sujets chauds

Tutoriel PHP
1510
276
Comment fixer l'heure prévue de publication des ouvrages sur Douyin ? Comment définit-il la durée de la vidéo ? Comment fixer l'heure prévue de publication des ouvrages sur Douyin ? Comment définit-il la durée de la vidéo ? Mar 27, 2024 pm 06:11 PM

Publier des œuvres sur Douyin peut attirer plus d'attention et de likes, mais il peut parfois nous être difficile de publier des œuvres en temps réel. Dans ce cas, nous pouvons utiliser la fonction de publication programmée de Douyin. La fonction de publication planifiée de Douyin permet aux utilisateurs de publier automatiquement des œuvres à des heures planifiées, ce qui permet de mieux planifier le plan de publication et d'augmenter l'exposition et l'influence des œuvres. 1. Comment fixer l'heure prévue de publication des ouvrages sur Douyin ? Pour définir une heure de sortie programmée, accédez d'abord à la page d'accueil personnelle de Douyin, recherchez le bouton « + » dans le coin supérieur droit et cliquez pour accéder à la page de sortie. Il y a une icône d'horloge dans le coin inférieur droit de la page de publication. Cliquez pour accéder à l'interface de publication planifiée. Dans l'interface, vous pouvez choisir le type d'œuvre que vous souhaitez publier, notamment des vidéos courtes, des vidéos longues et des diffusions en direct. Ensuite, vous devez définir quand votre travail sera publié. TikTok fournit

Comment configurer la lecture Douyin pour qu'elle s'éteigne automatiquement ? Pourquoi le processus de lecture se termine-t-il automatiquement ? Comment configurer la lecture Douyin pour qu'elle s'éteigne automatiquement ? Pourquoi le processus de lecture se termine-t-il automatiquement ? Apr 01, 2024 pm 12:06 PM

Douyin est aujourd'hui l'une des plateformes de vidéos courtes les plus populaires. Tout en profitant du plaisir des vidéos courtes, les utilisateurs espèrent également avoir un meilleur contrôle sur leur temps. Récemment, certains utilisateurs ont signalé que Douyin se fermait automatiquement pendant la lecture, ce qui les dérangeait beaucoup. 1. Comment régler la lecture Douyin pour qu'elle s'éteigne automatiquement ? 1. Vérifiez la version Douyin. Veuillez vous assurer que la version Douyin que vous utilisez est la dernière. Douyin sera mis à jour régulièrement pour résoudre les problèmes connus. Si votre version de TikTok est trop ancienne, elle peut se fermer automatiquement. Vous pouvez vérifier et mettre à jour TikTok dans l'App Store. 2. Vérifiez la version du système de téléphonie mobile. L'arrêt automatique de la lecture Douyin peut également être lié à la version du système de téléphonie mobile. Veuillez vous assurer que la version de votre système de téléphonie mobile est la plus récente. Si la version du système de téléphonie mobile est trop ancienne, Douyin peut devenir instable. tu peux

Le mode Ne pas déranger ne fonctionne pas sur iPhone : correctif Le mode Ne pas déranger ne fonctionne pas sur iPhone : correctif Apr 24, 2024 pm 04:50 PM

Même répondre à des appels en mode Ne pas déranger peut être une expérience très ennuyeuse. Comme son nom l'indique, le mode Ne pas déranger désactive toutes les notifications d'appels entrants et les alertes provenant d'e-mails, de messages, etc. Vous pouvez suivre ces ensembles de solutions pour résoudre ce problème. Correctif 1 – Activer le mode de mise au point Activez le mode de mise au point sur votre téléphone. Étape 1 – Faites glisser votre doigt depuis le haut pour accéder au Centre de contrôle. Étape 2 – Ensuite, activez le « Mode Focus » sur votre téléphone. Le mode Focus active le mode Ne pas déranger sur votre téléphone. Aucune alerte d’appel entrant n’apparaîtra sur votre téléphone. Correctif 2 – Modifier les paramètres du mode de mise au point S'il y a des problèmes dans les paramètres du mode de mise au point, vous devez les résoudre. Étape 1 – Ouvrez la fenêtre des paramètres de votre iPhone. Étape 2 – Ensuite, activez les paramètres du mode Focus

Comment définir la touche Entrée pour envoyer des messages dans QQ Comment définir la touche Entrée pour envoyer des messages dans QQ Mar 25, 2024 pm 07:10 PM

1. Tout d’abord, cliquez sur le bureau du téléphone mobile pour accéder à QQ, puis cliquez sur l’avatar dans le coin supérieur gauche. 2. Cliquez sur [Paramètres] dans le coin inférieur gauche. 3. Cliquez pour ouvrir [Accessibilité]. 4. Ensuite, il suffit de cliquer sur le commutateur [Touche Entrée pour envoyer un message].

Comment configurer la publication programmée sur Weibo_Tutoriel sur la configuration de la publication programmée sur Weibo Comment configurer la publication programmée sur Weibo_Tutoriel sur la configuration de la publication programmée sur Weibo Mar 29, 2024 pm 03:51 PM

1. Ouvrez le client Weibo, cliquez sur les trois petits points sur la page d'édition, puis cliquez sur Publication programmée. 2. Après avoir cliqué sur la publication programmée, il y aura une option d'heure sur le côté droit de l'heure de publication, modifiez l'article et cliquez sur les mots jaunes dans le coin inférieur droit pour publier régulièrement. 3. La version mobile de Weibo ne prend actuellement pas en charge la publication programmée. Cette fonction ne peut être utilisée que sur le client PC !

Comment régler le compte à rebours pour récupérer des billets à Damai Comment régler le compte à rebours pour récupérer des billets à Damai Apr 01, 2024 pm 07:01 PM

Lors de l'achat de billets sur Damai.com, afin de garantir que l'heure d'achat du billet peut être comprise avec précision, les utilisateurs peuvent définir une horloge flottante pour récupérer les billets. La méthode de réglage détaillée est ci-dessous, apprenons ensemble. Comment lier l'horloge flottante à Damai 1. Cliquez pour ouvrir l'application d'horloge flottante sur votre téléphone pour accéder à l'interface, puis cliquez sur l'emplacement où le contrôle de vente flash est défini, comme indiqué dans la figure ci-dessous : 2. Après être arrivé à la page d'ajout de nouveaux enregistrements, cliquez sur Damai.com Copiez la page du lien d'achat de billet copiée. 3. Ensuite, définissez l'heure de la vente flash et l'heure de notification ci-dessous, activez le bouton de commutation derrière [Enregistrer dans le calendrier] et cliquez sur [Enregistrer] ci-dessous. 4. Cliquez pour activer [Compte à rebours], comme indiqué dans la figure ci-dessous : 5. Lorsque l'heure du rappel arrive, cliquez sur le bouton [Démarrer l'image dans l'image] ci-dessous. 6. Quand vient le moment d’acheter le billet

Où est définie la balise Douyin ? Comment peut-on l'étiqueter pour pouvoir le pousser avec précision ? Où est définie la balise Douyin ? Comment peut-on l'étiqueter pour pouvoir le pousser avec précision ? Mar 27, 2024 am 11:01 AM

En tant que l'une des plateformes de vidéos courtes les plus populaires au monde, Douyin permet à chacun de devenir créateur et de partager chaque instant de la vie. Pour les utilisateurs de Douyin, les balises sont une fonction très importante. Elles peuvent aider les utilisateurs à mieux classer et récupérer le contenu, et permettent également à la plate-forme de transmettre plus précisément le contenu approprié aux utilisateurs. Alors, où sont définies les balises Douyin ? Cet article expliquera en détail comment configurer et utiliser les balises sur Douyin. 1. Où est définie la balise Douyin ? L'utilisation de balises sur Douyin peut aider les utilisateurs à mieux classer et étiqueter leurs œuvres, permettant ainsi aux autres utilisateurs de les trouver et de les suivre plus facilement. La méthode pour définir l'étiquette est la suivante : 1. Ouvrez l'application Douyin et connectez-vous à votre compte. 2. Cliquez sur le signe "+" en bas de l'écran et sélectionnez le bouton "Publier". 3.

Comment définir le filigrane au milieu sur Weibo_Comment définir le filigrane au milieu sur Weibo Comment définir le filigrane au milieu sur Weibo_Comment définir le filigrane au milieu sur Weibo Mar 29, 2024 pm 03:31 PM

1. Entrez d'abord Weibo, puis cliquez sur moi dans le coin inférieur droit et sélectionnez [Service client]. 2. Saisissez ensuite [Filigrane] dans la zone de recherche et sélectionnez [Définir le filigrane de l'image Weibo]. 3. Cliquez ensuite sur [Lien] dans l'interface. 4. Cliquez ensuite sur [Paramètres du filigrane d'image] dans la fenêtre nouvellement ouverte. 5. Enfin, cochez [Picture Center] et cliquez sur [Enregistrer].

See all articles