إنشاء تطبيق ويب تقدمي يمكن تثبيته وتشغيله على كل عميل

وسط

استوديو مرئي

• فيسوال ستوديو 2019

.NET

• .NET 5.0

ما هو تطبيق الويب التقدمي (PWA)؟

ببساطة ، إنه تطبيق يسمح لك بتثبيت واستخدام تطبيقات الويب على كل جهاز مثل جهاز كمبيوتر يعمل بنظام Windows أو iPhone أو Android.

واقع Blazor WebAssembly هو WebAssembly موحد في حد ذاته ، وبالتالي فإن التنفيذ المذكور أعلاه ممكن. إنه يعتمد بشكل أساسي على تطبيق الويب ، ولكن يمكنك أيضا استخدام الميزات الأصلية مثل إشعارات الدفع في Plus Alpha.

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

إنشاء مشروع Blazor WebAssembly PWA

إنه في الأساس نفس إنشاء مشروع Blazor WebAssembly.

ما عليك سوى إنشاء المشروع كما تفعل عادة ، وعندما تأتي إلى شاشة "معلومات إضافية" أدناه ، ما عليك سوى التحقق من "تطبيق الويب التقدمي".

بصرف النظر عن الميزات الخاصة ب PWA ، فإن تطوير Blazor WebAssembly هو في الأساس نفس النمط الخالي من PWA.

الاختلافات عن المشاريع غير التابعة ل PWA

عند إنشاء مشروع في PWA، ستحصل على عدد قليل من الملفات الأخرى.

أيضا، عند فتح ،index.html تتم إضافة بعض التعليمات البرمجية التي تشير إلى هذه الملفات.

جرب PWA

قم بتشغيل المشروع لتصحيح الأخطاء.

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

عند النقر فوقه ، يتم عرض تأكيد للتثبيت ، لذلك سأحاول تثبيته.

سيؤدي ذلك إلى فتح نافذة منفصلة يمكنك من خلالها تشغيل تطبيق Blazor. يعمل كتطبيق عميل ، وليس كمتصفح ويب ، بحيث يمكنك أيضا تكوين الإعدادات المتعلقة بنظام التشغيل كما هو موضح في الشكل.

نظرا لتثبيته ، سيتم تسجيله في قائمة البدء مثل هذه وستتمكن من بدء تشغيله.

ومع ذلك ، نظرا لأن المحتوى عبارة عن تطبيق ويب ، فلا يمكن استخدامه ما لم يكن هناك خادم يمكنه تنزيل المحتوى. على سبيل المثال، إذا قمت بتثبيته أثناء تشغيل تصحيح، فلا يمكنك استخدام التطبيق المثبت إلا إذا كنت قد بدأت IIS Express لتصحيح الأخطاء. لاحظ أيضا أنه لا يمكن تثبيت PWAs بدون اتصال https.

إلغاء التثبيت

إجراء إلغاء التثبيت هو نفسه بالنسبة للتطبيق المثبت العادي. تعتمد طريقة التشغيل على النظام الأساسي المستهدف للتثبيت.

سجل التغيير

2022/7/13

• تمت إضافة توضيح أن https مطلوب لتثبيت PWA.

2022/3/30

• الطبعة الأولى