شراء استلام الطلب على الإنترنت من المتجر: وجبة Bonjour - الجزء 1 - البدء

1. مقدمة

تاريخ آخر تعديل: 2022-05-11

مرحبًا بك في الرسائل التجارية!

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

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

ما الذي يجعل الوكيل الرقمي جيدًا؟

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

ما ستنشئه

في هذا الدرس التطبيقي حول الترميز، ستنشئ وكيلًا رقميًا على "الرسائل التجارية" لشركة وهمية تُدعى Bonjour Meal. سيجيب هذا المساعد الرقمي عن بعض الأسئلة البسيطة، مثل "ما هو وقت الإغلاق؟" أو "هل يمكنني الشراء على الإنترنت؟".

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

في هذا الدرس التطبيقي حول الترميز، سيتضمّن تطبيقك ما يلي:

الردّ على الأسئلة من خلال شريحة اقتراح
توجيه المستخدم لطرح أسئلة يمكن أن يجيب عنها الوكيل الرقمي
توفير ميزات محادثة غنية للحفاظ على تفاعل المستخدم في المحادثة

ما ستتعلمه

كيفية نشر تطبيق ويب على App Engine في Google Cloud Platform يمكنك بدلاً من ذلك استخدام ngrok لاختبار تطبيقك المحلي بشكل علني.
كيفية ضبط حسابك على "الرسائل التجارية" باستخدام ويب هوك لتطبيق ويب من أجل تلقّي الرسائل من المستخدمين
كيفية إرسال ميزات تفاعلية مثل البطاقات ومنصّات العرض الدوّارة والاقتراحات الحوارية باستخدام Business Messages API
كيفية إرسال الرسائل في "الرسائل التجارية"

يركّز هذا الدرس العملي على إنشاء أول وكيل رقمي لك.

المتطلبات

التسجيل للحصول على حساب مطوِّر مجاني على Business Communications
يمكنك الانتقال إلى الموقع الإلكتروني للمطوّرين للاطّلاع على تعليمات حول كيفية
جهاز Android يعمل بالإصدار 5 أو الإصدارات الأحدث أو جهاز iOS مثبَّت عليه تطبيق "خرائط Google"
خبرة في برمجة تطبيقات الويب
اتصال بالإنترنت

2. الإعداد

تفعيل واجهات برمجة التطبيقات

في هذا الدرس التطبيقي حول الترميز، بما أنّنا سنعمل على تطبيق Django، سنعتمد على Cloud Build API لتفعيل التطبيق على App Engine. بدلاً من ذلك، إذا كنت تستخدم ngrok، لن تحتاج إلى تفعيل Cloud Build API.

لتفعيل Cloud Build API، اتّبِع الخطوات التالية:

افتح Cloud Build API في Google Cloud Console.
انقر على تفعيل.

إنشاء حساب خدمة

يجب إنشاء حساب خدمة للوصول إلى واجهات برمجة التطبيقات Business Communications وMessages التجارية. اتّبِع الخطوات الواردة في المستندات لإنشاء حساب خدمة ضمن Business Communications Developer Console.

نشر رمز EchoBot الأولي في Django Python

في نافذة طرفية، استنسِخ نموذج برنامج Django Echo Bot إلى دليل العمل الخاص بمشروعك باستخدام الأمر التالي:

$ git clone https://github.com/google-business-communications/bm-bonjour-meal-django-starter-code

انسخ ملف بيانات اعتماد JSON الذي تم إنشاؤه لحساب الخدمة إلى مجلد الموارد الخاص بالعينة وأعِد تسمية بيانات الاعتماد إلى "bm-agent-service-account-credentials.json".

bm-bonjour-meal-django-starter-code/bonjourmeal-codelab/step-1/resources/bm-agent-service-account-credentials.json

في نافذة الوحدة الطرفية، انتقِل إلى دليل الخطوة 1 الخاص بالنموذج.

نفِّذ الأوامر التالية في الوحدة الطرفية لنشر النموذج:

$ gcloud config set project PROJECT_ID*
$ gcloud app create
$ gcloud app deploy

‫PROJECT_ID هو رقم تعريف المشروع الذي استخدمته للتسجيل في واجهات برمجة التطبيقات.

دوِّن عنوان URL للتطبيق الذي تم نشره في ناتج الأمر الأخير:

Deployed service [default] to [https://PROJECT_ID.appspot.com]

يحتوي الرمز الأوّلي الذي تم نشره للتو على تطبيق ويب مع ويب هوك لتلقّي الرسائل من "الرسائل التجارية". يعيد التطبيق عرض الرسائل للمستخدم ويمكنه عرض بعض الميزات التفاعلية المتوفّرة في واجهة المحادثة.

إعداد الويب هوك

بعد نشر خدمتك، ستستخدم عنوان URL للتطبيق لضبط رابط ويب هوك في صفحة إعدادات الحساب في Business Communications Play Console.

سيكون رابط ويب هوك هو عنوان URL للتطبيق + "/callback/". على سبيل المثال، قد يكون على النحو التالي: https://PROJECT_ID.appspot.com/callback/

انتقِل إلى صفحة إعدادات الحساب في "وحدة تحكّم اتصالات النشاط التجاري". في أعلى يسار الشاشة تحت شريط التنقّل، يجب أن يظهر اسم مشروعك على Google Cloud Platform. إذا ظهرت لك قائمة منسدلة، احرص على اختيار مشروع Google Cloud Platform.

املأ تفاصيل جهة الاتصال الفنية، ثم عدِّل ويب هوك باستخدام رابط ويب هوك لتطبيقك الذي تم تفعيله.

انقر على حفظ بجانب مرجع مشروعك على Google Cloud Platform.

3- إنشاء أول وكيل

استخدام Business Communications Developer Console

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

في العلامة التجارية، اكتب اسم العلامة التجارية التي تريد إنشاءها.العلامة التجارية هي المؤسسة التي تتعاون معها ويمكن للمستهلكين التفاعل مع الوكيل بشكل حواري. في اسم الوكيل، حدِّد ما تريد أن يراه المستخدمون في محادثة "الرسائل التجارية". في حالة وجبة Bonjour الوهمية، تكون شركة Bonjour Rail هي شركة السكك الحديدية التي تدير مطاعم Bonjour Meal. لذا، سأحدّد Bonjour Rail كعلامة تجارية وBonjour Meal كوكيل.

الوكيل هو الكيان الحواري الذي يمثّل العلامة التجارية.

انقر على إنشاء وكيل ودَع وحدة التحكّم تقوم ببعض السحر. يستغرق هذا الطلب بضع ثوانٍ لإرسال عدة طلبات إلى Business Communications API من أجل إنشاء العلامة التجارية والوكيل. يمكنك استخدام Business Communications API مباشرةً لإنشاء وكيل وعلامة تجارية. راجِع المستندات لمعرفة كيف سيبدو طلب curl لتنفيذ الإجراءات نفسها التي تنفّذها وحدة التحكّم.

إجراء محادثتك الأولى

افتح الوكيل الذي أنشأته للتو، وستظهر لك صفحة نظرة عامة تتيح لك البدء في مراجعة تفاصيل الوكيل. اطّلِع على عناوين URL التجريبية للوكيل. تُستخدَم هذه العناوين لتفعيل واجهة المحادثة على جهازك.

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

بعد النقر على الرابط على جهازك الجوّال، سيتم تشغيل "مشغّل موظّف الدعم على ميزة الرسائل التجارية" مع ملء عنوان URL التجريبي لموظّف الدعم مسبقًا.

انقر على تشغيل لاستدعاء مساحة المحادثة الخاصة بالوكيل.

تفاعَل مع الوكيل وتعرَّف على إمكاناته. في معظم الحالات، ستجد أنّ مساحة العرض الحوارية ستكرّر رسائلك فقط. أرسِل إليه رسالة مثل "Hello, World!" وسترى أنّ البرنامج سيرسل إليك الرسالة نفسها.

يحتوي التطبيق الذي تم نشره أيضًا على بعض المنطق لعرض الميزات المنسّقة المتوفّرة في "الرسائل التجارية".

إذا أرسلت "بطاقة"، سيتم استدعاء بطاقة تفاعلية
إذا أرسلت "شرائح"، سيتم استدعاء شرائح الاقتراحات
إذا أرسلت "مجموعة بطاقات"، سيتم عرض مجموعة من البطاقات التفاعلية

تهانينا! هذه هي المحادثة الأولى التي يجريها الوكيل معك.

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

تعديل رسالة الترحيب واستخدام شرائح المحادثة

لنمارس بعض التدريبات على Play Console، ولنرى كيفية تعديل رسالة الترحيب الخاصة بالوكيل والاستفادة من شرائح الاقتراحات لمساعدة المستخدم في التواصل.

انتقِل إلى صفحة نظرة عامة الخاصة بالوكيل واختَر معلومات الوكيل. انتقِل للأسفل إلى قسم "رسالة الترحيب وبادئات المحادثة".

عدِّل رسالة الترحيب (حقل الإدخال الأصفر) لتصبح:

مرحبًا بك في وكيل إجراء التفعيل Bonjour Meal. يمكنني تكرار رسائلك وعرض بعض الميزات التفاعلية المتاحة على المنصة. جرِّب هذه الاقتراحات.

انقر على + إضافة بداية محادثة كما هو موضّح في المربّع الأرجواني في الصورة أعلاه لإضافة بدايات محادثة لاستدعاء شرائح الاقتراحات والدائري والبطاقة. يجب أن تتضمّن بداية المحادثة التي تضيفها مكوّنًا نصيًا ومكوّن postbackData. النص هو ما يتم عرضه للمستخدم، بينما بيانات postBack هي ما يتم إرساله إلى رابط استدعاء وكيلك. يحلّل Webhook بيانات الإحالة الناجحة ويرسل الردّ المناسب إلى المستخدم.

تبدو معلومات الوكيل في وحدة التحكّم على النحو التالي بعد التعديل:

على يسار وحدة التحكّم، تظهر معاينة لشكل الوكيل. هل لاحظت أنّ رسالة الترحيب تعكس التغيير الذي أجريته للتوّ على اسم المجموعة وشرائح الاقتراحات التي تظهر تحتها؟

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

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

في هذه الأثناء، لنلقِ نظرة على طريقة عمل كل شيء.

4. تحليل الرمز الأوّلي

نظرة عامة على رمز المصدر

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

التعليمات البرمجية الأولية هي مشروع Django. في جزء لاحق من سلسلة الدروس التطبيقية حول الترميز هذه، سنستخدم Google Datastore لتخزين البيانات بشكل دائم، مثل سلّات التسوّق والمحادثات المرتبطة بها. لا تقلق إذا لم يسبق لك استخدام Django، فهو سهل الاستخدام، وبحلول نهاية هذا الدرس العملي، ستكون قد تعلّمت طريقة عمله.

على مستوى عالٍ، سيوجّه Django عناوين URL إلى طرق العرض، وستنتج منطق طريقة العرض نموذجًا يتم عرضه في المتصفّح. لنلقِ نظرة على ملف urls.py الخاص بالمشروع.

bm-django-echo-bot/bmcodelab/urls.py [الأسطر 31-37]

from django.urls import include, path
import bopis.views as bopis_views

urlpatterns = [
    path('', bopis_views.landing_placeholder),
    path('callback/', bopis_views.callback),
]

يتم تحديد مسارين هنا، وبالتالي يمكن لـ Django تنفيذ منطق إذا تم التعرّف على عنوانَي URL هذين. إذا كان عنوان URL للمشروع هو https://PROJECT_ID.appspot.com/، ستكون المسارات التي يعرفها المشروع هي:

https://PROJECT_ID.appspot.com/
https://PROJECT_ID.appspot.com/callback/

يشير كلا مسارَي عنوان URL إلى bopis_views الذي يأتي من bopis/views.py. لنلقِ نظرة على ما يحدث في هذا الملف. للبدء، لنفهم أولاً bopis_views.landing_placeholder.

bm-django-echo-bot/bonjourmeal-codelab/step-1/bopis/views.py [الأسطر 302-309]

... 
def landing_placeholder(request):
    return HttpResponse("<h1>Welcome to the Bonjour Meal Codelab</h1>
    <br/><br/>
    To message your Bonjour Meal agent, go to the Developer Console and retrieve
    the Test URLs for the agent you have created as described in the codelab
    <a href='https://codelabs.developers.google.com/codelabs/'>here</a>.")
...

يتم تنفيذ جزء المنطق هذا بواسطة خادم الويب عندما يتلقّى طلب ويب يشير إلى جذر المشروع. لا يحدث أي شيء معقّد هنا: نعرض ببساطة HTTPResponse يحتوي على بعض HTML مرة أخرى إلى المتصفح الذي أرسل الطلب. نعم، يمكنك فتح عنوان URL الأساسي للمشروع، ولكن ليس هناك الكثير لتفعله هناك لأنّه سيعيدك إلى هذا الدرس العملي.

يوصّل عنوان URL الآخر إلى دالة تُسمى callback، وهي أيضًا في bopis/views.py. لذلك، دعونا نلقي نظرة على هذه الدالة.

bm-django-echo-bot/bopis/views.py [الأسطر من 60 إلى 101]

...
def callback(request):
    """
    Callback URL. Processes messages sent from user.
    """
    if request.method == "POST":
        request_data = request.body.decode('utf8').replace("'", '"')
        request_body = json.loads(request_data)

        print('request_body: %s', request_body)

        # Extract the conversation id and message text
        conversation_id = request_body.get('conversationId')
        print('conversation_id: %s', conversation_id)

        # Check that the message and text body exist

        if 'message' in request_body and 'text' in request_body['message']:
            message = request_body['message']['text']

            print('message: %s', message)
            route_message(message, conversation_id)
        elif 'suggestionResponse' in request_body:
            message = request_body['suggestionResponse']['postbackData']

            print('message: %s', message)
            route_message(message, conversation_id)
        elif 'userStatus' in request_body:
            if 'isTyping' in request_body['userStatus']:
                print('User is typing')
            elif 'requestedLiveAgent' in request_body['userStatus']:
                print('User requested transfer to live agent')

        return HttpResponse("Response.")

    elif request.method == "GET":
        return HttpResponse("This webhook expects a POST request.")
...

تعمل المنطق هنا على تحليل نص الطلب بحثًا عن رسالة أو suggestionResponse وتمرير هذه المعلومات إلى دالة تُسمى route_message، ثم إرجاع HttpResponse إلى بنية الرسائل التجارية الأساسية لتأكيد استلام الرسالة.

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

ترسل ميزة "الرسائل التجارية" محتوى الرسالة كحمولة JSON إلى ويب هوك حيث يتم توجيهها إلى موظّف دعم متصل بالإنترنت أو إلى بعض المنطق للردّ كروبوت. آلية التوجيه هذه، في حالتنا هنا، هي route_message. لنلق نظرة.

bm-django-echo-bot/bopis/views.py [الأسطر 105-122]

...
def route_message(message, conversation_id):
    '''
    Routes the message received from the user to create a response.

    Args:
        message (str): The message text received from the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    normalized_message = message.lower()

    if normalized_message == CMD_RICH_CARD:
        send_rich_card(conversation_id)
    elif normalized_message == CMD_CAROUSEL_CARD:
        send_carousel(conversation_id)
    elif normalized_message == CMD_SUGGESTIONS:
        send_message_with_suggestions(conversation_id)
    else:
        echo_message(message, conversation_id)
...

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

bm-django-echo-bot/bopis/views.py [الأسطر من 40 إلى 42]

...
# Set of commands the bot understands
CMD_RICH_CARD = 'card'
CMD_CAROUSEL_CARD = 'carousel'
CMD_SUGGESTIONS = 'chips'
...

بعبارة أخرى، يبحث برنامج التتبُّع عن الرسائل التي تتضمّن تحديدًا أيًا من السلاسل التي وضعناها في postback_data لبدء المحادثة من الخطوة السابقة في هذا الدرس البرمجي. إذا لم تظهر أي من هذه السلاسل، سيتم ببساطة تمرير الرسالة إلى دالة تُسمى echo_message، والتي يمكنك تخيّل أنّها... ستكرّر الرسائل.

إرسال الرسائل

لذلك، يجب أن تكون لديك الآن فكرة عن كيفية تلقّي تطبيق الويب للرسائل. ويتم كل ذلك من خلال خطاف الويب.

ولكن كيف يرسل التطبيق رسالة صادرة إلى مستخدم باستخدام ميزة "الرسائل التجارية"؟

عندما تستجيب البنية الأساسية لطلب المستخدم، يمكنك إرسال الردّ إلى Business Messages API، الذي يرسل الرسالة إلى المستخدم.

تتضمّن Business Messages API مكتبات في Python وNode.js وJava. لدينا أيضًا واجهة REST API يمكنك إرسال طلبات إليها مباشرةً إذا كانت البنية الأساسية لنظامك بلغة لا تتوفّر لها مكتبة. يمكنك الاطّلاع على إرسال الرسائل لمعرفة كيفية استخدام cURL لإرسال رسالة إلى معرّف محادثة معيّن.

لأغراض هذا الدرس التطبيقي حول الترميز، سنركّز على استخدام مكتبة برامج Python المدمجة حاليًا في رمز Bonjour Meal الأوّلي الذي تم تفعيله على App Engine في مشروعك على Google Cloud Platform، أو تشغيله محليًا من خلال ngrok.

لنلقِ نظرة على الدالة echo_message ونرى كيف نتفاعل مع واجهة برمجة التطبيقات لإرسال الرسالة إلى "الرسائل التجارية".

bm-django-echo-bot/bopis/views.py [الأسطر 199-212]

...
def echo_message(message, conversation_id):
    '''
    Sends the message received from the user back to the user.

    Args:
        message (str): The message text received from the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        text=message)

    send_message(message_obj, conversation_id)
...

في هذه الدالة، يتم إنشاء مثيل BusinessMessagesMessage باستخدام متغيّر الرسالة الذي تم تمريره إلى الدالة echo_message. بعد إنشاء مثيل للكائن، يتم تمريره إلى send_message مع رقم تعريف المحادثة.

bm-django-echo-bot/bopis/views.py [الأسطر 214-236]

...
def send_message(message, conversation_id):
    '''
    Posts a message to the Business Messages API, first sending
    a typing indicator event and sending a stop typing event after
    the message has been sent.

    Args:
        message (obj): The message object payload to send to the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    credentials = ServiceAccountCredentials.from_json_keyfile_name(
        SERVICE_ACCOUNT_LOCATION,
        scopes=['https://www.googleapis.com/auth/businessmessages'])

    client = bm_client.BusinessmessagesV1(credentials=credentials)

    # Create the message request
    create_request = BusinessmessagesConversationsMessagesCreateRequest(
        businessMessagesMessage=message,
        parent='conversations/' + conversation_id)

    bm_client.BusinessmessagesV1.ConversationsMessagesService(
        client=client).Create(request=create_request)
...

كل ما تفعله الدالة send_message هو استخدام بيانات اعتماد حساب الخدمة للتحقّق من إمكانية إرسال رسائل إلى هذه المحادثة، وإنشاء مثيل لعميل الرسائل التجارية، وإنشاء طلب لإرسال الرسالة إلى conversation ID المحدّد.

تستفيد الميزات التفاعلية أيضًا من وظيفة send_message هذه، ولكن الرسائل التي تنشئها تكون خاصة بالبطاقات التفاعلية ولوحات العرض الدوّارة وشرائح الاقتراحات. قد تتضمّن البطاقات التفاعلية ولوحات العرض الدوّارة مواد عرض رسومية، بينما تحتوي شرائح الاقتراحات على postback_data حتى تتمكّن منطق معاودة الاتصال من تحليلها بشكلٍ مناسب.

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

عندما تكون مستعدًا، لنخصّص وكيل Bonjour Meal.

5- تخصيص الوكيل

إذا كنت قد تابعت هذا الدرس العملي حتى الآن، من المفترض أن يظهر لك وكيلك الجميل.

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

في بقية هذا الدرس العملي، سنضيف إلى الوكيل ما يلي:

تضمين شعار فعلي
رسالة ترحيب محسّنة
تقديم معلومات حول ساعات العمل
إعلام المستخدم بأنّ شراء السلع على الإنترنت سيكون متاحًا قريبًا
استخدام شرائح اقتراحات حوارية لتسهيل المحادثة

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

تضمين شعار

من وحدة تحكّم Business Communications، اختَر الوكيل وانتقِل إلى معلومات الوكيل. سنحتاج إلى تعديل شعار المؤسسة، كما هو موضّح باللون الأصفر أدناه.

انقر على تحميل، وستتمكّن من اختيار صورة لتحميلها أو استيرادها من عنوان URL.

يمكنك الاطّلاع على إرشادات تصميم الشعارات في المستندات للتعرّف على أفضل الممارسات التي ننصح بها لاستخدام شعاراتك الخاصة.

لنحمّل الشعار الذي يقع في الرمز المصدر الذي استنسخته في بداية هذا الدرس التطبيقي حول الترميز. يمكنك العثور عليه في الدليل ‎ ./assets/ ‎ الخاص بالمستودع، واسم الملف هو ‎bonjour_meal-logo.png‎. يمكنك سحب الملف إلى النافذة المنبثقة في متصفّح الويب، وستظهر أداة تعديل بسيطة للتحكّم في جودة الصورة واقتصاصها. عدِّل دقة الصورة واقتصاصها بحيث يكون حجمها أقل من أو يساوي 50 كيلوبايت. عندما تكون راضيًا عن الصورة، انقر على علامة الاختيار في الدائرة الزرقاء للتأكيد، ثم انقر على اختيار في أسفل النافذة المنبثقة.

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

تعديل رسالة الترحيب

لقد سبق لنا تعديل رسالة الترحيب في وقت سابق من هذا الدرس العملي. لنكرّر ذلك مرة أخرى، ولكن هذه المرة سنضبط رسالة ترحيب أكثر ملاءمة لرحلة مستخدم Bonjour Meal.

في Business Communications Console، اختَر وكيلك وانتقِل إلى معلومات الوكيل. انتقِل للأسفل إلى أن يظهر لك حقل إدخال رسالة الترحيب حيث يمكنك تعديل الرسالة.

بما أنّنا سنضيف عبارات بدء المحادثة، يمكننا الإشارة إليها في رسالة الترحيب. في حقل الإدخال، لنستبدله بالنص التالي:

"مرحبًا بك في Bonjour Meal. أنا مساعد يمكنه الإجابة عن أسئلتك حول Bonjour Meal. يمكنك تجربة بعض الخيارات التالية."

أخيرًا، انقر على حفظ في أعلى يسار صفحة معلومات الوكيل. مرة أخرى، سيستغرق ظهور هذا التغيير بعض الوقت بسبب آلية التخزين المؤقت التي نستخدمها للتأكّد من أنّ الأمور تسير بسرعة.

تقديم معلومات عن ساعات العمل

لتوفير هذه المعلومات للمستخدمين، سنرسل رسالة مخصّصة إلى المستخدم باستخدام Business Messages API.

قد تتذكر أنّه يتم تحليل الرسائل في الدالة route_message من views.py. تعمل الدالة أولاً على تسوية السلسلة ثم تبدأ في التحقّق مما إذا كانت الرسالة التي تمت تسويتها تتطابق مع أي من المَعلمات المرمّزة ثابتة. لتبسيط الأمر، لنضِف شرطًا إضافيًا نتحقّق فيه مما إذا كانت الرسالة العادية تساوي ثابتًا جديدًا سنسمّيه CMD_BUSINESS_HOURS_INQUIRY وسيتضمّن القيمة "business-hours-inquiry". إذا كانت قيمة الشرط صحيحة، سنستدعي دالة باسم send_message_with_business_hours.

ستبدو الدالة route_message الآن على النحو التالي:

bm-django-echo-bot/bopis/views.py

...
def route_message(message, conversation_id):
    '''
    Routes the message received from the user to create a response.

    Args:
        message (str): The message text received from the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    normalized_message = message.lower()

    if normalized_message == CMD_RICH_CARD:
        send_rich_card(conversation_id)
    elif normalized_message == CMD_CAROUSEL_CARD:
        send_carousel(conversation_id)
    elif normalized_message == CMD_SUGGESTIONS:
        send_message_with_suggestions(conversation_id)
    elif normalized_message == CMD_BUSINESS_HOURS_INQUIRY:
        send_message_with_business_hours(conversation_id)
    else:
        echo_message(message, conversation_id)
...

لكي يعمل الرمز، علينا إجراء تغييرَين إضافيَين: الأول هو تحديد CMD_BUSINESS_HOURS_INQUIRY مع الثوابت الأخرى، والثاني هو تحديد الدالة send_message_with_business_hours وإرسال رسالة باستخدام Business Messages API.

لنبدأ بتحديد الثابت في أعلى الملف مع تعريفات الثوابت الأخرى:

bm-django-echo-bot/bopis/views.py

...
# Set of commands the bot understands
CMD_RICH_CARD = 'card'
CMD_CAROUSEL_CARD = 'carousel'
CMD_SUGGESTIONS = 'chips'
CMD_BUSINESS_HOURS_INQUIRY = 'business-hours-inquiry'
...

والآن، لنحدّد send_message_with_business_hours. يمكنك تحديد هذه الدالة في أي مكان في الملف، باتّباع صيغة Python المناسبة. بما أنّ هذه الدالة ترسل رسالة فقط، مثل echo_message، يمكنك استخدامها كنموذج لتحديد هذه الدالة.

bm-django-echo-bot/bopis/views.py

...
def send_message_with_business_hours(conversation_id):

    message = '''Thanks for contacting us! The hours for the store are:\n
    MON 8am - 8pm\n
    TUE 8am - 8pm\n
    WED 8am - 8pm\n
    THU 8am - 8pm\n
    FRI 8am - 8pm\n
    SAT 8am - 8pm\n
    SUN 8am - 8pm
    '''

    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        text=message)

    send_message(message_obj, conversation_id)
...

وبذلك، من المفترض أن يتمكّن البوت من الردّ على المستخدم بهذه الساعات عندما يرسل الرسالة التالية: "business-hours-inquiry". يمكنك توقُّع ظهور شيء مثل ما يلي:

بعد نشر الرمز المصدري على Google Cloud Platform، ستظهر التغييرات على الفور. لا نخزّن تطبيق الويب مؤقتًا في Google Cloud Platform بالطريقة نفسها التي يتم بها تخزين معلومات الوكيل مؤقتًا، لذا ستتمكّن من اختبار هذه التجربة على الفور.

بما أنّنا حقّقنا بعض التقدّم في إجراء تغييرات على المصدر، لنُجرِ تعديلاً آخر يتيح للمستخدم الاستفسار عن التسوّق على الإنترنت. سيردّ عليك الوكيل الرقمي بأنّ الميزة غير متاحة بعد، ولكن يمكنك العودة والتحقّق لاحقًا.

إعلام المستخدم بأنّ ميزة التسوّق على الإنترنت ستتوفّر قريبًا

سنجري تعديلاً مشابهًا للتعديل الذي أجريناه لإعلام المستخدم بساعات العمل. في هذه المرة، سنضع المعلومات في بطاقة تفاعلية مع صورة جذابة.

حلِّل الرسالة العادية وتحقّق من شرط ثابت يُسمى CMD_ONLINE_SHOPPING_INQUIRY بقيمة مضبوطة على "online-shopping-inquiry"، ما يؤدي إلى استدعاء send_online_shopping_info_message إذا كان الشرط صحيحًا.

bm-django-echo-bot/bopis/views.py

...
# Set of commands the bot understands
CMD_RICH_CARD = 'card'
CMD_CAROUSEL_CARD = 'carousel'
CMD_SUGGESTIONS = 'chips'
CMD_BUSINESS_HOURS_INQUIRY = 'business-hours-inquiry'
CMD_ONLINE_SHOPPING_INQUIRY = 'online-shopping-inquiry'
...
...
...
def route_message(message, conversation_id):
    '''
    Routes the message received from the user to create a response.

    Args:
        message (str): The message text received from the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    normalized_message = message.lower()

    if normalized_message == CMD_RICH_CARD:
        send_rich_card(conversation_id)
    elif normalized_message == CMD_CAROUSEL_CARD:
        send_carousel(conversation_id)
    elif normalized_message == CMD_SUGGESTIONS:
        send_message_with_suggestions(conversation_id)
    elif normalized_message == CMD_BUSINESS_HOURS_INQUIRY:
        send_message_with_business_hours(conversation_id)
    elif normalized_message == CMD_ONLINE_SHOPPING_INQUIRY:
        send_online_shopping_info_message(conversation_id)
    else:
        echo_message(message, conversation_id)
...

الآن، لنحدّد send_online_shopping_info_message. نريد إرسال هذه الرسالة في بطاقة تفاعلية تحتوي على صورة، لذا لننسخ الدالة send_rich_card لاستخدامها كقالب لتحديد send_online_shopping_info_message.

أولاً، يجب تعديل النص الاحتياطي ليتضمّن رسالة مناسبة. يتم استخدام النص الاحتياطي إذا تعذّر على الجهاز تلقّي بطاقة تفاعلية لسبب ما. بعد ذلك، يجب تعديل BusinessMessagesRichCard لتضمين عنوان ووصف واقتراحات وحقل وسائط ذي صلة. يجب أن تبدو الدالة على النحو التالي:

bm-django-echo-bot/bopis/views.py

...
def send_online_shopping_info_message(conversation_id):
    fallback_text = ('Online shopping will be available soon!')

    rich_card = BusinessMessagesRichCard(
        standaloneCard=BusinessMessagesStandaloneCard(
            cardContent=BusinessMessagesCardContent(
                title='Online shopping info!',
                description='Thanks for your business, we are located in SF near the Golden Gate Bridge. Online shopping is not yet available, please check back with us in a few days.',
                suggestions=[],
                media=BusinessMessagesMedia(
                    height=BusinessMessagesMedia.HeightValueValuesEnum.MEDIUM,
                    contentInfo=BusinessMessagesContentInfo(
                        fileUrl=SAMPLE_IMAGES[4],
                        forceRefresh=False
                    ))
                )))

    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        richCard=rich_card,
        fallback=fallback_text)

    send_message(message_obj, conversation_id)
...

رائع! يمكن لوكيلنا الرقمي الآن الردّ على المستخدمين الذين يستفسرون عن التسوّق على الإنترنت. في الوقت الحالي، لا يتيح وكيلنا الرقمي التسوّق على الإنترنت بعد، لذا نعرض للمستخدم رسالة لإبلاغه بأنّ هذه الميزة ستتوفّر قريبًا. هذا هو شكل الوكيل الرقمي عندما يستفسر المستخدم عن التسوّق على الإنترنت.

تمامًا مثل التغيير السابق الذي أجريناه للسماح للمستخدم بالاستفسار عن ساعات العمل، يمكن ملاحظة هذا التغيير على الفور إذا كنت تستخدم ngrok، أو فور نشر الرمز في GCP App Engine.

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

استخدام الشرائح لتوجيه المحادثة

لقد أجرينا بعض التغييرات على رمز المصدر ونشرنا الوكيل الرقمي المعدَّل، ولكننا لا نتوقّع أبدًا أن يكتب المستخدمون "استفسار عن ساعات العمل" أو "معلومات عن التسوّق على الإنترنت" للاستفسار عن النشاط التجاري. لنعدّل الآن عبارات بدء المحادثة بحيث عندما يتم فتح المحادثة، لا يتم الترحيب بالمستخدم برسالة ترحيب لطيفة فحسب، بل يتم أيضًا عرض عبارات بدء المحادثة.

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

سننشئ عبارتَين جديدتَين لبدء المحادثة. بالنسبة إلى السؤال الأول، اضبط النص على "ما هي ساعات عمل نشاطك التجاري؟" واضبط بيانات Postback على "business-hours-inquiry". بالنسبة إلى بداية المحادثة الثانية، اضبط النص على "هل يمكنني إجراء عمليات شراء هنا؟" واضبط بيانات تسجيل الإحالة الناجحة على "online-shopping-info".

يجب أن تكون النتيجة هي الإعدادات كما في لقطة الشاشة التالية:

كما هو الحال مع التغييرات الأخرى التي يتم إجراؤها على Business Communications Console، سيستغرق هذا التغيير بعض الوقت قبل أن تتمكّن من رؤية التغييرات التي تم إجراؤها على جهازك الجوّال.

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

في نهاية الدالة، أضِف ما يلي:

bm-django-echo-bot/bopis/views.py

...
def send_online_shopping_info_message(conversation_id):
...
    # at the end of the function, send a message with suggestions
    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        text='Let us know how else we can help you:',
        fallback='Please let us know how else we can help you.',
        suggestions=[
            BusinessMessagesSuggestion(
                reply=BusinessMessagesSuggestedReply(
                text='Business hours',
                postbackData='business-hours-inquiry')
            ),
        ])

    send_message(message_obj, conversation_id)
...

# Let's do the same with the business hours
def send_message_with_business_hours(conversation_id):
...
    # at the end of the function, send a message with suggestions
    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        text='Let us know how else we can help you:',
        fallback='Please let us know how else we can help you.',
        suggestions=[
            BusinessMessagesSuggestion(
                reply=BusinessMessagesSuggestedReply(
                text='Can I purchase online?',
                postbackData='online-shopping-inquiry')
            ),
        ])

    send_message(message_obj, conversation_id)
...

يُرجى العِلم أنّ حقل النص ضمن BusinessMessagesSuggestion يقتصر على 25 حرفًا، كما هو موضّح في المستندات.

في ما يلي بعض لقطات الشاشة لتجربة المستخدم المتوقّعة، مع مواضيع جديدة لبدء المحادثة واستخدام استراتيجي لشرائح الاقتراحات.

6. تهانينا

تهانينا، لقد نجحت في إنشاء أول وكيل رقمي في "الرسائل التجارية".

لقد نشرت تطبيق ويب لدعم وكيلك الرقمي على "الرسائل التجارية"، واستخدمت Business Communications Console لتعديل الوكيل، وصمّمت تجربة المستخدم مع وكيل رقمي من خلال إجراء تغييرات على رمز المصدر.

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

إليك لمحة عمّا يمكن أن يبدو عليه ذلك.

كيف يمكنني إنشاء تجربة حوارية رائعة؟

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

توفير سياق وتحديد التوقّعات

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

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

توفير وظائف للمستخدم

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

الحفاظ على تفاعل المستخدم

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

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

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

ما هي الخطوات التالية؟

عندما تكون مستعدًا، اطّلِع على بعض المواضيع التالية للتعرّف على المزيد من التفاعلات المعقّدة التي يمكنك تحقيقها في "الرسائل التجارية".

المستندات المرجعية

SuggestedReply
مستند مرجعي حول رسائل "الرسائل التجارية"
تعريف JSON الخاص بـ RichCard

شراء استلام الطلب على الإنترنت من المتجر: وجبة Bonjour - الجزء 1 - البدء تنظيم صفحاتك في مجموعات يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.

1. مقدمة

مرحبًا بك في الرسائل التجارية!

ما الذي يجعل الوكيل الرقمي جيدًا؟

ما ستنشئه

ما ستتعلمه

المتطلبات

2. الإعداد

تفعيل واجهات برمجة التطبيقات

إنشاء حساب خدمة

نشر رمز EchoBot الأولي في Django Python

إعداد الويب هوك

3- إنشاء أول وكيل

استخدام Business Communications Developer Console

إجراء محادثتك الأولى

تعديل رسالة الترحيب واستخدام شرائح المحادثة

4. تحليل الرمز الأوّلي

نظرة عامة على رمز المصدر

bm-django-echo-bot/bmcodelab/urls.py [الأسطر 31-37]

bm-django-echo-bot/bonjourmeal-codelab/step-1/bopis/views.py [الأسطر 302-309]

bm-django-echo-bot/bopis/views.py [الأسطر من 60 إلى 101]

bm-django-echo-bot/bopis/views.py [الأسطر 105-122]

bm-django-echo-bot/bopis/views.py [الأسطر من 40 إلى 42]

إرسال الرسائل

bm-django-echo-bot/bopis/views.py [الأسطر 199-212]

bm-django-echo-bot/bopis/views.py [الأسطر 214-236]

5- تخصيص الوكيل

تضمين شعار

تعديل رسالة الترحيب

تقديم معلومات عن ساعات العمل

bm-django-echo-bot/bopis/views.py

bm-django-echo-bot/bopis/views.py

bm-django-echo-bot/bopis/views.py

إعلام المستخدم بأنّ ميزة التسوّق على الإنترنت ستتوفّر قريبًا

bm-django-echo-bot/bopis/views.py

bm-django-echo-bot/bopis/views.py

استخدام الشرائح لتوجيه المحادثة

bm-django-echo-bot/bopis/views.py

6. تهانينا

كيف يمكنني إنشاء تجربة حوارية رائعة؟

توفير سياق وتحديد التوقّعات

توفير وظائف للمستخدم

الحفاظ على تفاعل المستخدم

ما هي الخطوات التالية؟

المستندات المرجعية

شراء استلام الطلب على الإنترنت من المتجر: وجبة Bonjour - الجزء 1 - البدء