تعرض هذه الصفحة من برنامج Google Cloud Search التعليمي كيفية إعداد تطبيق بحث Google باستخدام أداة البحث القابلة للتضمين. للبدء من بداية هذا البرنامج التعليمي، راجع الدليل التعليمي حول بدء استخدام Cloud Search
تثبيت الملحقات
إذا كان الموصل لا يزال يفهرس المستودع، فافتح واجهة مستخدم جديدة نستمر في ذلك.
من سطر الأوامر، قم بتغيير الدليل إلى
cloud-search-samples/end-to-end/search-interface
لتنزيل التبعيات المطلوبة تشغيل خادم الويب، شغِّل الأمر التالي:
npm install
إنشاء بيانات اعتماد تطبيق البحث
يتطلب الموصِّل بيانات اعتماد حساب الخدمة للاتصال بخدمة Cloud Search واجهات برمجة التطبيقات. لإنشاء بيانات الاعتماد:
ارجِع إلى وحدة تحكُّم Google Cloud.
في شريط التنقل الأيمن، انقر على بيانات الاعتماد.
من القائمة المنسدلة إنشاء بيانات اعتماد، اختَر معرِّف عميل OAuth. "إنشاء معرّف عميل OAuth" صفحة تسجيل الدخول.
(اختياري). إذا لم تكن قد ضبطت شاشة الموافقة، انقر على ضبط شاشة الموافقة "موافقة OAuth" تظهر الشاشة.
انقر على داخلي وانقر على إنشاء. "موافقة OAuth" أخرى الشاشة تظهر.
املأ الحقول المطلوبة. لمزيد من التعليمات، راجع المستخدم قسم الموافقة في إعداد OAuth 2.0.
انقر على القائمة المنسدلة نوع التطبيق واختَر تطبيق الويب.
في حقل الاسم، أدخِل "البرنامج التعليمي".
في الحقل مصادر JavaScript المعتمَدة، انقر على إضافة معرّف موارد منتظم (URI). حقل فارغ "معرّفات الموارد المنتظمة (URI)" .
في الحقل معرّفات الموارد المنتظمة (URI)، أدخِل
http://localhost:8080
.انقر على إنشاء. "تم إنشاء عميل OAuth" تظهر الشاشة.
سجِّل معرِّف العميل. يتم استخدام هذه القيمة لتحديد التطبيق عند طلب تفويض المستخدم باستخدام OAuth2. سر العميل غير مطلوب لعملية التنفيذ هذه.
انقر على موافق.
إنشاء تطبيق البحث
بعد ذلك، أنشئ تطبيق بحث في وحدة تحكّم المشرف. تطبيق البحث هو تمثيل افتراضي لواجهة البحث التكوين.
- ارجع إلى وحدة تحكُّم المشرف في Google.
- انقر على رمز التطبيقات. "إدارة التطبيقات" صفحة تسجيل الدخول.
- انقر على Google Workspace. "إدارة تطبيقات Google Workspace" صفحة تسجيل الدخول.
- انتقِل للأسفل وانقر على Cloud Search. "إعدادات Google Workspace" صفحة تظهر.
- انقر على تطبيقات البحث. "تطبيقات البحث" صفحة تسجيل الدخول.
- انقر على رمز + الأصفر المستدير. "إنشاء تطبيق بحث جديد" سيظهر مربع حوار.
- في الحقل اسم العرض، أدخِل "فيديو تعليمي".
- انقر على إنشاء.
- انقر على رمز القلم الرصاص بجانب تطبيق البحث الذي تم إنشاؤه حديثًا. ("تعديل تطبيق البحث"). "تفاصيل تطبيق البحث" صفحة تسجيل الدخول.
- سجِّل رقم تعريف التطبيق.
- على يسار مصادر البيانات، انقر على رمز القلم الرصاص.
- بجوار "البرنامج التعليمي"، انقر على مفتاح التبديل تفعيل. يتيح هذا التبديل تفعيل مصدر بيانات البرنامج التعليمي لتطبيق البحث الذي تم إنشاؤه حديثًا.
- على يسار "البرنامج التعليمي" مصدر البيانات، انقر على خيارات العرض.
- تحقق من جميع الواجهات.
- انقر على حفظ.
- انقر على تم.
إعداد تطبيق الويب
تحديث التطبيق بعد إنشاء بيانات الاعتماد وتطبيق البحث التهيئة لتضمين هذه القيم على النحو التالي:
- من سطر الأوامر، قم بتغيير الدليل إلى `cloud-search-samples/end-to-end/search-interface/public.'
- افتح ملف
app.js
باستخدام محرِّر نصوص. - ابحث عن المتغيّر
searchConfig
في أعلى الملف. - استبدِل
[client-id]
بمعرِّف عميل OAuth الذي تم إنشاؤه سابقًا. - استبدل
[application-id]
بمعرّف تطبيق البحث المشار إليه في القسم السابق. - احفظ الملف.
تشغيل التطبيق
ابدأ تشغيل التطبيق من خلال تنفيذ الأمر التالي:
npm run start
الاستعلام عن الفهرس
لطلب البحث في الفهرس باستخدام تطبيق "بحث Google" المصغّر:
- افتح المتصفّح وانتقِل إلى
http://localhost:8080
. - انقر على تسجيل الدخول للسماح للتطبيق بطلب البحث في Cloud Search. نيابةً عنك.
- في مربّع البحث، أدخِل طلب بحث، مثل كلمة "test" والضغط على Enter. يجب أن تعرض الصفحة نتائج الاستعلام إلى جانب الواجهات عناصر التحكم في التقسيم على صفحات للتنقل بين النتائج.
مراجعة التعليمة البرمجية
تفحص الأقسام المتبقية كيفية إنشاء واجهة المستخدم.
جارٍ تحميل التطبيق المصغّر
يتم تحميل التطبيق المصغّر والمكتبات ذات الصلة على مرحلتَين. أولاً، التمهيد يتم تحميل النص البرمجي:
ثانيًا، يتم استدعاء استدعاء الدالة onLoad
عندما يصبح النص البرمجي جاهزًا. بعد ذلك، يتم تحميل
عميل واجهة Google API ومكتبات أدوات Cloud Search و"تسجيل الدخول بحساب Google"
يتولى initializeApp
معالجة الإعدادات المتبقية للتطبيق.
بعد تحميل جميع المكتبات المطلوبة
التعامل مع التفويض
على المستخدمين منح التطبيق الإذن بإجراء طلب البحث نيابةً عنهم. على الرغم من أن التطبيق المصغّر يمكنك مطالبة المستخدمين بالتفويض، يمكنك تحقيق تجربة مستخدم أفضل عن طريق معالجة التفويض بنفسك.
بالنسبة إلى واجهة البحث، يقدّم التطبيق طريقتَي عرض مختلفتين استنادًا إلى في حالة تسجيل دخول المستخدم.
أثناء التهيئة، يتم تمكين العرض الصحيح ومعالجات ضبط أحداث تسجيل الدخول وتسجيل الخروج:
إنشاء واجهة البحث
تتطلب أداة البحث قدرًا صغيرًا من ترميز HTML للبحث إدخال نتائج البحث مع الاستمرار في الضغط عليها:
يتم إعداد الأداة وربطها بعناصر الإدخال والحاوية. أثناء التهيئة:
تهانينا، لقد أكملت البرنامج التعليمي بنجاح! استمر في تعليمات التنظيف.