2015-09-14 31 views
6

मैं इस डेमो के संदर्भ में Google Chrome के मूल बैनर समर्थन का उपयोग करके 'होमस्क्रीन में जोड़ें' बैनर को लागू करने का प्रयास कर रहा हूं।एंड्रॉइड के लिए क्रोम - होम स्क्रीन पर वेब ऐप जोड़ें

https://googlechrome.github.io/samples/app-install-banner/basic-banner/index.html

कल्पना वहाँ के अनुसार, आवश्यकताएँ हैं:

  • पेज एक सेवा कार्यकर्ता का उपयोग करता है साइट HTTPS का उपयोग कर रहा है, साइट (हां, नीचे देखें)
  • (हां एक वैध एसएसएल प्रमाण पत्र है और मैं HTTPS पर लोड कर रहा हूं। क्रोम साइट को सुरक्षित के रूप में दिखाता है और इसमें हरे रंग की पैडलॉक है, सर्टिफिकेट में कोई त्रुटि या चेतावनी नहीं है)
  • ऐप में एक घोषित घोषित किया गया है (हाँ, नीचे देखें)
  • प्रकट एक short_name, 144 पिक्सेल आइकन और 'छवि/png' का एक प्रकार है (हां, नीचे देखें)

प्रकट मैं उपयोग कर रहा हूँ के नीचे है।

{ 
    "name": "Web app test", 
    "short_name": "Test", 
    "icons": [ 
    { 
     "src": "/resources/launcher-icon-3x.png", 
     "sizes": "144x144", 
     "type": "image/png" 
    } 
    ], 
    "display": "standalone" 
} 

जिसमें एक छोटा_नाम और 144 छवि पिक्सेल आइकन प्रकार छवि/पीएनजी है।

https://github.com/GoogleChrome/samples/blob/gh-pages/service-worker/custom-offline-page/service-worker.js

जो इस लेख में सिफारिश की गई थी:

https://developers.google.com/web/updates/2015/03/increasing-engagement-with-app-install-banners-in-chrome-for-android?hl=en

सेवा कार्यकर्ता किया गया है

सेवा कार्यकर्ता मैं उपयोग कर रहा हूँ इस कोड का एक सीधा कॉपी पेस्ट है & पंजीकृत, मैनिफेस्ट पेज में लोड किया जा रहा है और छवि यूआरएल सही है, लेकिन बैनर नहीं दिख रहा है।

मेरे पास क्रोम: // झंडे/# बाईपास-ऐप-बैनर-सगाई-चेक सक्षम हैं, इसलिए मुझे कल वापस आने की आवश्यकता नहीं है और यह जांचता है कि यह काम करता है। मैं क्रोम के सभी डेमो पर होमस्क्रीन बैनर देखने में सक्षम हूं जो मैंने चेक किया है (जहां मैं इस कोड का अधिकतर हिस्सा लेता हूं) और मेरे फोन में क्रोम का नवीनतम संस्करण स्थापित है।

क्या कोई और चीज है जो मुझे याद आ रही है जो होमस्क्रीन बैनर को दिखने से रोक सकती है?

धन्यवाद।

+0

मुझे नहीं पता, लेकिन कुछ संभावनाएं: 1) प्रकट में "start_url" प्रॉपर्टी को परिभाषित करने का प्रयास करें, जैसे कि डेमो में, 2) मैं स्पष्ट नहीं था - क्या आपने मैनिफेस्ट को HTML फ़ाइल से लिंक किया था? 3) क्या यह संभव है कि आपके पास पहले से ही ऐप इंस्टॉल हो? इसके अलावा, मुझे विश्वास है कि यदि आप आगे सरल बनाना चाहते हैं तो आप वास्तव में रिक्त सेवा कार्यकर्ता फ़ाइल का उपयोग कर सकते हैं। –

+0

मुझे ऐसी ही समस्याएं हैं और मुझे जवाब नहीं मिला है। सबकुछ वहां है लेकिन ऐप बैनर नहीं दिख रहा है। क्या आपको एक समाधान मिला? – mapr

उत्तर

8

योग्य कुछ बातें की जांच करने के:

  • सुनिश्चित करें कि आप अपने प्रकट है कि शुरू करने के लिए पेज को परिभाषित करता है में एक start_url है।
  • सुनिश्चित करें कि आप अपने पृष्ठ
  • में एक <link rel=manifest> है छवि यूआरएल सब सही ढंग से प्रकट स्थान
  • अधिमानतः एक 192px आइकन के आधार पर हल सुनिश्चित करें, 144 न्यूनतम

मुनीर Lamouri पैदा कर दी है है एक manifest validator जिसका उपयोग आप अपने मैनिफेस्ट को सही करने के लिए कर सकते हैं सही है।

यदि आप क्रोम का उपयोग कर रहे हैं तो आपको क्रोम: // झंडे/# बाईपास-एप-बैनर-सगाई-चेक भी सक्षम करना चाहिए ताकि आपको किसी भी समस्या की त्वरित चेतावनी या दृश्यता मिल सके। अंत में आप किसी भी पेज लोड पर देव टूल्स कंसोल में देख सकते हैं और एक त्रुटि दिखायी जाएगी कि बैनर क्यों नहीं दिखाया गया था।

वहाँ भी developers.google.com पर मार्गदर्शन का एक बहुत है

  • Using App Install Banners
    • एक short_name, माउस और launch_url सहित मालसूची फ़ाइल बनाएं
    • से मैनिफ़ेस्ट फ़ाइल से लिंक करें पेज
  • Web App Install Banner
    • वैकल्पिक रूप से background_color और theme_color जैसी अतिरिक्त जानकारी शामिल करें।
  • Listening to events on App Install banner
    • जानें जब क्रोम सोचता है कि इसे स्थापित करने के लिए संकेत दे सकते हैं और फिर एक अधिक उपयुक्त समय है जब तक यह स्थगित करने की क्षमता प्रदान करते हैं।
    • समझें कि क्या उपयोगकर्ता ने onbeforeinstallprompt ईवेंट में प्रतिक्रिया को देखकर प्रॉम्प्ट को स्वीकार या अस्वीकार कर दिया है। http://mounirlamouri.github.io/manifest-validator/

      तो क्रोम के साथ क्रोम का उपयोग:

1

सामान्य तौर पर मैं किसी भी त्रुटि नहीं है इस में अपने प्रकट चिपकाने यह सुनिश्चित करने के लिए सलाह देते हैं // flags/# बाईपास-app- बैनर-सगाई-चेक सक्षम है, आप कंसोल में किसी भी पेज लोड पर देख सकते हैं और एक त्रुटि दिखायी जाएगी कि बैनर क्यों नहीं दिखाया गया था।

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