تكوين تطبيق الويب ونشره واختباره

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

قم بتنزيل تطبيق الويب من GitHub هنا: مثال على تطبيق الويب.

استيراد تطبيق الويب إلى Oracle Visual Builder Studio

لا يُستخدم Oracle Visual Builder Studio لتطوير تطبيقات Visual Builder فحسب، بل يسمح أيضًا بتطوير أي نوع من التطبيقات الحديثة بفضل العديد من أدوات التطوير المتكاملة الخاصة به، مثل مستودع GIT ومحرك خطوط أنابيب CI/CD وإنشاء البيانات الاصطناعية ومستودع الحاويات والأدوات المرنة وأدوات إنشاء الفريق والمزيد.

  1. سجل الدخول إلى قائمة التنقل في وحدة تحكم ويب Oracle Cloud، وانتقل إلى خدمات OCI الكلاسيكية، ثم انقر على المطور.
  2. انقر على أيقونة مثيل Oracle Visual Builder Studio ثم انقر على Access Service Instance.

    ملاحظة:

    في حالة عدم وجود مثيل موجود، قم بإنشاء مثيل جديد وانتظر حتى يتم إنشاؤه وقم بالوصول إليه. احفظ عنوان URL لمثيل Visual Builder Studio هذا، نظرًا لاستخدامه في الخطوات التالية.
  3. لتكوين مشروع جديد، انقر على + تكوين في الصفحة الافتراضية (التنظيم).
  4. أدخل اسم مشروع وانقر على التالي.
  5. لأننا سنقوم باستيراد تطبيق Visual Builder موجود كقالب مشروع، حدد خيار فارغ المشروع وانقر على التالي.
  6. في الشاشة الأخيرة من المعالج، اترك لغة ترميز wiki الافتراضية وانقر على إنهاء. سيتم إنشاء المشروع الجديد خلال حوالي 5 دقائق.
  7. فور إنشاء المشروع، ستظهر الصفحة الرئيسية للمشروع. قبل استيراد التطبيق، نحتاج إلى بيئة لتكوينه وتشغيله مؤقتًا. انقر على تكوين بيئة.
  8. أدخل اسم البيئة والوصف وانقر على تكوين.
    إذا كان هناك أي مثيل Visual Builder موجود بالفعل في مثيل قاعدة البيانات المؤجر، فأضفه إلى هذه البيئة بالنقر على إضافة مثيل. إذا لم يكن لديك أي مثيل من Visual Builder، فقم بتوفير مثيل ثم ارجع إلى هذه الخطوة لإضافة المثيل إلى البيئة.
  9. حدد مثيل Visual Builder وانقر على إضافة.
  10. بمجرد إضافة البيئة إلى المشروع، قم بإنشاء مساحة العمل حيث سنتمكن من استيراد تطبيق الويب المكون مسبقًا. حدد خيار القائمة مساحات العمل في قائمة التنقل اليسرى.
  11. يمكن إنشاء مساحة عمل عن طريق استيراد تطبيق ويب Visual Builder في المشروع. انقر استيراد.
  12. في المعالج، أدخل التفاصيل التالية:
    • الملف المضغوط لتطبيق ويب Visual Builder المكون مسبقًا.
    • اسم مساحة العمل.
    • حدد البيئة التي قمنا بتكوينها مسبقًا في المشروع لاستخدامها لاختبار التطبيق.
    • قم بتكوين مستودع Git فارغ جديد ومنحه اسمًا واسم فرع افتراضيًا.
  13. انقر استيراد.

تكوين تطبيق الويب للإشارة إلى مثيل البلوك تشين

في هذا القسم، سنقوم بتكوين تطبيق الويب المقدم للإشارة إلى مثيل Blockchain الذي تم إنشاؤه في القسم السابق.

قم بتدوين المعلومات التالية من شبكة Blockchain التي أنشأتها:
  • نقطة انتهاء الكمبيالات والتحصيلات
  • اسم الطبعة
  • القناة
  • رمز السلسلة
  1. قم بالوصول إلى مثيل Visual Builder Studio وافتح المشروع الذي قمت بتكوينه بالنقر على اسم المشروع من الصفحة الافتراضية التي تضعها (المؤسسة) عند الوصول إلى Visual Builder Studio.
  2. حدد مساحة العمل التي أنشأتها عند استيراد تطبيق الويب ثم حدد تطبيق الويب كما هو مبين في الصورة والخطوات التالية.

    1. حدد قسم تطبيق الويب.
    2. حدد تطبيق الويب.
  3. انتقل إلى علامة تبويب المتغيرات وقم بتغيير القيمة الافتراضية للمتغيرات bcEndpoint وbcInstance وchaincode وchannel بالنقر على رمز f(x) في الزاوية اليمنى العلوية من سمة القيمة الافتراضية لكل متغير.

تكوين تطبيق الويب للإشارة إلى حزمة تخزين الكائنات

في هذا القسم، سنقوم بتكوين حزمة تخزين الكائنات لاستخدامها بواسطة تطبيق الويب بناءً على قيم مفتاح API وحزمة التخزين، التي قمت بتكوينها من قبل.

  1. قم بالوصول إلى مثيل Visual Builder Studio وافتح المشروع الذي قمت بتكوينه بالنقر على اسم المشروع من الصفحة الافتراضية التي تضعها (المؤسسة) عند الوصول إلى Visual Builder Studio.
  2. حدد قسم اتصال الخدمات، ثم حدد اتصال الخدمة fileUpload.
  3. انتقل إلى علامة تبويب الخوادم وعلى الجانب الأيمن من تكوين الخادم، انقر على أيقونة القلم الرصاص لتغيير تكوين اتصال خدمة fileUpload.
    يجب تكييف تكوين اتصال الخدمة المستخدم للتفاعل مع المستودع الخاص بنا في ثلاثة أماكن.
  4. في شاشة تحرير خادم، قم بتحديث الحقول التالية:
    • عنوان URL للمثيل: يجب تغييره للإشارة إلى المستودع الخاص بك بناءً على اثنين من الخصائص من إيجار OCI والاسم الذي قدمته إلى المستودع عند تكوينه. يجب تكوين عنوان URL استنادًا إلى قالب عنوان URL التالي:
      https://objectstorage.<region-name>.oraclecloud.com/n/<storage-namespace>/b/<bucket-name>
    • التصديق: يجب التأكد من تعيين أسلوب التصديق إلى Oracle Cloud Infrastructure API Signature 1.0، ويتم تعيين المفتاح بالنقر على أيقونة القلم الرصاص على الجانب الأيمن من خاصية معرف المفتاح.

      ملاحظة:

      يتم تكوين معرف المفتاح استنادًا إلى النموذج التالي:
      <Tenancy-OCID>/<User-OCID>/<Key-Fingerprint>
      
      يمكن الوصول إلى كل هذه القيم من معاينة ملف التكوين التي تم الحصول عليها عند تكوين مفتاح API أثناء تكوين تخزين حزمة تخزين OCI. المفتاح الخاص هو المفتاح الخاص الذي استخدمناه أو أنشأناه أو تنزيله (اعتمادًا على الخيار المحدد) أثناء تكوين مفتاح API.
    • نوع الاتصال: يجب تعيينه إلى ديناميكي، تدعم الخدمة CORS.

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

اختبار تطبيق الويب

يمكنك الآن اختبار التطبيق من بيئة Visual Builder التي تم تكوينها في مشروعنا. إذا كان كل شيء على ما يرام، فيمكننا المضي قدمًا وتصدير تطبيق الويب ليتم نشره إلى تكوين مستقل.

يتفاعل تطبيق الويب هذا مع الواجهتين الخلفيتين المستخدمتين في الحل: البلوك تشين لتخزين المجلدات وبيانات تعريف المستندات، وحزم تخزين OCI لمحتوى المستند. لذلك، سنقوم باختبار بعض الوظائف لضمان إمكانية الوصول إلى كل من الواجهات الخلفية (Blockchain و Bucket) من خلال تطبيق الويب.
  1. لاختبار التطبيق، انقر على أيقونة "معاينة" في الزاوية اليمنى العلوية من مساحة عمل Visual Studio.
  2. سجل الدخول إلى التطبيق كمدير مجلد، وسيتمكن المستخدم من الوصول إلى المجلدات التي يمتلكها المالك الحالي، أو تكوين مجلد جديد سيكون الوديع الحالي له، أو القدرة على إضافة المزيد من المستندات إلى المجلد، أو نقل المجلد بأكمله إلى مستخدم أو قسم مختلف.
    لنحاول تكوين مجلد وتحميل مستند إليه.
  3. قم بتسجيل الدخول كأحد المستخدمين (cmsleg001 أو cmsfin001 أو cmsrsk001) لضمان تعيين الدور إلى مدير المجلدات، وانقر على تسجيل الدخول.
  4. في صفحة إدارة المجلدات، انقر على مجلد جديد.
  5. قم بتعيين قيم لحقول المدخلات الثلاثة (نوع المجلد والوصف ومعرف العميل) وانقر على تكوين مجلد.
  6. في وحدة تحكم Oracle Blockchain Service، انتقل إلى علامة تبويب القنوات، وحدد قناة wedocms، وتحقق من المحتوى في آخر كتلة محفوظة في دفتر الأستاذ. يجب أن تشتمل على طلب لتنفيذ العملية التي قمنا بتنفيذها للتو.
  7. لاختبار ما إذا كان بإمكاننا تحميل مستند إلى المجلد الذي تم تكوينه حديثًا، حدد المجلد وانقر على تحميل المستندات.
  8. في حالة عدم تحميل مستند في هذا المجلد، انقر على تحميل مستند جديد.
  9. حدد نوع المستند، وأدخل اسم المستند، وحدد ملفًا أو قم بإسقاط ملف PDF في منطقة السحب والإسقاط، وأضف خصائص ديناميكية، وانقر على تحميل مستند.
يمكننا المراجعة في وحدة تحكم Oracle Blockchain إذا تم تنفيذ هذه المعاملة الجديدة، وكذلك إذا تم تحميل المستند إلى حزمة تخزين OCI. قم بتسجيل الدخول كمراجع مستند، سيتمكن أي مستخدم لديه حق الوصول إلى التطبيق من مراجعة المستندات التي تم تحميلها من أي مجلد.

تصدير التطبيق المطلوب تنفيذه في جهاز مستقل

توضح الخطوات التالية كيفية تصدير التطبيق وتنزيل الحزمة القابلة للتصدير ليتم نشرها خارج Visual Builder.

يمكن تنفيذ تطبيق Visual Builder إذا استوفى بعض الشروط، خارج سياق Visual Builder. لمزيد من المعلومات، يرجى الاطلاع على المدونات التالية: تشغيل تطبيقات Visual Builder على خوادم أخرى (والمحلية) وتشغيل تطبيقات Visual Builder خارج Visual Builder.
  1. لتصدير التطبيق، اضغط على التغييرات في مخزن Git. انقر على القائمة Git Repo/Branch من الجانب الأيسر العلوي من مساحة العمل، وحدد الخيار Push.
  2. أدخل رسالة تثبيت وانقر على تثبيت الكل والدفع.
    في المرة الأولى التي يتم فيها تنفيذ هذه المهمة، قد يستغرق الأمر عدة دقائق في انتظار Build Executor، ولكن بمجرد أن يلتقط Build Executor المهمة، يجب تنفيذها خلال حوالي 3 دقائق ويجب عرض رسالة منبثقة ناجحة لإرسال Git.
  3. في هذه المرحلة يمكننا نشر التطبيق، وسيؤدي هذا الإجراء إلى تشغيل مهمة إنشاء لتحسين التطبيق المطلوب تنفيذه في أفضل الظروف. انقر على نشر في الزاوية اليمنى العلوية من صفحة مساحة العمل.
  4. في مربع الحوار نشر التغييرات، حدد دمج الآن أو دمج بعد المراجعة ثم انقر على نشر.
  5. أدخل بيانات الصلاحية وانقر على إضافة بيانات صلاحية ومتابعة.
  6. في نافذة بدء الإنشاء المنبثقة، انقر على فتح وظيفة.
  7. انقر على البيانات الاصطناعية لعرض الحزمة التي تم إنشاؤها.
  8. انقر على built-assets.zip لتنزيل الحزمة، بحيث تكون الحزمة القابلة للتصدير جاهزة للنشر خارج Visual Builder.

تنفيذ الحزمة التي تم تصديرها في خادم Apache Tomcat Server

يمكن نشر حزمة built-assets.zip ليتم تقديمها مباشرة بواسطة خادم Apache Tomcat.

  1. قم بتثبيت خادم Apache Tomcat، بمجرد تثبيته، ابدأ تشغيله وتحقق من أنه يعمل من خلال محاولة الوصول إلى عنوان URL: http://localhost:8080.
  2. يمكن تثبيت تطبيقنا في Tomcat عن طريق فك ضغط حزمة built-assets.zip، ونسخ محتويات الملف المضغوط في مجلد جديد تم إنشاؤه داخل مجلد /webapps.
  3. بمجرد نشر التطبيق داخل مجلد webapps الخاص بتثبيت Tomcat، يمكننا إعادة تشغيل Tomcat، ومحاولة الوصول إلى عنوان URL التالي: http://localhost:8080/<folder-name-inside-webapps>/webApps/docmngmt/
    الآن يمكننا اختبار التطبيق في بيئتنا المحلية.