كيف تم إنشاء الواجهة الخلفية للعبة الهاكر حول تدمير الخادم



نستمر في إخبارك كيف تم ترتيب بحثنا عن الليزر مع تدمير الخادم. نبدأ في المقال السابق حول حل المهمة .



في المجموع ، كانت الواجهة الخلفية للعبة تحتوي على 6 وحدات معمارية ، والتي سنقوم بتحليلها في هذه المقالة:



  1. الواجهة الخلفية لكيانات اللعبة المسؤولة عن آليات اللعبة
  2. الواجهة الخلفية وموقع تبادل البيانات على VPS
  3. مترجم من طلبات الخلفية (عناصر اللعبة) إلى اردوينو والأجهزة الموجودة على الموقع
  4. تلقى Arduino ، الذي كان مسؤولاً عن التحكم في الترحيل ، أوامر من المترجم وقام بالعمل الفعلي
  5. الأجهزة الفعلية: مروحة ، أكاليل ، مصابيح أرضية ، إلخ.
  6. الواجهة الأمامية - موقع Falcon نفسه ، حيث يتحكم اللاعبون في الأجهزة


دعنا نذهب من خلال كل منهم.



الواجهة الخلفية لكيانات اللعبة



تم تنفيذ الواجهة الخلفية كتطبيق التشغيل الربيعي: كان يحتوي على العديد من وحدات التحكم المتبقية ، ونقطة نهاية Websocket ، والخدمات مع منطق اللعبة.



كان هناك ثلاث وحدات تحكم فقط:



  • ميجاترون. تم إرسال الصفحة الحالية لـ Megatron من خلال طلبات GET: قبل وبعد التشغيل. أطلق الليزر من خلال طلب POST.
  • , . , ID .
  • , - .


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



يمكن للاعبين اختباره عن طريق تشغيل الطوق والقيام بنفس الشيء باستخدام الليزر.



لقد اخترنا مثل هذا الزوج التافه من كلمة مرور تسجيل الدخول حتى لا نعذب اللاعبين باختيار غير ضروري.



لجعل المهمة أكثر إثارة للاهتمام ، تم استخدام معرفات الكائنات من mongodb كمعرفات للأجهزة في الغرفة.



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



مترجم من طلبات الخلفية



نص بايثون يتعامل مع المؤقتات ويترجم من تجريدات اللعبة إلى نموذج مادي. على سبيل المثال ، "قم بتشغيل المصباح الأرضي" → "قم بتشغيل التتابع N2".



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



كان المترجم مسؤولاً أيضًا عن منطق بدء آلة التقطيع بواسطة جهاز ضبط الوقت ونقل الصورة إلى التلفزيون: مؤقت بدء التقطيع ، وصراخ كابيبارا ، والإعلان في نهاية اللعبة.



كيف تم ترتيب منطق إنشاء رمز ميغاترون المميز



لقطة اختبار



كل 25 ثانية ، يتم إنشاء رمز جديد ، يمكن استخدامه لتشغيل الليزر لمدة 10 ثوانٍ بقوة 10/255. رابط إلى جيثب برمز ميجاترون .



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



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



تم استخدام خوارزمية تجزئة MD5 لإنشاء الرمز المميز. وكان المخطط MD5 من MD5 + عداد + سر للرمز القتالي وبدون سر للاختبار.



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



طلقة قتالية



وضع ميجاترون القتالي هو 100٪ قوة ليزر 3 واط. هذا يكفي تمامًا لمدة دقيقتين لحرق الحبل الذي كان يحمل الوزن لكسر الحوض وملء الخادم بالماء.



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



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



ثم كان على اللاعبين التقاط قيمة العداد (عن طريق تحليل رمز الاختبار) وإنشاء رمز قتالي باستخدام قيمة العداد التالية والملح المحدد في الخطوة الأخيرة.



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



خدمة للتفاعل مع الكابتشا



في عالم اللعبة ، كان هذا هو نفس رمز التحقق الذي يجب تحميله من أجل تشغيل المروحة وفتح لوحة قلابة مع تلميح. كان هناك كمبيوتر محمول مع مراقبة الحمل بجانب الكاميرا. حسبت







الخدمة ما سيتم عرضه في المراقبة على أنه الحمل الحالي: درجة الحرارة ومروحة وحدة المعالجة المركزية. تم تمرير المقاييس إلى قاعدة البيانات الزمنية وعرضها في grafana.



إذا تم تلقي أكثر من 50 طلبًا لعرض captcha في آخر 5 ثوانٍ ، فإن الحمل ينمو عن طريق الإصلاح + عدد عشوائي من الخطوات. كان الحساب أنه يمكن الحصول على حمولة بنسبة 100٪ في دقيقتين.



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



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



استضافة ونقل البيانات



أداة لنقل المعلومات من الواجهة الخلفية إلى الموقع ، خادم VPS الذي تم إطلاق RabbitMQ عليه.



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



لحماية الخادم من DDoSa ، استخدمنا Cloudflare.



تجدر الإشارة إلى أن VPS صمد أمام كل شيء بألوان متطايرة.



تلقى Arduino ، الذي كان مسؤولاً عن التحكم في الترحيل ، أوامر من المترجم وقام بالعمل الفعلي



هذا موضوع للمقال التالي حول جزء الأجهزة في المشروع: أرسلت الواجهة الخلفية ببساطة طلبات لتمكين مرحل معين. لقد حدث أن الواجهة الخلفية تعرف جميع الكيانات تقريبًا وبدت الطلبات منها مثل "تمكين هذا الكيان". لقد فعلنا هذا للاختبار المبكر للموقع (لم نجمع بعد كل Arduino والمرحلات) ، وفي النهاية تركنا الأمر على هذا النحو.



نهاية المقدمة



أنشأنا الموقع بسرعة على التلدة ، واستغرق الأمر يوم عمل واحدًا ووفّر لنا 30 ألفًا من الميزانية.



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



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



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



نتيجة لذلك ، قمنا بإرفاق js-logic بالواجهة الأمامية لإرسال الطلبات إلى الأجهزة الأولية ، وقمنا بتغيير أنماط الأزرار لتشغيل وإيقاف تشغيل عناصر اللعبة.



تصميم الموقع



سجل البحث ، والذي يستحق فصلاً منفصلاً.



أردنا إنشاء ليس فقط موقعًا قديمًا ، ولكن موقعًا مقنعًا للغاية ينتهك جميع قواعد التصميم الأساسية. في الوقت نفسه ، كان من المهم الحفاظ على المصداقية: كان عليه عدم كسر قصص الأنف والأذن والحنجرة ، وإظهار طغيان المؤلف ، ويجب على اللاعبين الاعتقاد بأن مثل هذا الموقع يمكن أن يكون موجودًا وحتى يجلب العملاء. وأحضر! أثناء تشغيل اللعبة ، طُلب منا مرتين إنشاء مواقع ويب.



في البداية ، قمت بالتصميم بنفسي ، محاولًا التمسك بالمزيد من صور GIF والعناصر اللامعة. لكن زوجي ، وهو مصمم لديه 10 سنوات من الخبرة ، نظر من وراء كتفه ووصفه بأنه "جيد للغاية". لكسر قواعد التصميم ، عليك أن تعرفهم.







هناك العديد من تركيبات الألوان التي تسبب شعورًا مستمرًا بالاشمئزاز: الأخضر والأحمر للعصارة المتساوية ، والرمادي والوردي والأزرق والبني. نتيجة لذلك ، استقرنا على مزيج من الأحمر والأخضر كألوان أساسية ، وأضفنا صورًا متحركة مع قطة واخترنا 3-4 صور لسوكولوف نفسه في مخزون الصور. لم يكن لدي سوى عدد قليل من المتطلبات: رجل في منتصف العمر ، يرتدي بدلة غير ملائمة بمقاسين أكبر وفي وضعية "جلسة تصوير احترافية في الاستوديو". بالنسبة للاختبار ، عرضوه على الأصدقاء وسألوا ، "ما رأيك في ذلك؟"



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



الأجهزة الفعلية



تم تركيب المراوح والأضواء من خلال مرحلات الحالة الصلبة بحيث لا يتم تشغيلها بكامل طاقتها على الفور - بحيث تحدث زيادة الطاقة بالتوازي مع المراقبة.



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



ترقب!



مقالات أخرى عن المسعى مع تدمير الخادم








All Articles