كيفية إبطال بيان ذاكرة التخزين المؤقت HTML5 بشكل صحيح لتطبيقات الويب عبر الإنترنت / غير المتصل؟

StackOverflow https://stackoverflow.com/questions/1715568

سؤال

أنا أستخدم حاليا بيان ذاكرة التخزين المؤقت (كما هو موضح هنا). هذا يجعل هذه الموارد اللازمة لتشغيل التطبيق المتاح عند عدم الاتصال المستخدم.

لسوء الحظ، فإنه يعمل بشكل جيد للغاية.

بعد تحميل بيان ذاكرة التخزين المؤقت، تخزين Firefox 3.5+ تخزين جميع الموارد المشار إليها صراحة في بيان ذاكرة التخزين المؤقت. ومع ذلك، إذا تم تحديث ملف على الخادم ويحاول المستخدم من تحديث الصفحة أثناء الإنترنت (بما في ذلك ذاكرة التخزين المؤقت نفسها)، فسترفض Firefox لإحضار أي شيء. يبقى التطبيق مجمد تماما في النقطة الأخيرة التي تم تخزينها مؤقتا. أسئلة:

  1. أريد أن تعتمد Firefox بشكل فعال على الموارد المخزنة مؤقتا عند فشل اتصال الشبكة. لقد حاولت استخدام كتلة الاحتراق، ولكن دون جدوى. هل هذا ممكن؟
  2. إذا كان رقم 1 غير ممكن، فهل من الممكن أن يقوم المستخدم بإجراء تحديث صفحة وتجاوز هذه ذاكرة التخزين المؤقت (CTRL-F5 لا يفعل ذلك ولا تطهير ذاكرة التخزين المؤقت للمتصفح، بشكل مثير للصدمة) اختصار بياناتها الخاصة؟ بدلا من ذلك، هل تؤيد آلية بيئي ذاكرة التخزين المؤقت رؤوس انتهاء الصلاحية وهي سلوكها فيما يتعلق بهذا في أي مكان؟
هل كانت مفيدة؟

المحلول

أعتقد أنني أحصل على ذلك بمعنى، لن يقوم بتحديث أي شيء في ذاكرة التخزين المؤقت الخاصة بك، بما في ذلك بيان ذاكرة التخزين المؤقت المخزنة مؤقتا.

للكشف عن أن هذه هي القضية، أنا استعار بعض الكود من موزيلا وانخفض هذا إلى ملف HTML جديد (غير مخزن مؤقت) في طلبي. ذكرت الرسالة النهائية التي سجلت تسجيلها أنه قد يكون هناك مشكلة في بيئة التخزين المؤقت الخاصة بي، وبالتأكيد كان هناك (ملف مفقود).


// Convenience array of status values
var cacheStatusValues = [];
 cacheStatusValues[0] = 'uncached';
 cacheStatusValues[1] = 'idle';
 cacheStatusValues[2] = 'checking';
 cacheStatusValues[3] = 'downloading';
 cacheStatusValues[4] = 'updateready';
 cacheStatusValues[5] = 'obsolete';

 // Listeners for all possible events
 var cache = window.applicationCache;
 cache.addEventListener('cached', logEvent, false);
 cache.addEventListener('checking', logEvent, false);
 cache.addEventListener('downloading', logEvent, false);
 cache.addEventListener('error', logEvent, false);
 cache.addEventListener('noupdate', logEvent, false);
 cache.addEventListener('obsolete', logEvent, false);
 cache.addEventListener('progress', logEvent, false);
 cache.addEventListener('updateready', logEvent, false);

 // Log every event to the console
 function logEvent(e) {
     var online, status, type, message;
     online = (isOnline()) ? 'yes' : 'no';
     status = cacheStatusValues[cache.status];
     type = e.type;
     message = 'online: ' + online;
     message+= ', event: ' + type;
     message+= ', status: ' + status;
     if (type == 'error' && navigator.onLine) {
         message+= ' There was an unknown error, check your Cache Manifest.';
     }
     log('
'+message); } function log(s) { alert(s); } function isOnline() { return navigator.onLine; } if (!$('html').attr('manifest')) { log('No Cache Manifest listed on the tag.') } // Swap in newly download files when update is ready cache.addEventListener('updateready', function(e){ // Don't perform "swap" if this is the first cache if (cacheStatusValues[cache.status] != 'idle') { cache.swapCache(); log('Swapped/updated the Cache Manifest.'); } } , false); // These two functions check for updates to the manifest file function checkForUpdates(){ cache.update(); } function autoCheckForUpdates(){ setInterval(function(){cache.update()}, 10000); } return { isOnline: isOnline, checkForUpdates: checkForUpdates, autoCheckForUpdates: autoCheckForUpdates }

كان هذا مفيدا بالتأكيد، لكن يجب أن أطلب بالتأكيد ميزة من Mozilla الذي يطبع ذاكرة التخزين المؤقت المشوهة على الأقل إلى وحدة التحكم في الخطأ. لا ينبغي أن تتطلب رمز مخصص للتعرف على هذه الأحداث لتشخيص مشكلة تافهة كملف غير مطلوب.

نصائح أخرى

لقد استخدمت رمز من HTML5 الصخور: تحديث ذاكرة التخزين المؤقت:

window.addEventListener('load', function(e) {
  if (window.applicationCache) {
    window.applicationCache.addEventListener('updateready', function(e) {
        if (window.applicationCache.status == window.applicationCache.UPDATEREADY) {
          // Browser downloaded a new app cache.
          // Swap it in and reload the page to get the new hotness.
          window.applicationCache.swapCache();
          if (confirm('A new version of this site is available. Load it?')) {
            window.location.reload();
          }
        } else {
          // Manifest didn't changed. Nothing new to server.
        }
    }, false);
  }
}, false);

إخلاء المسئولية: تجربتي مع مظاهرة وذاكرة التخزين المؤقت هي كل Safari و FF قد تتعامل مع بعض الأشياء بشكل مختلف.

  1. انت على حق تماما. إذا كانت هناك أي ملفات مدرجة في البيان الذي لا يمكن العثور عليه، فلن يحدث أي مخطط للتخزين مؤقت.

  2. حتى لو كنت متصلا، سيقوم المتصفح بالتحقق من ملف البيان فقط. أثناء انتظار ملف البيان، سيستمر في تحميل الموقع من ذاكرة التخزين المؤقت - بهذه الطريقة لا يؤدي ذلك إلى تأخير التقديم - ولكن هذا يعني أنك لا ترى أي تغييرات على الحمل الأول.

  3. في المرة التالية، يتم تحميل الموقع، إذا تم تغيير البيان في الحمل السابق، فسيتم تحميل الملفات الجديدة.

من الضروري دائما إعادة تحميل مرتين لرؤية أي تغييرات. في الواقع، كان علي أحيانا إعادة تحميل 3 مرات لرؤية التحديث. لا فكرة لماذا.

عند تصحيح الأخطاء، أقوم بإنشاء ملف البيان الخاص بي أثناء الطيران باستخدام PHP، لذلك لا توجد فرصة لخط المطبخ في اسم ملف. أقوم أيضا بإنشاء رقم الإصدار عشوائيا في كل مرة لفرض تحديث ولكن لا يزال لديك Webapp غير متصل للاختبار.

بمجرد اكتماله، يمكن لملف PHP فقط صدى بيانات البيان المحفوظة برقم إصدار ثابت وسيتم استخدام ذاكرة التخزين المؤقت دائما.

فقط بعض الأشياء التي تعلمتها أثناء اللعب مع البيان وذاكرة التخزين المؤقت مؤخرا. إنه يعمل بشكل رائع، ولكن يمكن أن يكون مربكا.

لا يوجد انتهاء الصلاحية. إلى غير الخزان، يجب عليك تغيير ملف البيان ليس لديك أي شيء فيه ويقوم بالتحديث. على Safari، تطهير ذاكرة التخزين المؤقت للمستخدم مسح جميع الملفات المخزنة مؤقتا.

كان لدي نفس المشكلة: بمجرد حفظ Firefox الملفات دون اتصال، لن إعادة تحميلها على الإطلاق. عملت Chrome كما هو متوقع، فقد فحصت ملف البيان للتغييرات وإعادة تحميل كل شيء إذا تم تغيير ملف البيان. لم يقوم Firefox حتى بتنزيل ملف البيان من الخادم، لذلك لا يمكن أن يلاحظ التغييرات.

بعد التحقيق، اكتشفت أن فايرفوكس كان التخزين المؤقت لملف بيان التخزين المؤقت (ذاكرة التخزين المؤقت الطراز القديم، وليس ذاكرة التخزين المؤقت دون اتصال). إعداد رأس ذاكرة التخزين المؤقت لملف البيان Cache-Control: no-cache, private حل المشكلة.

قمت بإضافة إضافات فايرفوكس التي يبطلت بيض التخزين المؤقت ومسح التخزين المحلي HTML5.

http://sites.google.com/site/keigoattic/home/webrelated#toc-firefox-html5-offline-cache-and-loc.

يمكنك أيضا إبطال بيان ذاكرة التخزين المؤقت عن طريق كتابة التعليمات البرمجية أدناه في وحدة التحكم في الخطأ:

// invalidates the cache manifest
var mani = "http://.../mysite.manifest"; // manifest URL
Components.classes["@mozilla.org/network/application-cache-service;1"].getService(Components.interfaces.nsIApplicationCacheService).getActiveCache(mani).discard();

أو، من خلال كتابة التعليمات البرمجية أدناه في شريط العناوين سوف يقوم بإنفاذ ذاكرة التخزين المؤقت يدويا ليتم تحديثها:

javascript:applicationCache.update()

حسنا، لقد اتصلت بالتحديث () فقط () على ذاكرة التخزين المؤقت، بعد إجراء تغيير تحرير إلى ملف البيان، واستلم التسلسل الكامل للتحقق / التنزيل / جاهز، قام بإعادة تحميل واحد، وتغيير النص الذي قمت به في أحد بلدي JS الملفات التي تظهر في الصفحة الأولية لتطبيقي، ظهرت على الفور.

يبدو أنني فقط بحاجة إلى إعادة تحميل واحد.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top