أريد مشاركة اكتشاف مثير للاهتمام -
Bridge.net . باختصار ، هذا إطار يسمح لك بترجمة رمز C # في JavaScript. إن الفكرة التي تدفع فريق التطوير بسيطة ومباشرة - قم بترجمة المنطق بطريقة مماثلة قدر الإمكان. ما يحلو لك ، إذا كنت تتذكر كل الاختلافات وخصائص هذه اللغات.
ربما يمكن للجميع العثور على استخدامهم الشخصي ، لكنني أود الإشارة إلى تلك اللحظات التي جذبتني شخصيًا:
- إمكانية التطبيق لتطوير المحمول. جافا سكريبت يعمل على جميع المنصات
- الإعداد للويب. خاصة إذا كنت بحاجة إلى إعادة كتابة مشروع قديم ، على سبيل المثال ، كتطبيق SPA
- القدرة على إعادة استخدام رمز C # في وقت واحد على جانب الخادم والعميل
- تمت الترجمة أثناء بناء المشروع
- المشروع قيد التطوير النشط ، وهناك دعم كاف من المطورين
- Bridge.net هو مشروع مفتوح المصدر برخصة للاستخدام التجاري ( رخصة Apache 2.0 )
كدليل على استخدام Bridge ، أريد مشاركة حل لمهمة التحقق من صحة الحقل في تطبيق ويب. آمل أن يكون المثال توضيحيًا ، لأن مشكلة مماثلة يمكن أن تحدث كثيرًا. من أجل البساطة سأستخدم نماذج ويب ASP.NET.
لذلك ، لدينا مجال حيث يجب على المستخدم إدخال رقم تسجيل السيارة والنقر على الزر. في حالتنا ، سيتحقق الزر من صحة المدخلات (في الواقع ، يمكننا العودة ، على سبيل المثال ، الغرامات المسجلة).
إدخال خادم التحقق من صحة المنطقprotected void submitButton_OnClick(object sender, EventArgs e) { var isCorrect = IsCorrectPlateNumber(plateTextBox.Text); plateTextBox.BackColor = isCorrect ? Color.LightGreen : Color.Coral; } private static bool IsCorrectPlateNumber(string plateNumber) { var success = false; if (!string.IsNullOrWhiteSpace(plateNumber)) { plateNumber = plateNumber.Trim(); if (plateNumber.Length >= 8 || plateNumber.Length <= 9) { var rgx = new Regex(@"^[]\d{3}[]{2}\d{2,3}$"); success = rgx.IsMatch(plateNumber); } } return success; }
حسنًا ، نريد الآن تقليل الحمل على الخادم وإجراء التحقق من الحقل من جانب العميل. هناك العديد من الخيارات:
1) إعادة كتابة التحقق من صحة العميل ، والتي سوف تحقق أبسط السيناريوهات ، إذا جاز التعبير ، "الحماية ضد أحمق". لا يزال يتم إجراء الاختبارات الأساسية على جانب الخادم.
التحقق من صحة العميل بسيطة . ( X 000 XX 000):<br/> <asp:TextBox ID="plateTextBox" runat="server"/> <asp:Button ID="submitButton" runat="server" Text="" OnClientClick="return validatePlate();" OnClick="submitButton_OnClick"/>
function validatePlate() { var value = document.getElementById('<%=plateTextBox.ClientID%>').value; if (value && value.length) { return true; } alert(" . !"); return false; }
2) ترقية خادم التحقق من الصحة قدر الإمكان ، وبالتالي تكرار الكود. المزايا واضحة - الحد الأدنى للتناقض بين نتائج التحقق من الصحة على الخادم والعميل. هناك أيضًا عيوب - تكرار منطق الخادم ، وأود أيضًا الحفاظ عليه في حالة نشطة ، مما قد يؤدي إلى إضافة صداع. لن أعيد كتابة الكود يدويًا ، إنه مفهوم تمامًا. دعونا نرى كيف يمكن أن يساعدنا جسر. للقيام بذلك ، استخدم
المحرر عبر الإنترنت . سيبدو الرمز المترجم كما يلي:
التحقق من صحة العميل الكامل (function (globals) { "use strict"; Bridge.define('Demo.ServerLogic', { statics: { isCorrectPlateNumber: function (plateNumber) { var success = false; if (!Bridge.String.isNullOrWhiteSpace(plateNumber)) { plateNumber = plateNumber.trim(); if (plateNumber.length >= 8 || plateNumber.length <= 9) { var rgx = new Bridge.Text.RegularExpressions.Regex("constructor", "^[]\\d{3}[]{2}\\d{2,3}$"); success = rgx.isMatch(plateNumber); } } return success; } } }); Bridge.init(); })(this);
يبقى لنا
تضمين ملف Bridge.js (من أجل البساطة ، أخذت ملف البرنامج النصي من المحرر عبر الإنترنت) ، بالإضافة إلى
تعديل وظيفة التحقق المبدئية الخاصة بنا
قليلاً :
function validatePlate() { var value = document.getElementById('<%=plateTextBox.ClientID%>').value; if (Demo.ServerLogic.isCorrectPlateNumber(value)) { return true; } alert(" . !"); return false; }
3) إعادة استخدام المنطق. إذا كنا نريد الحفاظ على تحديثه ، فيمكننا تهيئة ترجمة التحقق من الصحة من C # إلى JavaScript ليتم تنفيذها في كل مرة يتم فيها إنشاء المشروع. وبالتالي ، فإن المنطق يصبح حقًا قابلاً لإعادة الاستخدام ، ولا يضيع المبرمجون وقتهم ، ويصبح التطبيق أكثر استقرارًا ، وحتى المستخدمين أكثر سعادة! للقيام بذلك ، تحتاج إلى تنفيذ عدة خطوات:
تضمين الجسر في المشروع1. إنشاء مشروع
WebApplication1.Bridge في حل موجود
2. تثبيت
حزمة Nuget فيه. تثبيت هذه الحزمة في مشروع منفصل ، كما أثناء التثبيت ، يتم حذف المراجع المتعارضة.
3. في مشروع
WebApplication1 ،
سنضع المنطق في ملف / فئة منفصلة. وفقًا لذلك ، سيتم الآن استخدام هذه الفئة في معالج أحداث النقر على الزر (التغييرات واضحة ، لا أوفر الرمز).
ServerLogic.cs using System.Text.RegularExpressions; namespace WebApplication1 { public class ServerLogic { public static bool IsCorrectPlateNumber(string plateNumber) { var success = false; if (!string.IsNullOrWhiteSpace(plateNumber)) { plateNumber = plateNumber.Trim(); if (plateNumber.Length >= 8 || plateNumber.Length <= 9) { var rgx = new Regex(@"^[]\d{3}[]{2}\d{2,3}$"); success = rgx.IsMatch(plateNumber); } } return success; } } }
4. أضف الملف الذي تم إنشاؤه إلى مشروع
WebApplication1.Bridge كارتباط5. قم بتغيير دليل الإخراج لمشروع
WebApplication1.Bridge . للقيام بذلك ، قم بتكوين ملف
bridge.json :
"output": "../WebApplication1/Scripts/Bridge"
6. بعد التجميع في Solution Explorer ، انقر فوق "إظهار كافة الملفات" ويمكننا رؤية البرنامج النصي الذي تم إنشاؤه على
الويب .Apps1.js7. أضف الروابط الضرورية وقم بتحديث البرامج النصية في صفحة
Demo.aspx :
البرامج النصية Demo.aspx <script src="Scripts/Bridge/bridge.js" type="text/javascript"></script> <script src="Scripts/Bridge/webApplication1.js" type="text/javascript"></script> <script type="text/javascript"> function validatePlate() { var value = document.getElementById('<%=plateTextBox.ClientID%>').value; if (WebApplication1.ServerLogic.isCorrectPlateNumber(value)) { return true; } alert(" . !"); return false; } </script>
8. هذا كل شيء. يمكنك بناء مشروع وتشغيله. الآن ، ستعمل أي تغييرات على منطق التحقق من الصحة تلقائيًا على كل من جانب الخادم والشيكات من جانب العميل.
لذلك ، مع مثال بسيط ، رأينا كيف يمكنك بسهولة إعادة استخدام رمز C # ، حتى عندما تحتاج إلى القيام بذلك باستخدام JavaScript. وما الذي يمكن أن يكون ذا قيمة كبيرة - كيف يتم تضمين هذا النهج في عملية تطوير وبناء تطبيق ويب. ومع ذلك ، هذه ليست الميزة الوحيدة لـ Bridge.net. أراه كمساعد لا جدال فيه في تطوير الأجهزة المحمولة عبر الأنظمة الأساسية ، وخاصةً لأولئك الذين لا يستطيعون تخيل حياتهم دون استخدام .NET ، ولكن المزيد عن ذلك في المرة القادمة!