HTML5 स्थानीय संग्रहण में आइटम कब समाप्त होते हैं?

Question

कितने समय के लिए लोकलस्टोरेज में डेटा संग्रहीत किया जाता है (एचटीएमएल 5 में डोम स्टोरेज के हिस्से के रूप में) उपलब्ध है? क्या मैं उस डेटा के लिए एक समाप्ति समय निर्धारित कर सकता हूं जिसे मैंने लोकलस्टोरेज में डाला था?

Comments

यदि संभव हो तो लोकलस्टोरेज का उपयोग न करें क्योंकि कभी भी स्वचालित रूप से समाप्त नहीं होता है, वहां आप सेशनस्टोरेज का उपयोग कर सकते हैं यह अधिक बेहतर है

— धर्मेंद्रसिंह चुडास्मा

Answer 1

यह समाप्ति को निर्दिष्ट करना संभव नहीं है। यह पूरी तरह से उपयोगकर्ता के लिए है।

https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

बेशक, यह संभव है कि क्लाइंट पर आपके एप्लिकेशन स्टोर कुछ बाद में न हों। उपयोगकर्ता स्पष्ट रूप से स्थानीय भंडारण से छुटकारा पा सकता है, या ब्राउज़र अंतरिक्ष विचारों में चल सकता है। रक्षात्मक कार्यक्रम करना अच्छा है। आम तौर पर हालांकि चीजें उस शब्द की कुछ व्यावहारिक परिभाषा के आधार पर "हमेशा" बनी रहती हैं।

संपादित करें - जाहिर है, आपका अपना एप्लिकेशन सक्रिय रूप से सामान निकाल सकता है यदि यह तय करता है कि यह बहुत पुराना है। यही है, आप स्पष्ट रूप से कुछ प्रकार के टाइमस्टैम्प को शामिल कर सकते हैं जो आपने बचाए हैं, और फिर बाद में यह तय करने के लिए कि क्या जानकारी को फ्लश किया जाना चाहिए या नहीं।

Comments

तो क्या उपयोगकर्ता एक वर्ष के बाद मिलने वाले डेटा पर भरोसा कर सकता है? क्या डेवलपर उपलब्ध डेटा पर भरोसा कर सकता है जब तक कि उपयोगकर्ता इसे स्पष्ट रूप से हटा नहीं देता है?

— एंड्रेस रिओप्रियो

@AndresRiofrio मैं मोज़िला या Microsoft या W3C से कोई दस्तावेज नहीं पा सकता है जो किसी भी तरह के अनिवार्य श्वसन को निर्धारित करता है। इस प्रकार मुझे लगता है कि उत्तर यह है कि हां, उपयोगकर्ता एजेंट को हमेशा के लिए संग्रहीत सामान रखने के लिए माना जाता है, या जब तक उपयोगकर्ता स्पष्ट रूप से अनुरोध नहीं करता है कि इसे हटा दिया जाए (या मुझे लगता है कि जब तक आपका अपना आवेदन स्वयं अपना सामान नहीं हटाता है)।

— नुकीले

इसका मतलब यह भी है कि आपका ब्राउज़र बढ़ता रहता है। आप एक बार एक ऐप का उपयोग करते हैं, यह आपके ब्राउज़र में सामान रखता है, और यह हमेशा के लिए वहां रहता है ....

— पीटर वैन कंपेन

लोकलस्टोरेज डेटा की मात्रा आप प्रति वेबसाइट 10mb के आसपास स्टोर कर सकते हैं, लेकिन एक औसत साइट कुछ स्ट्रिंग्स की तुलना में बहुत अधिक स्टोर नहीं करेगी, इसलिए मैं स्टोरेज स्पेस के बारे में बुरा नहीं

— Juan

फ़ायरफ़ॉक्स यहाँ एक प्रलेखित निष्कासन नीति है ।

— श्रीवत्सआर

Answer 2

मेरा सुझाव है कि आप लोकलस्टोरीज में स्टोर की जाने वाली वस्तु में टाइमस्टैम्प स्टोर करें

var object = {value: "value", timestamp: new Date().getTime()}
localStorage.setItem("key", JSON.stringify(object));

आप ऑब्जेक्ट को पार्स कर सकते हैं, टाइमस्टैम्प प्राप्त कर सकते हैं और वर्तमान दिनांक के साथ तुलना कर सकते हैं, और यदि आवश्यक हो, तो ऑब्जेक्ट के मूल्य को अपडेट करें।

var object = JSON.parse(localStorage.getItem("key")),
    dateString = object.timestamp,
    now = new Date().getTime().toString();

compareTime(dateString, now); //to implement

Comments

ठीक है, भले ही क्लाइंट समय सुसंगत न हो, फिर भी आप इसके बजाय अपने सर्वर समय का उपयोग करने का एक तरीका पा सकते हैं। जैसे टाइमस्टैम्प एक डीवा में गूंज रहा हो।

— सुप्रीम डॉल्फिन

क्या आप समय अंतराल ( settimoutहर 5 सेकंड के लिए) या ग्राहक द्वारा सर्वर को भेजे जाने वाले प्रत्येक अनुरोध के लिए टाइमस्टैम्प को पार्स और तुलना करेंगे ?

— इबुबी

बेहतर तरीका यह है कि प्रत्येक उपयोगकर्ता अनुरोध के लिए तारीखों की तुलना की जाए

— Terai

Answer 3

आप lscache का उपयोग कर सकते हैं । यह आपके लिए इसे स्वचालित रूप से संभालता है, उदाहरण सहित जहां भंडारण का आकार सीमा से अधिक है। यदि ऐसा होता है, तो यह उन वस्तुओं की छंटाई शुरू कर देता है जो उनकी निर्दिष्ट समाप्ति के सबसे करीब हैं।

से readme:

lscache.set

Stores the value in localStorage. Expires after specified number of minutes.

Arguments
key (string)
value (Object|string)
time (number: optional)

यह नियमित भंडारण विधियों के बीच एकमात्र वास्तविक अंतर है। प्राप्त करें, निकालें, आदि समान काम करते हैं।

यदि आपको उस अधिक कार्यक्षमता की आवश्यकता नहीं है, तो आप केवल मान (JSON के माध्यम से) के साथ एक समय टिकट स्टोर कर सकते हैं और इसे समाप्ति के लिए जांच सकते हैं।

उल्लेखनीय है, एक अच्छा कारण है कि स्थानीय भंडारण उपयोगकर्ता के लिए छोड़ दिया गया है। लेकिन, जब आपको बेहद अस्थायी डेटा स्टोर करने की आवश्यकता होती है, तो lscache जैसी चीजें काम में आती हैं।

Comments

धन्यवाद! यह उस चीज के लिए बहुत बढ़िया है जिसकी मुझे आवश्यकता है - डेटा को बस वहां रहने की जरूरत होती है, जब उपयोगकर्ता एक booboo बनाता है या ब्राउज़र बंद हो जाता है इससे पहले कि उन्होंने अपना काम बचाया हो, लेकिन कुकीज़ के लिए बहुत अधिक डेटा है। मैं इसका उपयोग pieroxy.net/blog/pages/lz-string/index.html के साथ मिलकर कर रहा हूँ ।

— पीटर स्मार्ट्ट

Answer 4

ब्रायनेर फेरेरा, एक अच्छी बात लेकर आया है: एक सिबलिंग कुंजी को संग्रहीत करना जहां समाप्ति की जानकारी रहती है। इस तरह, यदि आपके पास बड़ी मात्रा में कुंजियाँ हैं, या यदि आपके मान बड़े Json ऑब्जेक्ट हैं , तो आपको टाइमस्टैम्प तक पहुंचने के लिए उन्हें पार्स करने की आवश्यकता नहीं है।

यहाँ एक बेहतर संस्करण इस प्रकार है:

 /*  removeStorage: removes a key from localStorage and its sibling expiracy key
    params:
        key <string>     : localStorage key to remove
    returns:
        <boolean> : telling if operation succeeded
 */
 function removeStorage(name) {
    try {
        localStorage.removeItem(name);
        localStorage.removeItem(name + '_expiresIn');
    } catch(e) {
        console.log('removeStorage: Error removing key ['+ key + '] from localStorage: ' + JSON.stringify(e) );
        return false;
    }
    return true;
}
/*  getStorage: retrieves a key from localStorage previously set with setStorage().
    params:
        key <string> : localStorage key
    returns:
        <string> : value of localStorage key
        null : in case of expired key or failure
 */
function getStorage(key) {

    var now = Date.now();  //epoch time, lets deal only with integer
    // set expiration for storage
    var expiresIn = localStorage.getItem(key+'_expiresIn');
    if (expiresIn===undefined || expiresIn===null) { expiresIn = 0; }

    if (expiresIn < now) {// Expired
        removeStorage(key);
        return null;
    } else {
        try {
            var value = localStorage.getItem(key);
            return value;
        } catch(e) {
            console.log('getStorage: Error reading key ['+ key + '] from localStorage: ' + JSON.stringify(e) );
            return null;
        }
    }
}
/*  setStorage: writes a key into localStorage setting a expire time
    params:
        key <string>     : localStorage key
        value <string>   : localStorage value
        expires <number> : number of seconds from now to expire the key
    returns:
        <boolean> : telling if operation succeeded
 */
function setStorage(key, value, expires) {

    if (expires===undefined || expires===null) {
        expires = (24*60*60);  // default: seconds for 1 day
    } else {
        expires = Math.abs(expires); //make sure it's positive
    }

    var now = Date.now();  //millisecs since epoch time, lets deal only with integer
    var schedule = now + expires*1000; 
    try {
        localStorage.setItem(key, value);
        localStorage.setItem(key + '_expiresIn', schedule);
    } catch(e) {
        console.log('setStorage: Error setting key ['+ key + '] in localStorage: ' + JSON.stringify(e) );
        return false;
    }
    return true;
}

Comments

सेटस्टोरेज () में, क्या elseलाइन नहीं होनी चाहिए expires = Math.abs(1000*expires); //make sure it's positive?

— एलिसोन्मुल्लर

getStorageकॉल के लिए बस एक बिंदु । यदि आप _expiresInकुंजी के संस्करण को सीधे एक्सेस करने का प्रयास करते हैं, तो कुंजी तब बनती है, ..._expiresIn_expiresInजो निश्चित रूप से मौजूद नहीं है, इसलिए यह मूल ..._expiresInकुंजी को हटा देती है , फिर अगली बार जब आप मूल कुंजी को एक्सेस करते हैं, तो ..._expiresInमौजूद नहीं होता है और यह मूल को हटा देता है। चाभी। मैं सुझाव देता हूं कि मैं अपनी परियोजनाओं में से एक में फंस गया। if(key.indexOf('_expiresIn') > -1) { return localStorage.getItem(key); }

— अकस्मात

Answer 5

जबकि स्थानीय भंडारण एक समाप्ति तंत्र की आपूर्ति नहीं करता है, कुकीज़ करते हैं। बस एक कुकी के साथ एक स्थानीय भंडारण कुंजी बाँधना यह सुनिश्चित करने का एक आसान तरीका प्रदान करता है कि स्थानीय भंडारण को कुकी के समान समाप्ति मापदंडों के साथ अपडेट किया जा सकता है।

JQuery में उदाहरण:

if (!$.cookie('your_key') || !localStorage.getItem('your_key')) {
    //get your_data from server, then...
    localStorage.setItem('your_key', 'your_data' );
    $.cookie('your_key', 1);
} else {
    var your_data = localStorage.getItem('your_key');
}
// do stuff with your_data

यह उदाहरण ब्राउज़र को बंद होने पर समाप्त करने के लिए डिफ़ॉल्ट पैरामीटर के साथ एक कुकी सेट करता है। इस प्रकार, जब ब्राउज़र बंद हो जाता है और फिर से खोला जाता है, तो आपके_डेटा के लिए स्थानीय डेटा स्टोर सर्वर-साइड कॉल द्वारा ताज़ा हो जाता है।

ध्यान दें कि यह स्थानीय डेटा स्टोर को हटाने के समान नहीं है , जब भी कुकी समाप्त होती है तो यह स्थानीय डेटा स्टोर को अपडेट कर रहा है। हालांकि, यदि आपका मुख्य लक्ष्य 4K क्लाइंट-साइड (कुकी आकार के लिए सीमा) से अधिक स्टोर करने में सक्षम है, तो कुकी और स्थानीय भंडारण की यह जोड़ी आपको कुकी के समान ही समाप्ति मापदंडों का उपयोग करके एक बड़े भंडारण आकार को पूरा करने में मदद करेगी। ।

Comments

कुकीज़ को साफ किया जा सकता है, और, अभी भी बदतर, पूरी तरह से बंद किया जा सकता है।

— सुप्रीम डॉल्फिन

मुझे यह समाधान सबसे अच्छा लगता है क्योंकि यह ब्राउज़र को अन्य पुस्तकालयों या मैन्युअल रूप से स्थानीय भंडारण तिथियों का उपयोग किए बिना हमारे भंडारण समाधान की समाप्ति को संभालने देता है।

— ecc

ध्यान रखें कि कुकीज़ हर अनुरोध में भेजी जाती हैं।

— लुकास फ्रीटास

Answer 6

यहाँ अत्यधिक सेशन का उपयोग करने की सिफारिश की गई है

• यह लोकलस्टोरेज के समान है लेकिन सत्र नष्ट / ब्राउज़र बंद होने पर नष्ट हो जाता है
• लोकलस्टेजेज टैब के बीच भी साझा कर सकते हैं जबकि सेशनस्टेजेज वर्तमान टैब में ही उपयोग कर सकते हैं, लेकिन मान ताज़ा पृष्ठ पर नहीं बदलता है या पृष्ठ नहीं बदलता है
• कुकी के विरुद्ध नेटवर्क ट्रैफ़िक को कम करने के लिए सेशनस्टोरेज भी उपयोगी है

सेट मूल्य उपयोग के लिए

sessionStorage.setItem("key","my value");

मूल्य उपयोग के लिए

var value = sessionStorage.getItem("key");

देखने के लिए यहाँ क्लिक करें एपीआई

सेट के लिए सभी तरीके हैं

  sessionStorage.key = "my val";
  sessionStorage["key"] = "my val";
  sessionStorage.setItem("key","my value");

पाने के सभी तरीके हैं

  var value = sessionStorage.key;
  var value = sessionStorage["key"];
  var value = sessionStorage.getItem("key");

Comments

ध्यान दें कि sessionStorageटैब के बीच डेटा साझा करने के लिए काम नहीं करता है

— भार्गव मममेडरेड्डी

Answer 7

जीवनचक्र एप्लिकेशन / उपयोगकर्ता द्वारा नियंत्रित किया जाता है।

से मानक :

उपयोगकर्ता एजेंटों को केवल सुरक्षा कारणों से या उपयोगकर्ता द्वारा ऐसा करने का अनुरोध करने पर स्थानीय भंडारण क्षेत्रों से डेटा समाप्त करना चाहिए। उपयोगकर्ता एजेंटों को हमेशा डेटा हटाने से बचना चाहिए जबकि एक स्क्रिप्ट जो उस डेटा तक पहुंच सकती है।

Answer 8

W3C ड्राफ्ट से:

उपयोगकर्ता एजेंटों को केवल सुरक्षा कारणों से या उपयोगकर्ता द्वारा ऐसा करने का अनुरोध करने पर स्थानीय भंडारण क्षेत्रों से डेटा समाप्त करना चाहिए। उपयोगकर्ता एजेंटों को हमेशा डेटा हटाने से बचना चाहिए जबकि एक स्क्रिप्ट जो उस डेटा तक पहुंच सकती है।

आप सेट इट (कुंजी, मान) का उपयोग करके अपने शेड्यूल पर अपने अपडेट करना चाहते हैं; जो नए डेटा के साथ दी गई कुंजी को या तो जोड़ेगा या अपडेट करेगा।

Comments

हम्म ... शायद डेटा के हिस्से के रूप में एक तारीख को सूचीबद्ध करना एक अच्छा विचार होगा? या हो सकता है कि हर बार डेटा बदलने के दौरान एक अलग कुंजी का उपयोग किया जाए।

— असंतुष्ट

Answer 9

// Functions
function removeHtmlStorage(name) {
    localStorage.removeItem(name);
    localStorage.removeItem(name+'_time');
}

function setHtmlStorage(name, value, expires) {

    if (expires==undefined || expires=='null') { var expires = 3600; } // default: 1h

    var date = new Date();
    var schedule = Math.round((date.setSeconds(date.getSeconds()+expires))/1000);

    localStorage.setItem(name, value);
    localStorage.setItem(name+'_time', schedule);
}

function statusHtmlStorage(name) {

    var date = new Date();
    var current = Math.round(+date/1000);

    // Get Schedule
    var stored_time = localStorage.getItem(name+'_time');
    if (stored_time==undefined || stored_time=='null') { var stored_time = 0; }

    // Expired
    if (stored_time < current) {

        // Remove
        removeHtmlStorage(name);

        return 0;

    } else {

        return 1;
    }
}

// Status
var cache_status = statusHtmlStorage('cache_name');

// Has Data
if (cache_status == 1) {

    // Get Cache
    var data = localStorage.getItem('cache_name');
    alert(data);

// Expired or Empty Cache
} else {

    // Get Data
    var data = 'Pay in cash :)';
    alert(data);

    // Set Cache (30 seconds)
    if (cache) { setHtmlStorage('cache_name', data, 30); }

}

Comments

मुझे यह दृष्टिकोण पसंद है, क्योंकि इसके लिए पहले डेटा पार्स करने की आवश्यकता नहीं है।

— क्रिस्टोफ़

Answer 10

अगर किसी ने jQuery के jStorage प्लगइन का उपयोग किया है, तो इसे setTTL फ़ंक्शन के साथ समाप्त किया जा सकता है यदि jStorage प्लग इन

$.jStorage.set('myLocalVar', "some value");
$.jStorage.setTTL("myLocalVar", 24*60*60*1000); // 24 Hr.

Answer 11

अगर किसी को अभी भी एक त्वरित समाधान की तलाश है और निर्भरता नहीं चाहते हैं जैसे कि jquery आदि। मैंने एक मिनी लिब लिखा है जो स्थानीय / सत्र / कस्टम भंडारण में समाप्ति को जोड़ता है, आप इसे यहां स्रोत के साथ पा सकते हैं:

https://github.com/RonenNess/ExpiredStorage

Answer 12

आप यह एक कोशिश कर सकते हैं।

var hours = 24; // Reset when storage is more than 24hours
var now = new Date().getTime();
var setupTime = localStorage.getItem('setupTime');
if (setupTime == null) {
     localStorage.setItem('setupTime', now)
} else {
    if(now-setupTime > hours*60*60*1000) {
         localStorage.clear()
         localStorage.setItem('setupTime', now);
    }
}

Answer 13

कोणीय और स्थानीयकरण का उपयोग कर समाधान:

angular.module('app').service('cacheService', function() {

  return {
    set: function(key, value, expireTimeInSeconds) {
      return localforage.setItem(key, {
        data: value,
        timestamp: new Date().getTime(),
        expireTimeInMilliseconds: expireTimeInSeconds * 1000
      })
    },
    get: function(key) {
      return localforage.getItem(key).then(function(item) {
        if(!item || new Date().getTime() > (item.timestamp + item.expireTimeInMilliseconds)) {
          return null
        } else {
          return item.data
        }
      })
    }
  }

})

Comments

मैंने साइट की जाँच की, और मुझे उनके API में कोई 'expireTimeInMilliseconds' कुंजी दिखाई नहीं दे रही है। क्या यह एक अनिर्दिष्ट / असमर्थित सेटिंग है?

— आआआआआआआ

@PhilOlson जो एक कस्टम कार्यान्वयन है जिसका मैंने उपयोग किया है localforage। expireTimeInMillisecondsकुछ localforageविशेषता नहीं है, लेकिन एक चर मैंने जांचा है कि संग्रहीत डेटा को समाप्त करने की आवश्यकता है या नहीं। getमेरे उदाहरण पर फ़ंक्शन की परिभाषा जांचें ।

— टॉमस रोमेरो

वाह localforageहल्का हल्का सहायक वर्ग नहीं है जिसकी मुझे उम्मीद थी

— सिमोन_विवर

Answer 14

@ मेरी राय में sebarmeli का दृष्टिकोण सबसे अच्छा है, लेकिन अगर आप केवल सत्र के जीवन के लिए डेटा को बनाए रखना चाहते हैं तो sessionStorageसंभवतः एक बेहतर विकल्प है:

यह एक वैश्विक ऑब्जेक्ट (सेशनस्टोरेज) है जो एक स्टोरेज एरिया को बनाए रखता है जो पेज सेशन की अवधि के लिए उपलब्ध है। एक पेज सत्र तब तक चलता है जब तक ब्राउज़र खुला रहता है और पेज रीलोड और रीस्टोर पर बच जाता है। एक नया टैब या विंडो में एक पेज खोलने से एक नया सत्र शुरू होगा।

MDN: sessionStorage

Answer 15

खोजकर्ताओं के लाभ के लिए:

फर्नांडो की तरह, मैं जब भी संग्रहीत मूल्यों को सरल करता था, तो मैं एक लोडन जोड़ना नहीं चाहता था। मुझे बस कुछ यूआई इंटरैक्शन को ट्रैक करने और डेटा को प्रासंगिक रखने की आवश्यकता है (उदाहरण के लिए, उपयोगकर्ता ने चेक आउट करने से पहले ईकॉमर्स साइट का उपयोग कैसे किया)।

यह हर व्यक्ति के मानदंडों को पूरा नहीं करेगा, लेकिन उम्मीद है कि किसी के लिए एक त्वरित कॉपी + पेस्ट स्टार्टर होगा और एक और लिबास जोड़ने से बचाएगा।

नोट: यह अच्छा नहीं होगा यदि आपको व्यक्तिगत रूप से आइटम पुनर्प्राप्त करने की आवश्यकता है।

// Addition
if(window.localStorage){
    localStorage.setItem('myapp-' + new Date().getTime(), 'my value');
}

// Removal of all expired items
if(window.localStorage){

    // two mins - (1000 * 60 * 20) would be 20 mins
    var expiryTime = new Date().getTime() - (1000 * 60 * 2);

    var deleteRows = [];
    for(var i=0; i < localStorage.length; i++){
        var key = localStorage.key(i);
        var partsArray = key.split('-');
        // The last value will be a timestamp
        var lastRow = partsArray[partsArray.length - 1];

        if(lastRow && parseInt(lastRow) < expiryTime){
            deleteRows.push(key);
        }
    }
    // delete old data
    for(var j=0; j < deleteRows.length; j++){
        localStorage.removeItem(deleteRows[j]);
    }
}

Answer 16

यदि आप ब्राउज़र लोकोस्टोरेज ऑब्जेक्ट से परिचित हैं , तो आप जानते हैं कि समाप्ति समय प्रदान करने का कोई प्रावधान नहीं है। हालाँकि, हम एक निश्चित अवधि के बाद locaStorage में आइटम्स को अमान्य करने के लिए TTL (टाइम टू लाइव) जोड़ने के लिए जावास्क्रिप्ट का उपयोग कर सकते हैं।

function setLocalStorage(key, value, ttl) {
    // `item` is an object which contains the original value
    // as well as the time when it's supposed to expire
    const item = {
        value: value,
        expiry: ttl <= 0 ? -1 : new Date().getTime() + ttl
    };
    localStorage.setItem(key, JSON.stringify(item));
}

function getLocalStorage(key) {
    const itemStr = localStorage.getItem(key);
    // if the item doesn't exist, return null
    if (!itemStr) {
        return null;
    }
    const item = JSON.parse(itemStr);
    // compare the expiry time of the item with the current time
    if (item.expiry > 0 && new Date().getTime() > item.expiry) {
        // If the item is expired, delete the item from storage
        // and return null
        localStorage.removeItem(key);
        return null;
    }
    return item.value;
}