पेश है ASP.NET MVC 4 नई सुविधाएँ

यह आलेख ASP.NET MVC 4 वेब फ्रेमवर्क की नई विशेषताओं का वर्णन करता है जो पहले डेवलपर पूर्वावलोकन संस्करण में प्रस्तुत किए गए थे।

मोबाइल वेब

आधुनिक विकास में सबसे स्थिर और बढ़ती प्रवृत्तियों में से एक मोबाइल वेब का चलन है। साइट का मोबाइल संस्करण होना अब केवल कुछ उपयोगकर्ताओं के लिए सुविधाजनक पहुंच का प्रस्ताव नहीं है, बल्कि पैसा कमाने और दर्शकों का विस्तार करने का एक साधन है।

यही कारण है कि ASP.NET MVC 4 एक डेवलपर को पहुंच प्रदान करने पर बहुत जोर देता है जो साइट का मोबाइल संस्करण बनाना चाहता है।

मोबाइल साइट - दो दृष्टिकोण

साइट का मोबाइल संस्करण बनाते समय, आप दो तरीकों का उपयोग कर सकते हैं:

• साइट का एक अलग मोबाइल संस्करण बनाएं;
• मुख्य साइट पर मोबाइल डिवाइस (अनुकूली लेआउट) को सही ढंग से प्रदर्शित करने की क्षमता जोड़ें।

दोनों दृष्टिकोणों को ASP.NET MVC 4 में समर्थन मिला।

मोबाइल वेबसाइट टेम्पलेट

ASP.NET MVC 4 ने एक मोबाइल साइट के लिए एक नया विशेष प्रोजेक्ट टेम्प्लेट जोड़ा, आप इसका उपयोग उस साइट का एक अलग संस्करण बनाने के लिए कर सकते हैं जो मोबाइल डिवाइस (चित्र 1) पर काम करेगा।


चित्र 1। नया मोबाइल साइट टेम्पलेट

एक नए टेम्पलेट के आधार पर एक परियोजना बनाने और इसे लॉन्च करने के बाद, आप ब्राउज़र में विशेषता मोबाइल दृश्य (चित्र 2) देख सकते हैं।


अंजीर। 2. मोबाइल साइट की प्रस्तुति

इसके अलावा, मानक टेम्पलेट की सभी कार्यक्षमता अभी भी उपलब्ध है: प्राधिकरण, डेमो पेज, त्रुटियों के लिए सत्यापन। नए दृश्य का इंटरफ़ेस jQuery के मोबाइल जावास्क्रिप्ट लाइब्रेरी पर आधारित है, जो अब ASP.NET MVC का हिस्सा है।

नए टेम्पलेट का उपयोग करके, आप आसानी से अपनी साइट के लिए एक अलग मोबाइल विकल्प बना सकते हैं।

अनुकूली लेआउट और नया डिफ़ॉल्ट टेम्पलेट

साइट का मोबाइल संस्करण बनाने के लिए दूसरा विकल्प अनुकूली लेआउट का उपयोग है, जो स्क्रीन रिज़ॉल्यूशन के आधार पर प्रस्तुति को बदलता है। ASP.NET MVC 4 में, मानक डिफ़ॉल्ट वेब एप्लिकेशन टेम्प्लेट को अपडेट किया गया था, जो पहले से ही अनुकूली लेआउट (चित्रा 3) का उपयोग करता है।


अंजीर। 3. नया डिफ़ॉल्ट अनुप्रयोग टेम्पलेट

अद्यतन उपस्थिति के अलावा, जो टेम्पलेट में अधिक आकर्षक हो गया, अनुकूली प्रतिपादन दृष्टिकोण का उपयोग किया गया था। एडेप्टिव रेंडरिंग का विचार इस प्रकार है: जैसे-जैसे रिज़ॉल्यूशन बदलता है, पेज की उपस्थिति मुक्त स्थान पर समायोजित हो जाती है, केवल उन तत्वों को प्रदर्शित करती है जो समझ में आते हैं (चित्र 5)।




अंजीर। 5. अनुकूली मार्कअप

इन छवियों पर ध्यान दें। रिज़ॉल्यूशन में कमी के साथ, मार्कअप नई स्क्रीन सेटिंग्स पर निर्भर करता है और उदाहरण के लिए, निरर्थक डिज़ाइन तत्वों को छुपाता है, तत्वों और मुख्य मेनू आइटम की व्यवस्था को बदलता है। कम रिज़ॉल्यूशन पर, मार्कअप इस तरह से बनता है कि महत्वपूर्ण सामग्री प्रदर्शन के लिए उपलब्ध पूरे उपयोग करने योग्य क्षेत्र पर कब्जा कर लेती है।

ASP.NET MVC 4 परियोजना में अनुकूली लेआउट नए HTML5 और CSS3 मानकों पर आधारित है, विशेष रूप से CSS3 मीडिया क्वेरी मानक, जो आपको कुछ शर्तों के लिए विभिन्न CSS नियमों को परिभाषित करने की अनुमति देता है, उदाहरण के लिए, अलग-अलग रिज़ॉल्यूशन। यहां बताया गया है कि यह कैसे काम करता है: Site.css शैली परिभाषा फ़ाइल में, आपको निम्न कोड मिल सकता है:

@media only screen and (max-width: 850px) { header .float-left, header .float-right { float: none; } … 

मीडिया निर्माण एक नियम को परिभाषित करता है जो शर्त पूरी होने पर नेस्टेड मार्कअप का उपयोग करेगा। इस स्थिति में, स्थिति डिस्प्ले का उपयोग और प्रदर्शित विंडो का आकार 850 पिक्सेल तक है। एक समान तंत्र और सेटिंग नियमों का उपयोग करके, आप अपनी साइट को प्रदर्शित करने के लिए विभिन्न स्थितियों में बहुत लचीले ढंग से प्रतिक्रिया कर सकते हैं। इसके अलावा, मेटा टैग _Layout.cshtml बिल्ड फ़ाइल में परिभाषित किया गया है:

 <meta name="viewport" content="width=device-width"> 

जो ब्राउज़र को स्क्रीन की चौड़ाई को फिट करने के लिए सामग्री को समायोजित करने के लिए कहता है।

अनुकूली लेआउट के अलावा, अपडेट किए गए एप्लिकेशन टेम्प्लेट अन्य नए मानकों का उपयोग करते हैं, जैसे कि सीएसएस स्नातक।

वेब एप्लिकेशन टेम्प्लेट में एक और बदलाव लॉगिन और पंजीकरण प्रस्तुतियाँ (चित्रा 6) के लिए विंडो रूपों के समर्थन की शुरूआत थी।


अंजीर। 6. पंजीकरण फॉर्म विंडो

यह कार्यक्षमता इसमें उल्लेखनीय है कि जब ब्राउज़र स्क्रिप्ट का समर्थन करता है, तो यह उपयोगकर्ता को पॉप-अप विंडो के रूप में फ़ॉर्म का उपयोग करने की पेशकश करता है, और स्क्रिप्ट की अनुपस्थिति में, यह स्वचालित रूप से उपयोगकर्ता को एक अलग पंजीकरण फॉर्म पेज (चित्र 7) में स्थानांतरित करता है।


अंजीर। 7. पंजीकरण फॉर्म का एक अलग पेज

यह कार्यक्षमता प्रोजेक्ट में शामिल नई AjaxLogin.js स्क्रिप्ट फ़ाइल का उपयोग करके कार्यान्वित की जाती है। प्रपत्र विंडो स्वयं jQuery UI लाइब्रेरी की कार्यक्षमता पर बनाई गई हैं, जो डिफ़ॉल्ट रूप से प्रोजेक्ट में शामिल है।

प्रदर्शन मोड

पहले हमने केवल प्रोजेक्ट टेम्प्लेट में बदलाव के बारे में बात की थी। इन नवाचारों के अलावा, ASP.NET MV 4 ने फ्रेमवर्क स्तर पर एक नई कार्यक्षमता जोड़ी है, जिसे मोबाइल उपकरणों के साथ साइट के काम को सरल बनाने के लिए डिज़ाइन किया गया है।

नया डिस्प्ले मोड फीचर एक एप्लिकेशन को ब्राउज़र के प्रकार के आधार पर विचारों का चयन करने की अनुमति देता है जो पृष्ठ का अनुरोध करता है। उदाहरण के लिए, यदि डेस्कटॉप ब्राउज़र होम पेज का अनुरोध करता है, तो वेब एप्लिकेशन सामान्य सूचकांक दृश्य वापस कर सकता है, जो कि Views \ Home \ Index.cshtml टेम्पलेट के आधार पर बनता है। ब्राउज़र से अनुरोध करने पर, साइट Views \ Home \ Index.mobile.cshtml टेम्पलेट के आधार पर एक विशेष मोबाइल प्रस्तुति वापस करने में सक्षम होगी।

यह कार्यक्षमता स्वचालित रूप से काम करती है, यह * .mobile.cshtml पोस्टफिक्स के साथ एक अतिरिक्त टेम्पलेट को परिभाषित करने के लिए पर्याप्त है और इसका उपयोग मोबाइल ग्राहकों के लिए किया जाएगा। उसी तरह, आप _Layout.cshtml के मोबाइल संस्करण को परिभाषित कर सकते हैं - _Layout.mobile.cshtml और आंशिक विचारों के मोबाइल संस्करणों को: _MyPartial.cshtml - _MyPartial.obile.cshtml।

नई कार्यक्षमता का आकर्षण और शक्ति विशिष्ट मोबाइल उपकरणों, मोबाइल ओएस, किसी भी अन्य स्थितियों के लिए विस्तार और ठीक-ट्यूनिंग की संभावना में निहित है। आप उस नाम को निर्दिष्ट करने के लिए DefaultDisplayMode के अपने उदाहरण को पंजीकृत कर सकते हैं जिसका उपयोग दृश्य के नाम और उस स्थिति के लिए किया जाएगा जिसके तहत यह दृश्य चुना जाएगा।

उदाहरण के लिए, आप Global.asax फ़ाइल में Application_Start में निम्न कोड जोड़ सकते हैं:

 DisplayModes.Modes.Insert(0, new DefaultDisplayMode("iPhone") { ContextCondition = (context => context.Request.UserAgent.IndexOf ("iPhone", StringComparison.OrdinalIgnoreCase) >= 0) }); 

यह कोड एक नए प्रकार के "iPhone" दृश्य को परिभाषित करता है और ऐसी स्थिति का संकेत देता है जब इस तरह के दृश्य का उपयोग किया जाना चाहिए: जब उपयोगकर्ता क्लाइंट एजेंट लाइन में "iPhone" लाइन होती है, जो उपयोगकर्ता के iPhone के मोबाइल फोन के उपयोग को इंगित करता है। जब यह स्थिति पूरी हो जाती है, तो Views \ Shared \ _Layout.iPhone.cshtml दृश्य का उपयोग किया जाएगा।

आप यह निर्धारित करने के लिए अधिक जटिल स्थिति का निर्माण कर सकते हैं कि किसी विशेष क्वेरी के लिए किस दृश्य का उपयोग किया जाना चाहिए। अब विभिन्न उपकरणों और मोबाइल ऑपरेटिंग सिस्टम के लिए अपनी साइट को अनुकूलित करना बहुत आसान हो गया है।

प्रदर्शन मोड स्विच करें

मोबाइल साइट की एक उपयोगी विशेषता मानक डेस्कटॉप दृश्य पर स्विच करने की क्षमता है, ऐसे मामलों में जहां उपयोगकर्ता के पास मोबाइल साइट की कार्यक्षमता का अभाव है। कभी-कभी एक अलग स्थिति उत्पन्न हो सकती है जब उपयोगकर्ता मानक एक के बजाय मोबाइल संस्करण में काम करना पसंद करता है।

ऐसा फ़ंक्शन प्रदान करने के लिए, ASP.NET MVC 4 ने अनुरोध के वर्तमान संदर्भ के बारे में जानकारी प्राप्त करने के लिए एक नया तंत्र पेश किया: चाहे वह मानक हो या ओवरराइड। HttpContext संपत्ति में अब कई नए तरीके शामिल हैं:

• HttpContext.SetOverriddenBrowser(userAgentString)- एक नए मूल्य के साथ वर्तमान ब्राउज़र एजेंट स्ट्रिंग को ओवरराइड करता है;
• HttpContext.GetOverriddenUserAgent()- यदि कोई ओवरराइड नहीं थे, तो ब्राउज़र एजेंट स्ट्रिंग का प्रारंभिक या वास्तविक मूल्य लौटाता है;
• HttpContext.GetOverriddenBrowser() – HttpBrowserCapabilitiesBase का एक उदाहरण देता है जो ब्राउज़र एजेंट स्ट्रिंग के वर्तमान मूल्य (वास्तविक या अतिप्राप्त) से मेल खाता है;
• HttpContext.ClearOverriddenBrowser() - आपको सभी ओवरराइड्स को खाली करने की अनुमति देता है।

ओवरराइड तंत्र क्लाइंट साइड को चयनित दृश्य के प्रकार को संग्रहीत करने के लिए कुकीज़ का उपयोग करता है। फ्रेमवर्क के लगभग सभी अन्य भागों की तरह, आप स्टोरेज प्रोवाइडर को उसकी कार्यक्षमता के माध्यम से प्रेजेंटेशन प्रकार से बदल सकते हैं। ऐसा करने के लिए, आपको बस प्रदाता को ओवरराइड करना होगा और अपने उदाहरण के साथ BrowserOverrideStores.Current के मान को बदलना होगा ।

व्यंजनों

रेसिपी - विज़ुअल स्टूडियो के कार्यों और आम कार्यों के लिए अपनी परियोजनाओं के विस्तार के लिए यह एक नया अवसर है: कोड जेनरेशन, फॉर्म बनाना, मचान बनाना।

आइए देखें कि सरल उदाहरण के साथ व्यंजनों कैसे काम करते हैं। ASP.NET MVC 4 पर आधारित एक प्रोजेक्ट बनाएं और MvcHaack.ViewMoblizer पैकेज को स्थापित करने के लिए NuGet पैकेज मैनेजर का उपयोग करें। इस पैकेज में आपकी साइट के सभी या चयनित दृश्यों के लिए स्वचालित रूप से मोबाइल दृश्य बनाने के लिए एक नुस्खा है।

पैकेज को स्थापित करने के बाद, दृश्य फ़ोल्डर के संदर्भ मेनू में, Add - Run Recipie (चित्र 8) का चयन करें।


अंजीर। 8. नुस्खा चल रहा है

आपको प्रोजेक्ट में स्थापित व्यंजनों का चयन करने के लिए एक विंडो दिखाई देगी (चित्र 9)।


अंजीर। 9. नुस्खा चयन खिड़की

Mobilizer नुस्खा देखें और ठीक पर क्लिक करें। एक आंतरिक नुस्खा तंत्र लॉन्च किया जाएगा, जो पहले से ही अपना स्वयं का रूप प्रदर्शित करेगा जिससे आप अपने मोबाइल संस्करण (चित्र 10) बनाने के लिए विचारों का चयन कर सकते हैं।


अंजीर। 10. नुस्खा द्वारा बनाई गई खिड़की

इच्छित दृश्य चुनें और Mobilize पर क्लिक करें! यदि आप अपने स्वयं के डिस्प्ले मोड (उदाहरण के लिए, iPhone) के लिए दृश्य बनाते हैं, तो आप आवश्यक पोस्टफ़िक्स सेट कर सकते हैं। नुस्खा स्वचालित रूप से आवश्यक फाइलें बनाएगा और उन्हें परियोजना में जोड़ देगा (चित्र 11)।


अंजीर। 11. पकाने की विधि फ़ाइलें

कैसे काम करती है रेसिपी

रेसिपी एक क्लास लाइब्रेरी है जिसमें रेसिपी के पैरामीटर सेट करने के लिए विशेष रूप से बनाई गई रेसिपी क्लास और आवश्यक डायलॉग बॉक्स होते हैं।

व्यंजनों विभिन्न प्रकार के हो सकते हैं, लेकिन उन सभी को एक इंटरफेस को लागू करना होगा: IRecipe, IFolderRecipe, IFileRecipe, जिन्हें नए Microsoft में परिभाषित किया गया है। VisualStudio.Web.Mvc.Extensibility .ecipes नामस्थान।

रेसिपी क्लास को MEF फ्रेमवर्क का निर्यात प्रकार होना चाहिए, अर्थात, इसे [Export (टाइपोफ़ (IRecipe))) विशेषता के साथ चिह्नित किया जाना चाहिए। फिल हैक द्वारा बनाई गई एक व्यू मोबिलाइज़र रेसिपी क्लास है:

 [Export(typeof(IRecipe))] public class ViewMobilizerRecipe : IFolderRecipe { public bool Execute(ProjectFolder folder) { var model = new ViewMobilizerModel(folder); var form = new ViewMobilizerForm(model); var result = form.ShowDialog(); if (result == DialogResult.OK) { foreach (var view in model.SelectedViews) { var file = view.Item1; string mobileFileName = view.Item2; File.Copy(file.FullName, mobileFileName); folder.DteProjectItems.AddFromFile(mobileFileName); } } return true; } public bool IsValidTarget(ProjectFolder folder) { return true; } public string Description { get { return "A package for creating display mode views."; } } public Icon Icon { get { return Resources.ViewMobilizer; } } public string Name { get { return "View Mobilizer"; } } } 

व्यंजनों एक शक्तिशाली नया उपकरण है जो NuGet पैकेज मैनेजर का उपयोग करके परियोजनाओं में एकीकृत होता है और आपको कोड पीढ़ी के लिए प्रथाओं को संचित करने और नियमित रूप से नियमित कार्य करने की अनुमति देता है। समय के साथ, समुदाय और NuGet व्यंजनों के लिए धन्यवाद कई होंगे।

एसिंक्रोनस नियंत्रकों के लिए Async समर्थन

अतुल्यकालिक नियंत्रकों को बनाने की क्षमता लंबे समय तक ASP.NET MVC में दिखाई दी। फ्रेमवर्क के नए संस्करण में, इस सुविधा का उपयोग C # के नए संस्करण के शक्तिशाली अतुल्यकालिक नवाचारों के आधार पर किया जा सकता है।

अब आप अतुल्यकालिक नियंत्रक में अपनी विधि इस प्रकार लिख सकते हैं:

 public async Task<ActionResult> Index(string city) { var newsService = new NewsService(); var sportsService = new SportsService(); return View("Common", new PortalViewModel { NewsHeadlines = await newsService.GetHeadlinesAsync(), SportsScores = await sportsService.GetScoresAsync() }); } 

नए async और प्रतीक्षित भाषा निर्माणों के उपयोग पर ध्यान दें। वे इस कोड को newsService.GetHeadlinesAsync और sportsService.GetScoresAsync तरीकों को निष्पादित करने की अनुमति देते हैं।

अतुल्यकालिक एक्सटेंशन के लिए प्रत्यक्ष समर्थन के अलावा, फ्रेमवर्क अतुल्यकालिक एक्सटेंशन के लिए टाइमआउट और अतुल्यकालिक ऑपरेशन को रद्द करने की क्षमता के लिए समर्थन जोड़ता है। नियंत्रक में एक अतुल्यकालिक कार्रवाई का समय-निर्धारण निर्धारित करने के लिए, आपको इसे नए AsyncTimeout विशेषता के साथ चिह्नित करना होगा:

[AsyncTimeout (2500)]

टाइमआउट समाप्त होने के बाद एक विशेष दृश्य प्रदर्शित करने के लिए, हैंडलेयर विशेषता का उपयोग करें:

[हैंडलेयर (अपवाद टाइप = टाइपऑफ़ (टास्ककैन्लेडसेप्शन), देखें = "टाइममेडऑन")]

समय समाप्त होने के बाद, क्लाइंट को टाइमऑट दृश्य दिखाया जाएगा।

 [AsyncTimeout(2500)] [HandleError(ExceptionType = typeof(TaskCanceledException), View = "TimedOut")] public async Task<ActionResult> Index(string city, CancellationToken cancellationToken) { var newsService = new NewsService(); var sportsService = new SportsService(); return View("Common", new PortalViewModel { NewsHeadlines = await newsService.GetHeadlinesAsync(cancellationToken), SportsScores = await sportsService.GetScoresAsync(cancellationToken) }); } 

इसके अलावा, आप एसिंक्रोनस ऑपरेशन (ऊपर उदाहरण) को रद्द करने की क्षमता को जोड़ने के लिए, रद्द करने के प्रकार के एक विशेष पैरामीटर को परिभाषित कर सकते हैं।

निष्कर्ष

पहले डेवलपर पूर्वावलोकन संस्करण में प्रस्तुत ASP.NET MVC 4 के नवाचारों में वेब विकास का सामना करने वाले आधुनिक अनुरोधों का जवाब देने और मोबाइल वेबसाइट अभ्यावेदन बनाने और कई मोबाइल उपकरणों के साथ काम को सरल बनाने के लिए डेवलपर्स की इच्छा प्रदर्शित की गई है।

दूसरी ओर, व्यंजनों MEF और NuGet के परिचित तंत्रों के आधार पर परियोजनाओं की कार्यक्षमता और विजुअल स्टूडियो के एक नए विस्तार की अनुमति देते हैं।

अंत में, अतुल्यकालिक नियंत्रकों और कार्यों को बनाने के लिए C # 5 अतुल्यकालिक नवाचारों के लिए समर्थन जटिल और स्केलेबल वेब अनुप्रयोगों के निर्माण को बहुत सरल करेगा।

हमने फ्रेमवर्क के केवल पहले प्रारंभिक संस्करण के नवाचारों की जांच की। आप उम्मीद कर सकते हैं कि भविष्य के संस्करणों में ASP.NET MVC 4 डेवलपर्स को और भी अधिक सुविधाएँ और कार्य मिलेंगे।