إضافة تطبيق الويب التقدّمي إلى Google Play

1. مرحبًا

في هذا المختبر، ستأخذ تطبيق ويب تقدّمي حالي سبق لك نشره وتغليفه في تطبيق لتوزيعه على "متجر Play" من Google.

أهداف الدورة التعليمية

  • كيفية استخدام Bubblewrap لتعبئة تطبيق الويب التقدّمي في "متجر Play" من Google
  • ما هو مفتاح التوقيع وكيفية استخدامه
  • كيفية إنشاء تطبيق جديد في "وحدة تحكّم المطوّرين" على Google Play وإعداد إصدار اختباري لاختبار تطبيقك قبل نشره
  • ما هي روابط Digital Asset Links وكيفية إضافتها إلى تطبيقك على الويب

ما يتعين عليك معرفته

المتطلبات

الحالات غير المشمولة

2. تغليف تطبيق الويب التقدّمي (PWA)

Bubblewrap هي أداة لتسهيل عملية تضمين تطبيق الويب التقدّمي في حِزمة تطبيق Android، وذلك من خلال تنفيذ بضعة أوامر من واجهة سطر الأوامر. ويتم ذلك من خلال إنشاء مشروع Android يطلق تطبيق الويب التقدّمي (PWA) على شكل نشاط موثوق به على الويب.

للبدء، أنشِئ دليلاً لمشروعك وانتقِل إليه:

$ mkdir my-pwa && cd my-pwa

بعد ذلك، شغِّل أداة سطر الأوامر Bubblewrap لإنشاء الإعدادات ومشروع Android لحِزمة تطبيق Android التي ستحمّلها إلى Play:

$ bubblewrap init --manifest=https://my-pwa.com/manifest.json

في هذا المثال، يتم إعداد Bubblewrap باستخدام موقع ملف بيان تطبيق الويب الخاص بتطبيق ويب تقدّمي. سيؤدي ذلك إلى إنشاء إعدادات تلقائية من ملف Web App Manifest، وبدء معالج داخل وحدة التحكّم يتيح لك تغيير الإعدادات التلقائية. اتّبِع التعليمات الواردة في المعالج لتغيير أي من القيم التي أنشأتها الأداة.

يعرض معالج Bubblewrap CLI عملية تهيئة من airhorner مع تجاهل النطاق واستخدام example.com بدلاً منه، وتجاهل عناوين URL لبدء التشغيل.

مفتاح التوقيع

يتطلّب "متجر Google Play" توقيع حِزم التطبيقات رقميًا باستخدام شهادة عند تحميلها، ويُشار إليها غالبًا باسم مفتاح التوقيع. هذه شهادة ذاتية التوقيع تختلف عن الشهادة المستخدَمة لعرض تطبيقك عبر HTTPS.

سيطلب منك Bubblewrap إدخال مسار المفتاح عند إنشاء التطبيق. إذا كنت تستخدم بطاقة بيانات حالية على "متجر Play" لتطبيقك، عليك إضافة مسار إلى المفتاح نفسه الذي تستخدمه بطاقة البيانات هذه.

يطلب معالج سطر الأوامر في Bubblewrap من المستخدم تحديد موقع واسم مفتاح التوقيع الحالي.

إذا لم يكن لديك مفتاح توقيع حالي وكنت بصدد إنشاء بطاقة بيانات جديدة على "متجر Play"، يمكنك استخدام القيمة التلقائية التي توفّرها أداة Bubblewrap لإنشاء مفتاح جديد لك:

معالج سطر الأوامر في Bubblewrap يسأل عمّا إذا كان المستخدم يريد إنشاء مفتاح توقيع جديد.

ناتج Bubblewrap

بعد تهيئة مشروع Bubblewrap وإكمال المعالج، سيتم إنشاء العناصر التالية:

  • twa-manifest.json: إعدادات المشروع، وتعكس القيم التي تم اختيارها في معالج Bubblewrap. عليك تتبُّع هذا الملف باستخدام نظام التحكّم في الإصدار، إذ يمكن استخدامه لإعادة إنشاء مشروع Bubblewrap بالكامل عند الحاجة.
  • ملفات مشروع Android: الملفات المتبقية في الدليل هي مشروع Android الذي تم إنشاؤه. هذا المشروع هو المصدر المستخدَم لأمر إنشاء Bubblewrap. يمكنك أيضًا تتبُّع هذه الملفات باستخدام نظام التحكّم في الإصدارات.
  • (اختياري) مفتاح التوقيع: إذا اخترت أن ينشئ Bubblewrap مفتاح التوقيع نيابةً عنك، سيتم إخراج المفتاح إلى الموقع الجغرافي الموضّح في المعالج. احرص على الاحتفاظ بالمفتاح في مكان آمن واقتصر على عدد قليل من الأشخاص الذين يمكنهم الوصول إليه، فهو يُستخدَم لإثبات أنّ التطبيقات على "متجر Play" صادرة عنك.

باستخدام هذه الملفات، يتوفّر لدينا الآن كل ما نحتاج إليه لإنشاء "حزمة تطبيق Android".

إنشاء حزمة تطبيق Android

من داخل الدليل نفسه الذي نفّذت فيه أمر تهيئة Bubblewrap، نفِّذ ما يلي (ستحتاج إلى كلمات المرور الخاصة بمفتاح التوقيع):

$ bubblewrap build

ناتج واجهة سطر الأوامر (CLI) في Bubblewrap لإنشاء مشروع، وطلب كلمات مرور لمفتاح التوقيع، وعرض عملية إنشاء إصدارات مختلفة من تطبيق Android

سينشئ أمر الإنشاء ملفّين مهمّين:

  • app-release-bundle.aab: مجموعة حزمات تطبيق Android لتطبيق الويب التقدّمي هذا هو الملف الذي سيتم تحميله إلى "متجر Google Play".
  • ‫app-release-signed.apk: هو تنسيق حِزم Android يمكن استخدامه لتثبيت التطبيق مباشرةً على جهاز تطوير باستخدام الأمر bubblewrap install.

3- تجربة تطبيق Bubblewrap

حان دورك الآن! باستخدام ما تعلّمته في الخطوة السابقة، حاوِل إنجاز ما يلي:

  1. أنشئ دليلاً لتخزين مشروع Android الذي تم إنشاؤه.
  2. ابدأ بإنشاء هذا الدليل باستخدام Bubblewrap وبيان تطبيق الويب الخاص بتطبيق الويب التقدّمي.
  3. أنشئ مفتاح توقيع جديدًا، أو أعِد استخدام المفاتيح الحالية إذا كانت متوفّرة لديك.
  4. أنشئ حزمة تطبيق Android من مشروع Android الذي تم إنشاؤه.

4. إضافة تطبيقك إلى "متجر Google Play"

بعد إنشاء "حزمة تطبيق Android" لتطبيق الويب التقدّمي، حان الوقت لتحميلها إلى "متجر Google Play". بعد تسجيل حساب المطوِّر، يمكنك الانتقال إلى Play Console لتسجيل الدخول والبدء.

إنشاء تطبيق

بعد تسجيل الدخول، ستظهر لك شاشة تعرض جميع تطبيقاتك. بالقرب من أعلى الصفحة، يظهر الزر إنشاء تطبيق الذي سيؤدي النقر عليه إلى عرض الشاشة التالية لإرشادك خلال عملية إنشاء بطاقة بيانات جديدة على متجر Google Play لتطبيق Android.

شاشة تعرض نموذج إنشاء تطبيق في Play Console

هناك عدد من الحقول التي يجب ملؤها هنا، بما في ذلك اسم التطبيق واللغة التلقائية وما إذا كان تطبيقًا أو لعبة وما إذا كان مجانيًا أو مدفوعًا وعدد من الإقرارات. لن تتمكّن من إنشاء تطبيق بدون الموافقة على البيانات، لذا من المهم قراءتها وفهمها قبل الموافقة عليها.

بعد ملء جميع المعلومات والنقر على زر إنشاء تطبيق في أسفل النموذج، سيتم نقلك إلى لوحة بيانات تطبيقك الجديد. في لوحة البيانات، ستظهر لك قوائم مهام عليك إكمالها لإعداد تطبيقك وبدء اختباره وإصداره.

إعداد الاختبار الداخلي

يُعدّ الاختبار الداخلي طريقة رائعة لإصدار تطبيقك سريعًا بدون مراجعة لمجموعة من المختبِرين الموثوق بهم الذين تختارهم. اطّلِع على المهام في قائمة التحقّق بدء الاختبار الآن، ثمّ اختَر اختيار المختبِرين.

قائمة التحقّق لبدء الاختبار الآن

سيؤدي النقر على هذه المهمة إلى نقلك إلى صفحة الاختبار الداخلي. من هنا يمكنك إدارة إعدادات الاختبار لتطبيقك. ويمكنك الانتقال إليها مرة أخرى من خلال فتح قسم الاختبار ضمن قائمة الإصدار في الشريط الجانبي. أول ما عليك فعله هنا هو إنشاء قائمة بعناوين البريد الإلكتروني للمختبِرين لاختبار تطبيقك. ولإجراء ذلك، انقر على الرابط إنشاء قائمة بعناوين البريد الإلكتروني في قسم المختبِرون من الصفحة. سيؤدي هذا إلى فتح نافذة منبثقة لإنشاء قائمة عناوين البريد الإلكتروني.

نافذة منبثقة تعرض نموذج إنشاء قائمة بعناوين البريد الإلكتروني، والذي يتضمّن اسم القائمة وعناوين البريد الإلكتروني ورابطًا لتحميل ملف CSV لعناوين البريد الإلكتروني ومساحة لعرض عناوين البريد الإلكتروني التي تم تحميلها.

في هذه النافذة المنبثقة، ستسمّي قائمة عناوين البريد الإلكتروني، ويمكنك إما إدخال عناوين البريد الإلكتروني يدويًا أو تحميل ملف CSV لعناوين البريد الإلكتروني لاستخدامه. بعد الانتهاء، انقر على زر حفظ التغييرات. سيصبح بإمكانك الرجوع إلى قوائم عناوين البريد الإلكتروني التي أنشأتها من قبل لإضافة عناوين بريد إلكتروني أو إزالتها حسب الحاجة. بعد إضافة المختبِرين، حان الوقت لإنشاء إصدار تجريبي. انقر على زر إنشاء إصدار جديد في أعلى الصفحة.

صفحة "الاختبار الداخلي" مع سهم يشير إلى زر إنشاء إصدار جديد

إنشاء إصدار تجريبي

بعد النقر على الزر إنشاء إصدار جديد، سيُطلب منك إكمال عدد من الأقسام. في القسم الأول، سلامة التطبيق، يمكنك اختيار كيفية إدارة مفتاح توقيع تطبيقك. الخيار التلقائي هو السماح لـ Google بإدارة مفتاح التوقيع، وهو الخيار الذي يُنصح به لأنّه آمن ويحافظ على إمكانية استرداد تطبيقك في حال فقدت مفتاح التحميل.

ميزة "توقيع التطبيق" من Play

مخطط انسيابي يعرض، من اليمين إلى اليسار، مطوّرًا ومفتاح التحميل الذي يوقّع التطبيق ويرسله إلى Google. بعد ذلك، ستحصل Google على مفتاح توقيع التطبيق وتوقّع التطبيق باستخدام هذا المفتاح، ثم تسلّمه إلى المستخدم.

تحميل التطبيق وإكماله

بعد اختيار طريقة إدارة مفتاح التوقيع، سيُطلب منك تحميل حِزمة تطبيقك إلى إصدارك. لإجراء ذلك، اسحب ملف app-release-bundle.aab الذي أنشأته أداة Bubblewrap وأفلِته في النموذج. لإنهاء الإصدار، املأ تفاصيل الإصدار المتبقية وانقر على حفظ، ثم على مراجعة إصدار التطبيق، وأخيرًا على بدء الطرح في مسار الاختبار الداخلي لبدء إصدار تطبيقك. سيؤدي ذلك إلى إتاحة تطبيقك للمختبِرين الداخليين. بالعودة إلى علامة التبويب المختبِرون في صفحة الاختبار الداخلي، يمكنك نسخ رابط لمشاركته مع المختبِرين ليتمكّنوا من الوصول إلى تطبيقك.

صفحة الاختبار الداخلي، مع سهم يشير إلى رابط نسخ الرابط لمشاركة رابط اختبار مع المختبِرين

5- تجربة الميزة: إنشاء تطبيق

حان دورك الآن! باستخدام ما تعلّمته في الخطوة السابقة، حاوِل إنجاز ما يلي:

  1. أنشئ تطبيقًا جديدًا لتطبيق الويب التقدّمي في Play Console.
  2. إعداد الاختبار الداخلي للتطبيق وإضافة نفسك كمختبِر
  3. حمِّل حِزمة تطبيقك وأنشئ إصدارًا تجريبيًا لتطبيقك.
  4. ثبِّت تطبيقك من "متجر Play" على جهاز Android أو ChromeOS باستخدام رابط الاختبار.

6. روابط تنقل إلى مواد عرض رقمية

إذا أتيحت لك فرصة اختبار تطبيق الويب التقدّمي في Play، قد تلاحظ أنّه لا يعمل في وضع ملء الشاشة. ويرجع ذلك إلى أنّك لم تثبت ملكية الموقع الإلكتروني بعد من خلال ملف روابط التنقل إلى مواد العرض الرقمية. على الرغم من أنّ Bubblewrap يمكنه إعداد حِزمة تطبيق Android وإنشاؤها، عليك إكمال عملية الربط من خلال تعديل تطبيق الويب.

الحصول على الملف المرجعي لشهادة SHA-256 لتطبيقك

لإعداد روابط Digital Asset Links الخاصة بتطبيق الويب التقدّمي، ستحتاج إلى الملف المرجعي لشهادة SHA-256 المستخدَمة لتوقيع الحزمة التي يتلقّاها المستخدم على هاتفه.

من خلال ميزة "توقيع التطبيق" من Play

إذا أعددت ميزة "توقيع التطبيق" من Play لتطبيقك عند إنشاء الإصدار (وهو ما كان يُنصح به سابقًا)، يمكن العثور على الملف المرجعي SHA-256 في Play Console. يُرجى العِلم أنّ هذه الشهادة تختلف عن الشهادة المستخدَمة لتحميل تطبيقك. للحصول على بصمة الإصبع، انتقِل من داخل تطبيقك في Play Console إلى الإصدارات->الإعداد->سلامة التطبيق. سيظهر لك عدد من الخيارات ضمن شهادة مفتاح توقيع التطبيق. انسخ قيمة الملف المرجعي لشهادة SHA-256.

لقطة شاشة "سلامة التطبيق" مع تمييز الملف المرجعي لشهادة SHA-256

بدون ميزة "توقيع التطبيق" من Play

إذا أوقفت ميزة "توقيع التطبيق" من Play، سيكون المفتاح المستخدَم لتوقيع التطبيق النهائي هو المفتاح نفسه الذي تستخدمه لتحميل التطبيق إلى Play Console. يمكنك استخدام keytool في Java لاستخراج بصمة الإصبع:

$ keytool -list -v \
    -keystore <keystore-file-path> \
    -alias <key-alias> \
    -keypass <key-password> \
    -storepass <store-password> | grep SHA256

$     SHA256: BD:92:64:B0:1A:B9:08:08:FC:FE:7F:94:B2...

لاستخدامه، عليك معرفة مسار مفتاح التوقيع وكلمات المرور ذات الصلة. انسخ القيم السداسية العشرية لمفتاح SHA256.

يمكن لتطبيق Bubblewrap إدارة بصمات الشهادات التي تم استردادها وإنشاء ملف Digital Asset Links الصحيح لك. لإضافة بصمة باستخدام Bubblewrap، نفِّذ الأمر التالي من داخل الدليل نفسه الذي تم إنشاؤه أثناء تغليف تطبيق الويب التقدّمي باستخدام Bubblewrap، مع استبدال <fingerprint> بالبصمة التي تم نسخها من الخطوة السابقة.

$ bubblewrap fingerprint add <fingerprint>

سيؤدي هذا الأمر إلى إضافة بصمة الإصبع إلى قائمة بصمات الإصبع الخاصة بالتطبيق وإنشاء ملف assetlinks.json. حمِّل هذا الملف إلى الدليل .well-known على المصدر نفسه الذي تستضيف عليه تطبيق الويب التقدّمي.

7. تجربة ميزة "روابط تنقل إلى مواد عرض رقمية"

حان دورك الآن! باستخدام ما تعلّمته في الخطوة السابقة، حاوِل إنجاز ما يلي:

  1. ابحث عن الملف المرجعي لشهادة SHA-256 لتطبيقك.
  2. إنشاء ملف Digital Asset Links لتطبيقك
  3. حمِّل ملف Digital Asset Links إلى تطبيق الويب التقدّمي.
  4. تأكَّد من إعداد ملف Digital Asset Links بشكلٍ سليم باستخدام واجهة برمجة التطبيقات وتطبيق الاختبار.

8. اختبر معلوماتك

قبل الانتهاء، اختبِر معلوماتك واطّلِع على ما تعلّمته من خلال الإجابة عن الأسئلة التالية. لا تنظر إلى الإجابات!

بعد إنشاء مشروع Android باستخدام Bubblewrap، تحفظ سالي ملف ______ الذي تم إنشاؤه في نظام التحكّم في الإصدارات حتى تتمكّن من إعادة إنشائه متى احتاجت إلى ذلك.

twa-manifest.json مفتاح التوقيع app-release-bundle.aab build.gradle

يريد "جاك" أن يختبر فريق ضمان الجودة تطبيق Android الخاص بتطبيق الويب التقدّمي. عليه ______ مجموعة حزمات تطبيق Android إلى مسار الاختبار الداخلي.

عمليات التحميل إنشاء عمليات التحميل الإصدارات التوقيع والتحميل

لا يعمل تطبيق Oogie Boogie على Android في وضع ملء الشاشة. لحلّ هذه المشكلة، يحصلون على الملف المرجعي لشهادة SHA-256 الخاص بـ ______ ويحمّلونه إلى ملف Digital Asset Links المتوفّر على ______ في المصدر نفسه الذي يتوفّر فيه تطبيق الويب التقدّمي.

مفتاح التحميل، ‎/.well-known/assetlinks.json مفتاح التحميل، ‎/assetlinks.json مفتاح التوقيع، ‎/.well-known/assetlinks.json مفتاح التوقيع، ‎/assetlinks.json

9- اختبار معلوماتك - الإجابات

إجابات عن أسئلة "اختبِر معلوماتك"

  1. بعد إنشاء مشروع Android باستخدام Bubblewrap، تحفظ سالي ملف ______ الذي تم إنشاؤه في نظام التحكّم في الإصدارات حتى تتمكّن من إعادة إنشائه متى احتاجت إلى ذلك.
  2. يريد "جاك" أن يختبر فريق ضمان الجودة تطبيق Android الخاص بتطبيق الويب التقدّمي. عليه ______ مجموعة حزمات تطبيق Android إلى مسار الاختبار الداخلي.
  3. لا يعمل تطبيق Oogie Boogie على Android في وضع ملء الشاشة. لحلّ هذه المشكلة، يحصلون على الملف المرجعي لشهادة SHA-256 الخاص بـ ______ ويحمّلونه إلى ملف Digital Asset Links المتوفّر على ______ في المصدر نفسه الذي يتوفّر فيه تطبيق الويب التقدّمي.

10. تهانينا!

تهانينا! لقد تعرّفت بنجاح على كيفية إضافة تطبيق الويب التقدّمي إلى "متجر Google Play".

عندما تشعر بأنّك مستعد لذلك، جرِّب الخطوات التالية بنفسك:

نتمنّى لك التوفيق في الترميز.