23

वास्तव में चर्चा के लिए त्वरित प्रश्न, क्योंकि मैं अलग-अलग लोगों से इनपुट करना चाहता था।आवेदन कैश या सेवा श्रमिक - 2016/क्यू 2 में उपयोग करने के लिए?

मैं एक वेब पेज ऐप विकसित करने की प्रक्रिया में हूं जो ऑफ़लाइन उपलब्ध होना चाहिए।

अब ऐसा करने के लिए, जैसा कि मैं इसे समझता हूं, आप एप्लिकेशन कैशिंग सुविधा या सेवा श्रमिकों का उपयोग करके उपयोग करेंगे।

हालांकि, यहां मेरे पास कंडरुम है।

पदावनत:: जब आवेदन कैश, the MDN clearly states शोध
यह सुविधा वेब मानकों से हटा दिया गया। हालांकि कुछ ब्राउज़र अभी भी इसका समर्थन कर सकते हैं, लेकिन इसे छोड़ने की प्रक्रिया में है। पुरानी या नई परियोजनाओं में इसका इस्तेमाल न करें। इसका उपयोग करने वाले पेज या वेब ऐप्स किसी भी समय टूट सकते हैं।

जिसके बाद एक और संवाद बॉक्स सेवा कर्मचारियों का उपयोग करने का सुझाव देता है।

The Service Workers page फिर यह बताता है कि सेवा कर्मचारी एक प्रयोगात्मक तकनीक कैसे हैं, और संगतता तालिका से परामर्श करना सबसे अच्छा है।

संगतता तालिका कहती है कि सफारी और इंटरनेट एक्सप्लोरर सेवा श्रमिकों का समर्थन नहीं करते हैं। आगे परामर्श this site और यह मानना ​​सही है कि यह सटीक है, यह बताता है कि माइक्रोसॉफ्ट द्वारा सेवा श्रमिकों को एकीकृत करने के लिए काम शुरू हो गया है, हालांकि सफारी के लिए वे "पांच साल की योजना में संक्षिप्त सकारात्मक संकेत" के साथ "विचाराधीन" हैं।

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

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

उत्तर

8

आप सही हैं, appcache is becoming unsupported

और वहाँ अन्य विकल्प है कि इस तरह के रूप में आईडीबी के अंदर डेटा और/या संपत्तियों को संग्रहीत कर रहे हैं:

कोशिश googling "offline pouchdb ember" या "offline pouchdb angular "अधिक उदाहरणों के लिए।

अभी ऑफ़लाइन उपलब्धता सुनिश्चित करने के लिए एकमात्र तंत्र सेवा कर्मचारी और अपाचे हैं। अवधि।

ये सभी तकनीकें आपकी साइट पर एक पृष्ठ एप्लिकेशन और प्रवेश बिंदु तक पहुंचने पर भरोसा करती हैं। इसलिए यदि आप एप्रेस पॉइंट हमेशा पहुंचने योग्य सुनिश्चित करने के लिए एपकेचे या सेवा श्रमिकों का उपयोग नहीं कर रहे हैं, तो आपको अपनी संपत्ति की सेवा करते समय http कैश पर फ़ॉलबैक करना होगा और उचित रूप से cache-related headers सेट करना होगा। वैसे भी, यूए द्वारा किसी भी पल में http कैश को बेदखल किया जा सकता है।

इस निर्णय का सामना, अगर यह अनिवार्य है आवेदन ऑफ़लाइन चलाने के लिए और सफारी में, एकमात्र विकल्प (सफारी से appcache हटाने के बारे में AFAIK, वहाँ रहे हैं कोई खबर) appcache उपयोग करने के लिए है।

जोखिम को कम करने के लिए आप एपकेच के अलावा पिछली तकनीकों में से एक (इंडेक्स डीडी पर संपत्तियों को स्टोर करने के लिए) चुन सकते हैं, इसलिए केवल एक चीज जिसे आप कैश करते हैं, एसपीए के लिए प्रवेश बिंदु है। यदि एपैच असमर्थित हो जाता है और कोई सेवा कार्यकर्ता विकल्प नहीं है तो आप कैश हेडर विकल्प पर स्विच कर सकते हैं।

वैसे भी, आप यह देखने के लिए फीचर डिटेक्शन (if ('serviceWorker' in navigator) { ... }) का उपयोग कर सकते हैं कि सेवा कर्मचारी उपलब्ध हैं और इसका उपयोग करते हैं। JakeCache (परीक्षण नहीं किया गया) और others are to come नामक सेवा श्रमिकों के आधार पर एपकेच के लिए एक पॉलीफिल है।

+1

, सहयोग के लिए धन्यवाद, हालांकि हम पहले से ही ढेर को लागू किया है, तो सोफे db और सोफे डाटाबेस में जाने के लिए एक विकल्प नहीं होगा। लेकिन फीचर डिटेक्शन निश्चित रूप से उपयोगी दिखता है। धन्यवाद। –

+0

मुझे आश्चर्य है कि इनमें से कौन सी विधियां कस्टम तत्वों और छाया डोम के लिए काम करती हैं। –

9

आप उसी वेब ऐप पर सेवा श्रमिकों और ऐप कैश का उपयोग करना चुन सकते हैं। ऐसे मामले में क्या होता है कि वे ब्राउज़र जो सेवा श्रमिकों का समर्थन नहीं करते हैं, ऐप कैश का उपयोग करेंगे, और जो लोग करते हैं वे ऐप कैश को अनदेखा करेंगे और सेवा कार्यकर्ता को ले लेंगे।

सूत्रों का कहना है: https://www.w3.org/TR/service-workers/#activation-algorithm, https://crbug.com/410665

+2

मुझे इसमें सादगी और तर्क पसंद है। सलाह के लिये धन्यवाद। –

5

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

यहाँ कुछ जावास्क्रिप्ट है कि हम एक या अन्य उपयोग करने के लिए है कि क्या पता लगाने के लिए दोनों

if ('serviceWorker' in navigator && b) { 
navigator.serviceWorker.register('/sw.js').then(function(registration) { 
// Registration was successful 
showMsg('ServiceWorker registration successful with scope: ', registration.scope); 
if (registration.installing) { 
    showMsg('Service worker installing'); 
} else if (registration.waiting) { 
    showMsg('Service worker installed'); 
} else if (registration.active) { 
    showMsg('Service worker active'); 
} 
    }).catch(function(err) { 
    // registration failed :(
    showMsg('ServiceWorker registration failed: ', err); 
    }); 

// Listen for claiming our ServiceWorker 
navigator.serviceWorker.addEventListener('controllerchange', 
function(event) { 
     // Listen for changes in the state of our ServiceWorker 
     navigator.serviceWorker.controller.addEventListener('statechange', function() { 
     // If the ServiceWorker becomes "activated", let the user know they can go offline! 
     if (this.state === 'activated') { 
     // This example is refreshing the app directly, but you can inform the user with a fancy modal window or similar 
      window.location.reload(true); 
     } 
     }); 
    }); 

// Browsers not using Service Workers 
    } else if ('applicationCache' in window) { 
     var iframe = document.createElement('iframe'); 
     iframe.style.display = 'none'; 
     iframe.src = 'load-appcache.html' 
     document.body.appendChild(iframe); 
     showMsg("Iframe loaded for AppCache management"); 

    } else { 
     showMsg("no service worker - no appCache"); 

} 

कोड प्रारंभ करने में मदद करता है AppCache नया पृष्ठ ताज़ा जब appcache फ़ाइल परिवर्तन वर्णित प्रारंभ करने में उपयोग कर रहे हैं और है। मैं कई स्रोतों से यह पकड़ लिया लेकिन सभी शक्तिशाली प्रस्तुति कि पैट्रिक Kettner PWA देव शिखर सम्मेलन 2016 के दौरान वितरित से आ रही: (https://www.youtube.com/watch?v=IgckqIjvR9U&t=1005s)

लोड appcache.html लेकिन

<!DOCTYPE html> 
<html manifest="offline.appcache"> 
    <head> 
     <title>loding appCache</title> 
    </head> 
    <body></body> 
</html> 

रहे हैं कुछ भी नहीं है निश्चित रूप से एसडब्ल्यू एक फैनसीयर ऐप देने के लिए कई संभावनाएं प्रदान करता है, लेकिन ऐप कैश और आईडीबी के साथ आप वास्तव में ऑफ़लाइन क्षमताओं सहित किसी भी व्यावसायिक तर्क को कर सकते हैं।

सावधान रहें कि आप क्रोम के साथ ऐप कैश कार्यक्षमता का परीक्षण करने में सक्षम नहीं होंगे क्योंकि आपने इसे अक्षम कर दिया है, लेकिन आप अभी भी फ़ायरफ़ॉक्स को मजबूर कर सकते हैं (मैंने 50.1.0 के साथ परीक्षण किया है)। तुम हमेशा मोज़िला एचटीएमएल 5 सेवा कार्यकर्ता डॉक्टर के अनुसार, हालांकि :)

2

सफारी का उपयोग कर सकते हैं:

नोट: एक सेवा कार्यकर्ता बारे में महान बात यह है कि अगर आप इस सुविधा का पहचान का उपयोग हम ऊपर दिखाए गए हैं जैसे , ब्राउज़र जो सेवा कर्मचारी का समर्थन नहीं करते हैं, वे सामान्य रूप से सामान्य ऐप में आपके ऐप का ऑनलाइन उपयोग कर सकते हैं। इसके अलावा, यदि आप किसी पृष्ठ पर एपकेचे और एसडब्ल्यू का उपयोग करते हैं, तो ब्राउज़र एसडब्ल्यू का समर्थन नहीं करते हैं लेकिन समर्थन करते हैं ऐप कैश इसका उपयोग करेगा, और दोनों ब्राउज़र जो ऐप कैश को अनदेखा करेंगे और एसडब्ल्यू को ले लेंगे।

कोड "ऊपर":

if ('serviceWorker' in navigator) { 
    navigator.serviceWorker.register('/sw-test/sw.js', {scope: '/sw-test/'}) 
    .then(function(reg) { 
    // registration worked 
    console.log('Registration succeeded. Scope is ' + reg.scope); 
    }).catch(function(error) { 
    // registration failed 
    console.log('Registration failed with ' + error); 
    }); 
} 

https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers

+0

क्या ब्राउजर जो दोनों का समर्थन करते हैं, वास्तव में दो बार 'आम' संपत्ति डाउनलोड करते हैं? –

संबंधित मुद्दे