آموزش ASP.NET MVC5 – فصل۱ – بخش۱

آموزش ASP.NET MVC5 – فصل۱ – بخش۱

مشخصات مقاله

آموزش ASP.NET MVC5 – فصل۱ – بخش۱

 آموزش ASP.NET MVC5 – فصل1 – بخش1 

درباره معماری MVC و معرفی کنترولر و اکشن

 

مقدمه معماری ASP.NET-MVC:

سلام دوستان . در این سری آموزشی قصد داریم شما را با دنیای بی انتهای  Asp.net MVC 5 آشنا کنیم . این مقالات توسط احسان صفری نوشته شده اند . استفاده از مطالب و مقالات سایت فقط با ذکر آدرس وب سایت محتوا (www.Mohtavaban.com) مجاز می باشد . در نهایت از استاد عزیز ، جناب آقای مهندس داریوش تصدیقی ، تشکر میکنم .

این سری آموزشی سعی داریم تمامی مطالب مهم و کاربردی این مبحث را بیان کنیم . 

مقدمه ای بر ASP.NET MVC 5

 

مفهوم معماری MVC :

MVC مخفف کلمات Model-View-Controller می باشد . ما قبلا فقط asp.net webform داشتیم ولی با آمدن mvc به دنیای دات نت asp.net به دو بخش webform و mvc تقسیم می شود .

 

mvc_cycle

 

ASP.NET webform بصورت Event Driven است مانند windows application ها . یعنی بعنوان مثال با کلیک روی button به رویداد onClick دکمه می رویم . ولی نحوه کار کردن mvc بر اساس معاری Model-View-Controller می باشد .

معماری mvc مفهوم جدیدی در دنیای برنامه نویسی نیست . بلکه از سال 1956 بوجود آمد . اولین بار نیز در زبان برنامه نویسی جاوا بحث mvc مطرح شد (Spring mvc) سپس در PHP بیان شد و چند سالی است که مایکروسافت مفهوم mvc را به دنیای دات نت وارد کرده است .

 

معماری MVVM:

معماری دیگری وجود دارد بنام MVVM که مخفف کلمات Model-View-View-Model می باشد که معماری برنامه های تحت ویندوز یا دسکتاپی می باشد .

مقایسه معماری ها از لحاظ آدرس سایت در مرورگر :

اگر بخواهیم از لحاظ آدرس وب سات در مروگر نیز مقایسه کنیم بدین صورت می باشد که اگر آدرس مرورگر به نام صفحه ختم شود معماری کلاسیک دارد و اگر بصورت مثلا www.EhsanSafari.com/product/cat/12 ختم شود از معماری mvc بهره می برد . ولی مشخص نیست با چه زبان برنامه نویسی نوشته شده است (PHP یا ASP Classic یا ASP.NET یا Java)

مثلا :

  • اگر url مرورگر به asp ختم شود تکنولوژی asp کلاسیک دارد
  • اگر به php ختم شود php classic 
  • اگر به jsp ختم شود جاوا کلاسیک

مفهوم Controller و Action : 

دو مفهوم مهم کنترلر و اکشن را با یک مثال توضیح می دهیم :

به آدرس www.EhsanSafari.com/user/list دقت کنید . user نام controller است و list نیز action می باشد . (یعنی میخواهم در کنترلر user اکشن یا تابع list را فراخوانی کنی)

کنترلر یک کلاس است که از System.web.MVC.Controller ارث می برد . مانند page در asp.net webform که از کتابخانه System.web.UI.page ارث می برد(inherit) .

در mvc به توابع داخل کلاس Controller اکشن می گویند (یک function است) .

اگر علاوه بر دو پارامتر فوق در url پارامتر دیگری داشتیم ID می باشد . در مثال فوق داریم : www.EhsanSafari.com/user/list/12

بدین صورت تفسیر میشود که برو از اکشن list واقع در کنترلر user اطلاعات کاربری را که آیدی آن 12 می باشد را استخراج کن .

اکنون نوبت آنست که نرم افزار قدرتمند ویژوال استودیو را نصب کرده و اولین پروژه mvc5 را ایجاد کنیم.

 

نصب ویژوال استودیو و ایجاد اولین پروژه MVC

 

نصب ویژوال استودیو 2013:

برای شروع کار ابتدا باید نرم افزار ویژوال استودیو 2013 (Visual Studio 2013) را نصب کنید .

نکته : همانطور که در بخش قبل دیدیم قصد داریم در این سری آموزشی ، MVC5 را یاد بگیریم . بنابراین باید ویژوال استودیو 2013 را نصب کنیم . اگر نسخه 2012 را از قبل نصب داریم می توانیم آنرا پاک کرده و نسخه 2013 را نصب کنیم . ویژوال استودیو 2012 معماری mvc4 را ساپورت میکند .

ایجاد پروژه MVC5:

سپس به منوی file رفته و از منوی new گزینه project را انتخاب میکنیم (File>New>Project) . در پنجره ای که ظاهر می شود در منوی Visual c#  و زیر منوی web کلیک کرده (دقت کنید که وارد زیرمنوی web نمی شویم) و Asp.net Web Application را انتخاب مینماییم و همچنین ورژن .net framework را از لیست بازشوی بالا روی net 4.5 انتخاب کرده و سپس مسیر ذخیره پروژه را بیان میکنیم و در نهایت دکمه OK را میزنیم . (مطابق تصویر زیر)

اکنون در پنجره جدید (تصویر زیر) گزینه Empty را انتخاب کرده و در قسمت پایین گزینه MVC را تیک زده و نهایتا ok میکنیم .(برای شروع کار Empty بهترین گزینه است)

در بخش بعد میخواهیم یک کنترولر بسازیم و یک اکشن تعریف کنیم و آنرا بدون پارامتر ورودی و خروجی صدا بزنیم.

تعریف کنترولر و اکشن در پروژه ASP.NET-MVC

تا بدین جا با مفهوم معماری MVC آشنا شده ایم و سپس ویژوال استودیو را نصب کردیم و اولین پروژه MVC را ایجاد کردیم . اکنون با تصویر زیر مواجه هستیم :

تعریف کنترولر در فولدر controllers

کنترولر یک کلاس می باشد که باید حتما در فولدر Controllers ایجاد شود .

قوانین ایجاد کنترولر:

همانطور که ذکر شد کنترولر باید در فولدر Controllers ساخته شود و همچنین باید به نام Controller ختم شود یعنی اگر ما کنترولری میخواهیم با نام Home باید نام کلاس آن را HomeController قرار دهیم . برای شروع کار ابتدا روی فولدر Controllers راست کلیک کرده و زیرمنوی Add و سپس Controller را میزینیم . در پنجره ای که ظاهر می شود نام کنترولر را میدهیم . چون اولین کنترولر پروژه است باید نام آنرا HomeController قرار دهیم . هم اکنون یک کلاس ایجاد شده است که میتوانیم اکشن های دلخواه خود را در آن تعریف کنیم . اکشن Index پیش فرض است و با ایجاد هر کنترولر یک اکشن Index نیز اتوماتیک ساخته می شود .

نکته: لطفا توجه داشته باشید که نام Home در کنترولرها نیز پیش فرض است یعنی با اجرای برنامه-زدن کلید F5 پروژه با اکشن ایندکس از کنترولر Home شروع بکار میکند. بعنوان مثال : http://localhost:7538/Home/Index

اکنون کنترولر Home بصورت تصویر زیر می باشد :

کنترولر Home

همانطور که مشاهده می کنید اکشن Index نه پارامتری میگیرد (void) نه پارامتری ارسال میکند .

در بخش چهارم از این بخش، اکشن هایی تعریف میکنیم که پارامتر ورودی میگیرند.

تعریف اکشن با پارامتر ورودی در ASP.NET-MVC

 

1- ارسال عدد int بعنوان پارامتر:

در اکشن Learn1010 پارامتر id بصورت int عددی تعریف شده است .بصورت زیر :

public void Learn1010(int id)
{
    // Do Something
}

با توجه به اینکه  Primitive type است نمیتواند خالی یا null باشد پس اگر در مرورگر بنویسیم http://localhost:30847/Home/Learn1010 با خطا روبرو میشویم .

نام id پیش فرض است یعنی اگر نام پارامتر ورودی را id قرار دهیم میتوانیم در هنگام فراخوانی نام id را ننویسیم و فقط با یک / مقدار id را وارد کنیم ولی اگر نام دیگری داشته باشد باید حتما نام پارامتر را وارد کنیم .

 

2- ارسال پارامتر عددی بنام number:

اکشن دیگری تعریف می کنیم بنام Learn1020 و نام پارامتر آنرا number میگذاریم .

public void Learn1020(int number)
{
    // Do Something
}

 

روش‌های فراخوانی اکشن Learn1020:

اگر آدرس را به دو صورت زیر بنویسیم با خطا مواجه می شویم :

http://localhost:30847/Home/Learn1020 
http://localhost:30847/Home/Learn1020/15

ولی دو آدرس زیر صحیح (Valid) می باشد :

http://localhost:30847/Home/Learn1020?number=15
http://localhost:30847/Home/Learn1020?Number=15

نکته آدرس دوم : نام پارامتر حساس به حروف بزرگ و کوچک نیست (Case Sensitive) مثلا number همان Number است .

 

3- ارسال دو پارامتر عددی در اکشن:

اکشن دیگری بنام Learn1030 تعریف میکنیم و دو پارامتر عددی num1 و num2 را ارسال میکنیم :

public void Learn1030(int num1, int num2)
{
    // Do Something…
}

روش‌های فراخوانی اکشن Learn1030:

در صورتی که آدرس بصورت زیر باشد Error میدهد :

http://localhost:30847/Home/Learn1030
http://localhost:30847/Home/Learn1030/15
http://localhost:30847/Home/Learn1030?firstNumber=15

علت غلط بودن آدرسهای اول و دوم که در بالا گفته شد . در آدرس سوم هم چون فقط یکی از دو پارامتر مقداردهی شده است ارور میدهد . ولی آدرسهای زیر معتبر هستند :

http://localhost:30847/Home/Learn1030?firstNumber=15&secondNumber=20 
http://localhost:30847/Home/Learn1030?secondNumber=20&firstNumber=15

نکته : ترتیب مقدار دادن به پارامترها اهمیت ندارد (روش دوم)

4- ارسال دو پارامتر عددی بنام‌های id و number:

اکشن بعدی Learn1040 است که بصورت زیر تعریف شده است :

public void Learn1040(int id, int number)
{
    // Do Something…
}

روش‌های فراخوانی اکشن Learn1040:

اگر به روشهای زیر اکشن فوق را فراخوانی کنیم با error روبرو می شویم :

http://localhost:30847/Home/Learn1040
http://localhost:30847/Home/Learn1040/15

و روشهای زیر درست است :

http://localhost:30847/Home/Learn1040/15?number=20
http://localhost:30847/Home/Learn1040?id=15&number=20
http://localhost:30847/Home/Learn1040?number=20&id=15

روش اول شیکتر است ! با توجه به اینکه نام یکی از پارامترها id می باشد میتوان آنرا ننوشت و فقط نام پارامتر بعدی را قید کرد .

 

5- ارسال پارامتر عددی بصورت Nullable:

اکشن Learn1050 بصورت زیر است:

public void Learn1050(int? number) 
{ 
// Do Something… 
}

روش‌های فراخوانی اکشن Learn1050:

پارامتر عددی این اکشن بصورت Nullable تعریف شده است (?int)  پس می توانیم به آن عددی نسبت دهیم میتوانیم ندهیم . تمام روشهای زیر درست می باشند :

http://localhost:30847/Home/Learn1050
http://localhost:30847/Home/Learn1050?number=15
http://localhost:30847/Home/Learn1050/15

6- ارسال پارامتر رشته‌ای (string):

اکشن Learn1060 پارامتر رشته ای می گیرد :​

 public void Learn1060(string name)
{
    // Do Something…
}

 

روش‌های فراخوانی اکشن Learn1060:

http://localhost:30847/Home/Learn1060
http://localhost:30847/Home/Learn1060/Something
http://localhost:30847/Home/Learn1060?name=Something

چون رشته می تواند null باشد (Reference Type است) به مشکلی برخورد نمیکنیم .

 

7- ارسال پارامتر رشته ای بنام id:

در اکشن بعدی (Learn1070) پارامتر رشته ای بنام id تعریف شده است . پس می توان نام آنرا در آدرس ننوشت :

public void Learn1070(string id)
{
// Do Something…
}

 

روش‌های فراخوانی اکشن Learn1070:

http://localhost:30847/Home/Learn1070
http://localhost:30847/Home/Learn1070/Something
http://localhost:30847/Home/Learn1070?id=Something

مشخص است که روش دوم شیک تر است !

 

8- ارسال پارامتر رشته ای با مقدار پیش‌فرض:

اکشن آخر هم نکته جالبی دارد . اگر به پارامتر name مقداری اختصاص داده نشود مقدار پیش فرض مثلا * را در name میریزد :

public void Learn1080(string name = "*")
{
// Do Something…
}

 

روش‌های فراخوانی اکشن Learn1080:

روشهای زیر همگی درست می باشند و error نمیدهند :

http://localhost:30847/Home/Learn1080 -> name = “*”
http://localhost:30847/Home/Learn1080/Something -> name = "*"
http://localhost:30847/Home/Learn1080?name=Something -> name = "Something"

در روش اول چون مقداری داده نشده name مقدار پیش فرض * را میگیرد .

در روش دوم چون نام پارامتر ذکر نشده ، دنبال id میگردد و چون نام پارامتر id نمی باشد name مجددا * میشود

در روش سوم که مقدار name صراحتا تعیین شده است .

امیدوارم استفاده لازم را از این مقاله برده باشید . برای اطلاعات بیشتر در این زمینه به وبلاگ asp.net مراجعه کنید .

با بخش دوم از جلسه اول آموزش MVC همراه ما باشید…!

4/5 (1 نظر)

اطلاعات مقاله

آموزش ASP.NET MVC5 – فصل۱ – بخش۱

فرم ارسال دیدگاه درباره

آموزش ASP.NET MVC5 – فصل۱ – بخش۱

دیدگاه کاربران درباره

آموزش ASP.NET MVC5 – فصل۱ – بخش۱

avatar Mohtava-Admin (2018-04-13 17:41:24)

سلام کاربران گرامی. لطفا سوالات خود را از طریق فرم ارسال دیدگاه و یا آدرس ایمیل [email protected] با ما در میان بگذارید.

avatar ارشیا (2019-06-26 07:13:51)
سلام. خدا قوت داداش کارت بیسته. خیلی از مطالب کاربردی رو به زبان ساده آموزش دادی. امیدوارم همیشه موفق باشی
avatar Mohtava-Admin (2019-06-26 22:16:15)
سلام ارشیای عزیز خواهش میکنم. خوشحالم که مقالات ما برات مفید بوده :)