নেটিভ অ্যাপ ইনস্টল প্রম্পট

নেটিভ অ্যাপ ইনস্টল প্রম্পট আপনাকে ব্যবহারকারীদের দ্রুত এবং নির্বিঘ্নে তাদের ডিভাইসে সরাসরি অ্যাপ স্টোর থেকে আপনার নেটিভ অ্যাপ ইনস্টল করার ক্ষমতা দেয়, ব্রাউজার ছেড়ে না গিয়ে এবং বিরক্তিকর ইন্টারস্টিশিয়াল না দেখিয়ে।

মানদণ্ড কি?

ব্যবহারকারীকে নেটিভ অ্যাপ ইনস্টল প্রম্পট দেখানোর জন্য, আপনার সাইটকে অবশ্যই নিম্নলিখিত মানদণ্ড পূরণ করতে হবে:

  • বর্তমানে ডিভাইসে ইনস্টল করা ওয়েব অ্যাপ বা নেটিভ অ্যাপ দুটিই নয়।
  • একটি ওয়েব অ্যাপ ম্যানিফেস্ট অন্তর্ভুক্ত করে যার মধ্যে রয়েছে:
    • short_name
    • name (ব্যানার প্রম্পটে ব্যবহৃত)
    • একটি 192px এবং একটি 512px সংস্করণ সহ icons
    • prefer_related_applications true
    • related_applications অবজেক্ট অ্যাপ সম্পর্কে তথ্য সহ
  • HTTPS এর মাধ্যমে পরিবেশন করা হয়েছে

আপনি যখন এই মানদণ্ডগুলি পূরণ করবেন তখন একটি beforeinstallprompt ইভেন্ট চালু হবে। আপনি ব্যবহারকারীকে আপনার নেটিভ অ্যাপ ইনস্টল করতে অনুরোধ করতে এটি ব্যবহার করতে পারেন।

প্রয়োজনীয় ম্যানিফেস্ট বৈশিষ্ট্য

ব্যবহারকারীকে আপনার নেটিভ অ্যাপ ইনস্টল করার অনুরোধ জানাতে, আপনাকে আপনার ওয়েব অ্যাপ ম্যানিফেস্টে দুটি বৈশিষ্ট্য যোগ করতে হবে, prefer_related_applications এবং related_applications ।

"prefer_related_applications": true,
"related_applications": [
    {
    "platform": "play",
    "id": "com.google.samples.apps.iosched"
    }
]

prefer_related_applications প্রপার্টি ব্রাউজারকে ওয়েব অ্যাপের পরিবর্তে আপনার নেটিভ অ্যাপ দিয়ে ব্যবহারকারীকে অনুরোধ করতে বলে। আপনি যদি এই মানটি সেট না করে রেখে যান, বা false , ব্রাউজার ব্যবহারকারীকে পরিবর্তে ওয়েব অ্যাপটি ইনস্টল করতে অনুরোধ করবে৷

related_applications হল বস্তুর তালিকা সহ একটি অ্যারে যা ব্রাউজারকে আপনার পছন্দের নেটিভ অ্যাপ্লিকেশন সম্পর্কে বলে। প্রতিটি বস্তুর একটি platform সম্পত্তি এবং একটি id সম্পত্তি অন্তর্ভুক্ত করা আবশ্যক। যেখানে platform play হয় এবং id আপনার প্লে স্টোর অ্যাপ আইডি।

ইনস্টল প্রম্পট দেখান

ইনস্টল ডায়ালগ দেখানোর জন্য, আপনাকে এটি করতে হবে:

  1. beforeinstallprompt ইভেন্টের জন্য শুনুন।
  2. ব্যবহারকারীকে অবহিত করুন আপনার নেটিভ অ্যাপটি একটি বোতাম বা অন্য উপাদান দিয়ে ইনস্টল করা যেতে পারে যা একটি ব্যবহারকারীর অঙ্গভঙ্গি ইভেন্ট তৈরি করবে।
  3. সংরক্ষিত beforeinstallprompt ইভেন্টে prompt() কল করে প্রম্পট দেখান।

beforeinstallprompt জন্য শুনুন

মানদণ্ড পূরণ করা হলে, Chrome একটি ইন্সটল প্রম্পট ইভেন্টের beforeinstallprompt ফায়ার করবে। আপনার অ্যাপ ইনস্টল করা যেতে পারে তা নির্দেশ করতে আপনি এটি ব্যবহার করতে পারেন এবং তারপর ব্যবহারকারীকে এটি ইনস্টল করার জন্য অনুরোধ করতে পারেন।

beforeinstallprompt ইভেন্টটি চালু হয়ে গেলে, ইভেন্টের একটি রেফারেন্স সংরক্ষণ করুন এবং ব্যবহারকারী আপনার অ্যাপটি ইনস্টল করতে পারে তা নির্দেশ করার জন্য আপনার ব্যবহারকারী ইন্টারফেস আপডেট করুন।

let deferredPrompt;

window.addEventListener('beforeinstallprompt', (e) => {
  // Prevent Chrome 67 and earlier from automatically showing the prompt
  e.preventDefault();
  // Stash the event so it can be triggered later.
  deferredPrompt = e;
});

ব্যবহারকারীকে জানিয়ে দিন যে আপনার অ্যাপ ইনস্টল করা যাবে

আপনার অ্যাপ ইনস্টল করা যেতে পারে এমন ব্যবহারকারীকে জানানোর সর্বোত্তম উপায় হল আপনার ইউজার ইন্টারফেসে একটি বোতাম বা অন্যান্য উপাদান যোগ করা। একটি সম্পূর্ণ পৃষ্ঠা ইন্টারস্টিশিয়াল বা অন্যান্য উপাদান দেখাবেন না যা বিরক্তিকর বা বিভ্রান্তিকর হতে পারে।

window.addEventListener('beforeinstallprompt', (e) => {
  // Prevent Chrome 67 and earlier from automatically showing the prompt
  e.preventDefault();
  // Stash the event so it can be triggered later.
  deferredPrompt = e;
  // Update UI notify the user they can add to home screen
  btnAdd.style.display = 'block';
});

প্রম্পট দেখান

ইনস্টল প্রম্পট দেখাতে, ব্যবহারকারীর অঙ্গভঙ্গির মধ্যে থেকে সংরক্ষিত ইভেন্টে prompt() কল করুন। এটি একটি মডেল ডায়ালগ দেখাবে, ব্যবহারকারীকে তাদের হোম স্ক্রিনে আপনার অ্যাপ যোগ করতে বলবে।

তারপর, userChoice সম্পত্তির দ্বারা ফেরত দেওয়া প্রতিশ্রুতির জন্য শুনুন। প্রম্পট দেখানোর পরে এবং ব্যবহারকারী এটিতে সাড়া দেওয়ার পরে প্রতিশ্রুতিটি outcome বৈশিষ্ট্য সহ একটি বস্তু ফেরত দেয়।

btnAdd.addEventListener('click', (e) => {
  // hide our user interface that shows our A2HS button
  btnAdd.style.display = 'none';
  // Show the prompt
  deferredPrompt.prompt();
  // Wait for the user to respond to the prompt
  deferredPrompt.userChoice
    .then((choiceResult) => {
      if (choiceResult.outcome === 'accepted') {
        console.log('User accepted the A2HS prompt');
      } else {
        console.log('User dismissed the A2HS prompt');
      }
      deferredPrompt = null;
    });
});

আপনি বিলম্বিত ইভেন্টে শুধুমাত্র একবার prompt() কল করতে পারেন। ব্যবহারকারী যদি এটিকে খারিজ করে দেন, তাহলে পরবর্তী পৃষ্ঠা নেভিগেশনে beforeinstallprompt ইভেন্টটি চালু না হওয়া পর্যন্ত আপনাকে অপেক্ষা করতে হবে।

বিষয়বস্তু নিরাপত্তা নীতি ব্যবহার করার সময় বিশেষ বিবেচনা

যদি আপনার সাইটে একটি সীমাবদ্ধ বিষয়বস্তু নিরাপত্তা নীতি থাকে, তাহলে img-src নির্দেশে *.googleusercontent.com যোগ করতে ভুলবেন না যাতে Chrome প্লে স্টোর থেকে আপনার অ্যাপের সাথে যুক্ত আইকনটি ডাউনলোড করতে পারে।

কিছু ক্ষেত্রে *.googleusercontent.com হতে পারে কাঙ্খিত চেয়ে বেশি শব্দযুক্ত। অ্যাপ আইকনের URL নির্ধারণ করতে একটি অ্যান্ড্রয়েড ডিভাইস রিমোট ডিবাগ করে এটিকে সংকুচিত করা সম্ভব।