هل تثق بي؟
لبعض الوقت الآن يمكن تحويل تطبيقات الويب إلى تطبيق محلي بجهد ضئيل ، اعتمادًا على مدى تعقيد التطبيق. على سبيل المثال ، توفر أطر عمل مثل Capacitor.js أو Cordova مثل هذه الوظائف وهي أيضًا برامج مفتوحة المصدر. لتقديم تطبيق ويب كتطبيق أصلي ، يجب عليك إنشاء تطبيق الويب محليًا ، وإخبار الإطار الذي يوجد به مخرجات البناء هذه والانتظار بشكل أساسي حتى يتم إنشاء التطبيقات. المفهوم الأساسي هو أن موقع الويب الخاص بك يعمل فقط في عرض ويب مضمن. حسنًا ، الأمور على وشك التغيير الآن مرة أخرى من خلال تقديم "نشاط الويب الموثوق به" بواسطة Google.
PWA ++
ما هو "نشاط الويب الموثوق به" (TWA)؟ إليك الجوهر:
- يتم استخدام "نشاط الويب الموثوق به" في سياق متجر Google Play وتطبيق Android الأصلي الذي تم إنشاؤه من PWA
- يمكنك التحقق من ملكية PWA الخاص بك لتطبيق Android عن طريق إنشاء بيانات اعتماد تسمى "Assasslinks" - وهذا هو المكان الذي تحتاج إليه Google Play
- عن طريق تحميل ملف "ارتباطات الأصول" هذا إلى الدليل العام لتطبيق الويب الخاص بك ، يمكن لـ Google التحقق من ملكية PWA عندما لا يحصل تطبيق Android الأصلي على أي شخص ولكن يمكنك إنشاؤه
حسنًا ، كانت هذه نظرة عامة موجزة عن المفهوم الكامن وراء TWA. للتلخيص ، يتعلق جزء "الثقة" بالتحقق من ملكية PWA الخاص بك.
واحد جديد TWA ، من فضلك!
حسنًا ، ولكن كيف تعمل في الواقع؟ الإعداد بسيط حقًا ولن يستغرق أكثر من ساعة. إليك كيف يتم ذلك:
أولاً ، تأكد من إعداد PWA بشكل صحيح:
- manifest.json متاح وتم التحقق من صحته
- رمز + الاسم صحيحان
- يمكنك التحقق من هذه التغييرات بسرعة في DevTools
المكتبة الرئيسية التي ستتولى كل الأحمال الثقيلة تسمى "Bubblewrap" ، وهي حزمة Node.js تقدم CLI ، والتي ستستخدم طوال البرنامج التعليمي.
أولاً ، قم بإنشاء دليل جديد لـ TWA يسمى "twa". داخل "twa" سننشئ دليلًا آخر يسمى "android". سيحتوي "twa" نفسه على node_modules و "android" تطبيق Android الأصلي الفعلي.
تأكد من أنك الآن داخل "twa" لبدء مشروع npm جديد:
npm init -y
دعنا الآن نضيف CLI كتبعية للجهاز:
npm i -D @bubblewrap/cli
هذا كل ما نحتاجه الآن. فلنبدأ مشروع "التفاف الفقاعات" إذن. ما عليك سوى استبدال النطاق بنطاقك والتحقق من مكان "manifest.json". سيُطلب منك مواقع Java SDK + Android SDK ، والتي يمكنك إعادة استخدامها إذا كانت مثبتة بالفعل:
npx bubblewrap init --manifest=https://your-pwa.com/manifest.json
من الآن فصاعدًا ، حان الوقت لتصفح بعض الأسئلة والإجابات باستخدام CLI "التفاف الفقاعات". اعتمادًا على البيانات الوصفية المتوفرة في PWA ، سيتم بالفعل ملء معظم الحقول مسبقًا:
npx bubblewrap build
الآن بعد أن تم تحديد PWA الخاص بك وإنشاء تطبيق Android ، حان الوقت لإجراء اختبار سريع للتدخين. ابدأ تشغيل محاكي أو استخدم جهاز الاختبار الحقيقي الذي تختاره:
npx bubblewrap install
إذا سارت الأمور على ما يرام ، فسترى تطبيق الويب الخاص بك كتطبيق Android أصلي عامل. عظيم ، الجزء الأصعب قد تم بالفعل!
ما تبقى هو إنشاء ملف التحقق المسمى "Assetslinks.json". نظرًا لأنني أفترض أنك تريد تحميل حزمة التطبيقات إلى Google Play ، فمن المهم ملاحظة كيفية إدارة التوقيع فعليًا:
- سيدير Google Play مفاتيح التوقيع نيابة عنك ، مما يعني أنه يتعين علينا البحث عن قيمة SHA-256 المقابلة في Google Play Console
- ربما يكون "التفاف الفقاعة" قد أنشأ "روابط أصول" - ملف بالفعل بإدخال واحد ، والذي يحتوي على تجزئة SHA-256 مختلفة - لا تقلق ، سنستخدم كلاً من المفتاحين من Google Play والمفتاح الذي تم إنشاؤه
إذا لم يتم إنشاء ملف "ارتباطات الأصول" ، فإن الطريقة التي تابعت بها كانت تنزيل "أداة روابط الأصول" (موصى بها من قِبل Google ، رابط في الملحق) على جهاز الاختبار الخاص بي وقراءة SHA-256 من تطبيق الاختبار الموقع المثبت الذي تم إنشاؤه و مثبتة بواسطة "فقاعة التفاف". يمكنك بعد ذلك استخدام json هذا. ما عليك سوى التأكد من تكرار الإدخال الأول واستبدال SHA-256 بالإدخال من Google Play ، مما ينتج عنه ملف "Assasslinks" بإدخالين ، يختلفان فقط في مفاتيح التوقيع الخاصة بهم.
أوشكت على الانتهاء ، عليك الآن فقط إنشاء دليل جديد في المجلد العام الحالي لـ PWA وتحميل التطبيق مرة واحدة:
.well-known/assetlinks.json
الآن يمكن لـ Google قراءتها والتحقق من الملكية.
خطوة أخرى أيضا...
كل ما تبقى الآن هو تحميل حزمة الإصدار على Google Play وإصدارها! نعم ، الأمر بهذه البساطة في الواقع. تدفع Google حقًا بكل ما هو ممكن على الويب ولا تخشى تجربة أشياء جديدة. يُعد "نشاط الويب الموثوق به" طريقة جديدة لسد الفجوة بين الويب والبرنامج الأصلي بشكل أكبر ، على الرغم من اقتصاره حاليًا على Android.
أوه ، ونعم: بالطبع تطبيق الويب هذا هو PWA و TWA. يمكنك التحقق من تطبيق Android في Google Play ، الرابط أدناه في الملحق.
- Tom
