افزودن کنترلر به پروژه ASP.NET Core MVC

در این بخش از سری آموزش های ASP.NET Core MVC به نحوه افزودن کنترلر به پروژه ASP.NET Core MVC خواهیم پرداخت.

سایر پست های آموزش ASP.NET Core MVC :

• آموزش ASP.NET Core MVC و ویژوال استودیو

الگوی  MVC ، برنامه را به سه جزء اصلی تقسیم می‌کند: مدل، نما و کنترلر . الگوی MVC به شما کمک می‌کند تا برنامه‌هایی را ایجاد کنید که قابلیت آزمون بیشتری داشته و به‌روز رسانی آن‌ها نسبت به برنامه‌های سنتی آسان‌تر باشد. برنامه‌های MVC محور شامل این موارد می‌شوند:

• مدل‌ها ( Model ): کلاس هایی که مربوط به قسمت داده های برنامه می شوند . کلاس های مدل از اعتبار سنجی برای اعمال قوانین به داده ها استفاده می کنند . به طور معمول، اجزای مدل، حالت مدل را در یک پایگاه داده بازیابی و ذخیره می‌کنند. در این آموزش ASP.NET Core ، یک مدل  برای کار با ویدئو ها ایجاد کرده ایم  ، داده‌های فیلم را از یک پایگاه داده بازیابی می‌کند و آن را برای نما فراهم کرده یا آن را به‌روز رسانی می‌کند. داده به‌روز رسانی شده  در پایگاه داده ذخیره می شوند .

• نماها: نماها اجزایی هستند که رابط‌کاربری برنامه (UI) را نشان می‌دهند. به طور کلی، این رابط‌کاربری داده های مدل را نشان می‌دهد.

• کنترلرها: کلاس هایی هستند که در خواست‌های مرورگر را مدیریت می‌کنند. آن‌ها داده مدل را بازیابی کرده و از ویو ها برای نمایش اطلاعات استفاده می کنند . در یک پروژه  MVC ، نما ها (View ) تنها اطلاعات را نشان می‌دهد؛ کنترلر ورودی کاربر را مدیریت کرده و جهت تعامل واکنش نشان می‌دهد. برای مثال، کنترلر داده ها را از سیستم مسیریابی  و مقادیر رشته ها مدیریت کرده و مقادیر را به مدل انتقال می‌دهند. مدل ممکن است برای پرس و جو ها از پایگاه داده، از این مقادیر استفاده کند. برای مثال،مسیر http://localhost:1234/Home/About شامل اطلاعات Home (نام کنترلر) و About (متدی برای فراخوانی اکشن About) دارد. http://localhost:1234/Movies/Edit/5 درخواستی برای ویرایش یک فیلم است که برای انجام این کار از شناسه ۵   استفاده می کند . در قسمت های بعد بیشتر درباره سیستم مسیر یابی و نحوه ارسال اطلاعات در آن صحبت خواهیم کرد. 

الگوی MVC به شما کمک می‌کند برنامه‌ای ایجاد کنید که قسمت های مختلف پروژه را تفکیک می‌کند (منطق ورود داده ها ، منطق فرآیند ها  و منطق رابط‌کاربری) . این الگو هر جایی را که هر قسمت پروژه باید در آن قرار بگیرد را مشخص می‌کند. قسمت رابط‌کاربری به نما تعلق دارد. منطق ورودی به کنترلر تعلق دارد و منطق فرآیند ها  به مدل تعلق دارد. این تفکیک به شما کمک می‌کند تا در زمان ایجاد برنامه، پیچیدگی آن را مدیریت کنید. زیرا به شما این امکان را می‌دهد که در یک زمان روی یک بعد پروژه کار کنید، بدون این که روی کد بعد دیگری تاثیر بگذارید. برای مثال شما می‌توانید مستقل از کد منطق فرآیند ها ، روی کد نما کار کنید.

در این سری آموزش های ASP.NET Core  این مفاهیم را پوشش داده و نحوه استفاده از آن‌ها را برای ساخت یک پروژه مدیریت ویدئو ها  به شما نشان خواهیم داد. پروژه MVC شامل پوشه‌هایی برای کنترل‌گرها و نماهاست.

• در Solution Explorer، روی Controllers کلیک راست کرده، سپس Add و بعد New Item را انتخاب کنید.

• Controller Class را انتخاب کنید.

• در بخش Add New Item مقدار HelloWorldController را وارد کنید.

محتوای کنترلر HelloWorldController.cs را با کدهای زیر جایگزین کنید.

 

using Microsoft.AspNetCore.Mvc;
using System.Text.Encodings.Web;

namespace MvcMovie.Controllers
{
    public class HelloWorldController : Controller
    {
        // 
        // GET: /HelloWorld/

        public string Index()
        {
            return "This is my default action...";
        }

        // 
        // GET: /HelloWorld/Welcome/ 

        public string Welcome()
        {
            return "This is the Welcome action method...";
        }
    }
}

 

تمام متد های public در کنترلرها را می توان به عنوان یک نقطه پایانی HTTP از طریق مرورگر فراخوانی کرد . در کد بالا  هر دو متد یک رشته را برمی گردانند . به توضیحاتی که پیش از هر متد آمده توجه کنید.

یکی از نقاط قابل دسترس از طریق مرور گر آدرس http://localhost:1234/HelloWorld است که از پروتکل HTTP استفاده می کند ، آدرس  شبکه سرویس‌دهنده وب (شامل پورت TCP) localhost:1234 و URL با مقدار HelloWorld را ترکیب می‌کند.

اولین توضیحات مشخص می‌کند این یک متد HTTP GET است که با ضمیمه کردن «/HelloWorld/» به آدرس اصلی فراخوانده می‌شود. توضیحات  دوم متدی از HTTP GET را مشخص می‌کند که با ضمیمه «/HelloWorld/Welcome» به آدرس اصلی فراخوانده می‌شود. در ادامه آموزش ASP.NET Core  برای ایجاد متد HTTP POST ، از scaffolding استفاده خواهید کرد.

برنامه را در حالت غیردیباگ اجرا کرده و نوار آدرس، «HelloWorld» را اضافه کنید. متد Index یک رشته را برمی گرداند .

MVC کلاس های  کنترلر را بسته به آدرس ورودی فرامی‌خواند. آدرس پیش فرض سیستم مسیر یابی الگوی پایین است تا کدی که باید خوانده شود مشخص شود:

/[Controller]/[ActionName]/[Parameters]

شما می توانید فرمت سیستم مسیر یابی را  در فایل Startup.cs، در متد Configure تعیین کنید .

app.UseMvc(routes =>
{
    routes.MapRoute(
        name: "default",
        template: "{controller=Home}/{action=Index}/{id?}");
});

وقتی برنامه را بدون اضافه کردن بخشی به آدرس اصلی اجرا می‌کنید، به طور پیش‌فرض به کنترلر Home و متد Index هدایت می شود .

بخش اول آدرس کلاس کنترلری که باید اجرا شود را مشخص می‌کند. پس localhost:xxxx/HelloWorld به کلاس HelloWorldController ختم می‌شود. بخش دوم آدرس متد مربوط به کلاس  را مشخص می‌کند. پس localhost:xxxx/HelloWorld/Index بعد از اجرا به متد Index در کلاس HelloWorldController هدایت می‌شود. توجه داشته باشید که شما می‌بایست تنها در مرورگر localhost:xxxx/HelloWorld را وارد کرده و متد Index به طور پیش‌فرض فراخوانی می‌شود. دلیل این امر این است که Index متد پیش‌فرضی است که در صورت عدم مشخص کردن نام متد ، فراخوانده می‌شود. بخش سوم آدرس (id) برای داده مسیر است. داده مسیر را در ادامه این آموزش ASP.NET Core MVC  خواهید دید.

آدرس http://localhost:xxxx/HelloWorld/Welcome را در مرورگر وارد کنید . متد Welcome اجرا شده و رشته «این اکشن متد خوش‌آمدگویی است…» را نشان می‌دهد. در این آدرس، کنترلر HelloWorld و Welcome اکشن متد است. شما هنوز از بخش [Parameters] آدرس استفاده نکرده‌اید.

کد را تغییر می دهیم تا برخی از اطلاعات پارامتری را از آدرس به کنترلر انتقال دهیم . مثلا /HelloWorld/Welcome?name=Rick&numtimes=4. متد را تغییر دهید تا همان‌طور که در کد ذیل آمده، متد Welcome تغییر کند.

// GET: /HelloWorld/Welcome/ 
// Requires using System.Text.Encodings.Web;
public string Welcome(string name, int numTimes = 1)
{
    return HtmlEncoder.Default.Encode($"Hello {name}, NumTimes is: {numTimes}");
}

کد بالا  :

• از ویژگی پارامتر اختیاری C# استفاده می‌کند تا اگر هیچ مقداری برای پارامتر numTimes ارسال  نشد ، به طور پیش‌فرض ۱ قرار گیرد.

• از HtmlEncoder.Default.Encode استفاده می‌کند تا از برنامه در برابر ورودی‌های مخرب (مانند JavaScript) محافظت کند.

• از رشته‌های الحاقی استفاده می‌کند.

برنامه را اجرا کرده و به این آدرس بروید:

http://localhost:xxxx/HelloWorld/Welcome?name=Rick&numtimes=4

(xxxx را با عدد پورت خود جایگزین کنید.) می‌توانید برای name و numtimes مقادیر مختلفی را در آدرس امتحان کنید. سیستم model binding ، به طور خودکار پارامترهای نام‌برده را از نوار آدرس query string  در پارامترهای متد شما قرار می‌دهد. 

در تصویر بالا از بخش Parameters آدرس استفاده نشده است. پارامترهای name و numTimes به عنوان query string  منتقل شده‌اند. علامت سوال ? در آدرس بالا یک تفکیک کننده است و رشته‌های تقاضا در پی آن می‌آیند. کاراکترِ & رشته‌های تقاضا را تفکیک می‌کند.

متد Welcome را با کد زیر جایگزین کنید:

public string Welcome(string name, int ID = 1)
{
    return HtmlEncoder.Default.Encode($"Hello {name}, ID: {ID}");
}

برنامه را اجرا کرده و این آدرس را وارد کنید: http://localhost:xxx/HelloWorld/Welcome/3?name=Rick

این بار بخش سوم آدرس با پارامتر مسیر id مطابقت داشت. متد Welcome شامل یک پارامتر id می‌شود که با الگوی آدرس در متد MapRoute تطابق دارد. علامت سوال ? قبلی (در id?) نشان می‌دهد پارامتر id? اختیاری است.

app.UseMvc(routes =>
{
    routes.MapRoute(
        name: "default",
        template: "{controller=Home}/{action=Index}/{id?}");
});

 

در این مثال‌ها، کنترلر کار بخش نما(view) و کنترلر را از MVC انجام می‌دهد. خروجی کنترلر مستقیما به HTML تبدیل می‌شود. به طور کلی این خروجی HTML نتیجه مطلوب نیست. چرا که برای کدنویسی  و نگهداری سخت خواهد بود. به جای آن شما معمولا از یک فایل الگو نمای متفاوت از Razor استفاده می‌کنید تا خروجی HTML دلخواه خود را ایجاد کنید . این کار را در آموزش بعدی ASP.NET Core انجام خواهید داد.

در حالت غیردیباگ ویژوال استودیو (Ctrl+ F5)، نیازی نیست که پس از تغییر کد برنامه را دوباره اجرا کیند . تنها فایل را ذخیره کرده، مرورگر را رفرش کنید و تغییر را خواهید دید.