سایت را به صفحه اصلی اضافه کنید

[علیرضا5]

سلام و عرض ادب
یک سری از سایتها هستن که وقتی با موبایل وارد میشی یک پیام در صفحه نمایش داده میشه با این عنوان

سایت را به صفحه اصلی اضافه کنید

و اگر روش کلیک کنی خوب یک آیکون در موبایلت ایجاد میشه

در این مورد چی رو باید تو اینترنت سرچ کنم
یا اینکه اگه مقاله ای مناسب سراغ دارین لطفا معرفی کنین

با تشکر

[moslem.hady]

سرچ کنید PWA

[علیرضا5]

بله ممنون
سرچ کردم خییلی چیزها رو متوجه شدم
ولی یک مورد رو که منظور اصلیم در تایپک بود رو هیج جا پیدا نکردم


عرض کردم یک سری از سایتها هستن که وقتی با موبایل وارد میشی یک پیام در صفحه نمایش داده میشه با این عنوان


سایت را به صفحه اصلی اضافه کنید


و اگر روش کلیک کنی خوب یک آیکون در موبایلت ایجاد میشه


من نمی خوام که کاربر سه نقطه مرورگر رو بزنه و دنببال گزینه **اضافه کردن به صفحه** بگرده


بلکه تا وارد سایت شد ییه پیام براش بیاد که می خوای سایت رو به صفحه اصلی اضافه بکنی
به محض کلیکش ایکون به صفحه اصلی اضافه بشه




این چنین موردی رو تو برخی از سایتها دیدم


باتشکر

[moslem.hady]

این همون pwa هست. فقط یه سری شرط داره. اولا باید حتما ssl داشته باشه سایت. دوما فکر میکنم سایز آیکون خاصی باید داشته باشه. 192 فکر کنم بود. این دوتا باشه و خطایی نداشته باشید، دکمه نصب میاد.

[علیرضا5]

باتشکر از پاسختون

الان این صفحه رو ملاحظه بفرمائید https://bazarefori.ir/pwa/pwa.html هم اس اس ال داره و هم آیکون 192 ولی اون پیام نمیاد

الان سایت شیپور توحالت دسکتاپ که وارد بشید سه نقطه مرورگر رو که بزنین گزینه install sheypoor وجود داره ولی صفحه ای که من ساختم این جوری نیست

ضمن اینکه به نظرم خطایی نداره چون وقتی از **افزودن به صفحه اصلی** خود مرورگر استفاده می کنم وب اپلیکیشن رو میسازه

{

  "short_name": "bazarefori",

  "name": "bazarefori",

  "theme_color": "#4A90E2",

  "background_color": "#F7F8F9",

 // "display": "standalone",

  "display": "fullscreen",

  "icons": [

      {  

   "src": "/pwa/icons-192.png",

   "sizes": "36x36",

   "type": "image/png",

   "density": "0.75"

  },

    {

      "src": "/pwa/icons-192.png",

      "type": "image/png",

      "sizes": "48x48"

    },

    {

       "src": "/pwa/icons-192.png",

   "sizes": "72x72",

   "type": "image/png",

   "density": "1.5"

  },





    {

    "src": "/pwa/icons-192.png",

   "sizes": "96x96",

   "type": "image/png",

   "density": "2.0"

  },

  {

   "src": "/pwa/icons-192.png",

   "sizes": "144x144",

   "type": "image/png",

   "density": "3.0"

  },

  {

   "src": "/pwa/icons-192.png",

   "sizes": "192x192",

   "type": "image/png",

   "density": "4.0"

  }

  ],

  "start_url": "/"

}

[moslem.hady]

داره خطا میده
serviceWorker.js:1 Uncaught (in promise) DOMException: Cache.addAll(): duplicate requests (https://bazarefori.ir/)

[علیرضا5]

داره خطا میده
serviceWorker.js:1 Uncaught (in promise) DOMException: Cache.addAll(): duplicate requests (

https://bazarefori.ir/

)

اینو برطرف کردم ولی باز گزینه install در حالت دسکتاپ نمیاد

[علیرضا5]

لطفا کمی بیشتر توضیح بدین
الان باید چیکار کنم

-*---

بازم تشکر که وقت گذاشتین

[علیرضا5]

این کل کدهای بنده هست

        if ("serviceWorker" in navigator) {





            navigator.serviceWorker.register("/pwa/serviceWorker.js")

               .then(reg => {

                   alert("Service worker registred successfully" +  reg);

        })

        .catch(err => {

            alert("service worker not registred !!"+ err);

        });

        }

******

<link rel="manifest" href="/pwa/manifest.json" />

******

{

  "name": "bazarefori1p",

  "description": "bazarefori",

  "short_name": "bazarefori",

  "start_url": "/",

  "display": "standalone",

  "background_color": "#fff",

  "theme_color": "#0078C1",

  "gcm_sender_id": "103953800507",

  "orientation": "portrait",

  "prefer_related_applications": true,

  "related_applications": [

    {

      "platform": "play",

      "url": "https://play.google.com/store/apps/details?id=com.sheypoor.mobile",

      "id": "com.sheypoor.mobile"

    },

    {

      "platform": "itunes",

      "url": "https://itunes.apple.com/us/app/shypwr-sheypoor/id877169218?mt=8"

    }

  ],

  "permissions": [

    "gcm"

  ],

  "version": 1.0,

  "icons": [

    {

      "src": "/pwa/icons-192.png",

      "type": "image/png",

      "sizes": "48x48"

    },

    {

    "src": "/pwa/icons-192.png",

   "sizes": "128x128",

   "type": "image/png",

   "density": "2.0"

  },

    {

   "src": "/pwa/icons-192.png",

   "sizes": "192x192",

   "type": "image/png",

   "density": "4.0"

  }

  ]

}

******

const staticCacheName = "site-static-v1";

const cacheAssets = [

"/"

];





self.addEventListener("install", evt => {

    evt.waitUntil(

      caches

        .open(staticCacheName)

        .then(cache => {

            console.log("caching assets...");

cache.addAll(cacheAssets);

})

      .catch(err => {})

  );

});





self.addEventListener("fetch", evt => {

    evt.respondWith(

      caches

        .match(evt.request)

        .then(res => {

            return res || fetch(evt.request);

})

      .catch(err => {

          if (evt.request.url.indexOf(".html") > -1) {

          return caches.match("./");

}

})

  );

});