2. Bölüm: DenetleyicilerPart 2: Controllers

Jon Galloway tarafındanby Jon Galloway

MVC müzik deposu, Web geliştirme için ASP.NET MVC ve Visual Studio 'nun nasıl kullanılacağını anlatan bir öğretici uygulamadır.The MVC Music Store is a tutorial application that introduces and explains step-by-step how to use ASP.NET MVC and Visual Studio for web development.

MVC müzik deposu, çevrimiçi olarak müzik albümlerini satan ve temel site yönetimi, Kullanıcı oturum açma ve alışveriş sepeti işlevlerini uygulayan basit bir örnek depolama uygulamasıdır.The MVC Music Store is a lightweight sample store implementation which sells music albums online, and implements basic site administration, user sign-in, and shopping cart functionality.

Bu öğretici serisi, ASP.NET MVC müzik deposu örnek uygulamasını oluşturmak için kullanılan adımların tümünü ayrıntılarıyla ayrıntılardır.This tutorial series details all of the steps taken to build the ASP.NET MVC Music Store sample application. 2. Bölüm denetleyicileri içerir.Part 2 covers Controllers.

Geleneksel Web çerçeveleri ile gelen URL 'Ler genellikle disk üzerindeki dosyalarla eşleştirilir.With traditional web frameworks, incoming URLs are typically mapped to files on disk. Örneğin: "/Products.aspx" veya "/Products.php" gibi bir URL isteği bir "Products. aspx" veya "Products. php" dosyası tarafından işlenebilir.For example: a request for a URL like "/Products.aspx" or "/Products.php" might be processed by a "Products.aspx" or "Products.php" file.

Web tabanlı MVC çerçeveleri, URL 'Leri sunucu koduna biraz farklı bir şekilde eşler.Web-based MVC frameworks map URLs to server code in a slightly different way. Gelen URL 'Leri dosyalara eşlemek yerine, URL 'Leri sınıfların yöntemlerine eşleyin.Instead of mapping incoming URLs to files, they instead map URLs to methods on classes. Bu sınıflar "denetleyiciler" olarak adlandırılır ve gelen HTTP isteklerini işlemekten, Kullanıcı girişi işleme, verileri alma ve kaydetme ve istemciye geri gönderme yanıtını belirleme (HTML görüntüleme, bir dosyayı indirme, farklı bir şekilde yeniden yönlendirme) URL, vb.).These classes are called "Controllers" and they are responsible for processing incoming HTTP requests, handling user input, retrieving and saving data, and determining the response to send back to the client (display HTML, download a file, redirect to a different URL, etc.).

HomeController eklemeAdding a HomeController

Sitemizin ana sayfasında URL 'Leri işleyecek bir denetleyici sınıfı ekleyerek MVC müzik deposu uygulamamıza başlayacağız.We'll begin our MVC Music Store application by adding a Controller class that will handle URLs to the Home page of our site. ASP.NET MVC 'nin varsayılan adlandırma kurallarını takip edeceğiz ve HomeController ' a çağrı yapacağız.We'll follow the default naming conventions of ASP.NET MVC and call it HomeController.

Çözüm Gezgini içindeki "denetleyiciler" klasörüne sağ tıklayın ve "Ekle" yi ve ardından "denetleyici..." öğesini seçin. komutundakiRight-click the "Controllers" folder within the Solution Explorer and select "Add", and then the "Controller…" command:

Bu, "denetleyici Ekle" iletişim kutusunu getirir.This will bring up the "Add Controller" dialog. Denetleyiciyi "HomeController" olarak adlandırın ve Ekle düğmesine basın.Name the controller "HomeController" and press the Add button.

Bu, aşağıdaki kodla yeni bir HomeController.cs dosyası oluşturur:This will create a new file, HomeController.cs, with the following code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
 
namespace MvcMusicStore.Controllers
{
    public class HomeController : Controller
    {
        //
        // GET: /Home/
        public ActionResult Index()
        {
            return View();
        }
    }
}

Mümkün olduğunca basit bir şekilde başlamak için Dizin metodunu yalnızca bir dize döndüren basit bir yöntemle değiştirin.To start as simply as possible, let's replace the Index method with a simple method that just returns a string. İki değişiklik yapacağız:We'll make two changes:

  • Yöntemi eylem sonucu yerine bir dize döndürecek şekilde değiştirinChange the method to return a string instead of an ActionResult
  • Return ifadesini "from evden" döndürecek şekilde değiştirinChange the return statement to return "Hello from Home"

Yöntemi şu şekilde görünmelidir:The method should now look like this:

public string Index()
{
    return "Hello from Home";
}

Uygulamayı ÇalıştırmaRunning the Application

Şimdi siteyi çalıştıralım.Now let's run the site. Web-Server ' i başlatabiliriz ve aşağıdakilerden birini kullanarak siteyi deneyebiliriz::We can start our web-server and try out the site using any of the following::

  • Debug ⇨ start hata ayıklamayı Başlat menü öğesini seçinChoose the Debug ⇨ Start Debugging menu item
  • Araç çubuğundaki yeşil ok düğmesine tıklayın Click the Green arrow button in the toolbar
  • F5 klavye kısayolunu kullanın.Use the keyboard shortcut, F5.

Yukarıdaki adımlardan herhangi birini kullanmak, projemizi derler ve Visual Web Developer 'ın yerleşik ASP.NET geliştirme sunucusunun başlatılmasına neden olur.Using any of the above steps will compile our project, and then cause the ASP.NET Development Server that is built-into Visual Web Developer to start. ASP.NET Development Server 'ın başlatıldığını göstermek için ekranın alt köşesinde bir bildirim görünür ve altında çalıştığı bağlantı noktası numarasını gösterir.A notification will appear in the bottom corner of the screen to indicate that the ASP.NET Development Server has started up, and will show the port number that it is running under.

Visual Web Developer, URL 'SI Web-Server ' ı işaret eden bir tarayıcı penceresini otomatik olarak açar.Visual Web Developer will then automatically open a browser window whose URL points to our web-server. Bu, Web uygulamamızı hızlıca denememize olanak sağlayacak:This will allow us to quickly try out our web application:

Neredeyse hızlı bir şekilde, yeni bir Web sitesi oluşturdunuz, üç satırlık bir işlev ekledik ve bir tarayıcıda metin aldık.Okay, that was pretty quick – we created a new website, added a three line function, and we've got text in a browser. Roket bilimi değil, ancak bir başlangıç.Not rocket science, but it's a start.

Note: Visual Web Developer, Web sitenizi rastgele boş bir "bağlantı noktası" numarası üzerinde çalıştıracak ASP.NET geliştirme sunucusunu içerir. Yukarıdaki ekran görüntüsünde, site http://localhost:26641/çalışıyor, bu nedenle 26641 numaralı bağlantı noktasını kullanıyor. Bağlantı noktası numaranız farklı olacaktır. Bu öğreticide, URL 'ler gibi/Store/gözatım gibi bir iletişim kurduğumuz zaman, bağlantı noktası numarasından sonra da devam edecektir. 26641 numaralı bağlantı noktası,/Store/gözatma 'ya göz atarak http://localhost:26641/Store/Browsegöz atacaktır.Note: Visual Web Developer includes the ASP.NET Development Server, which will run your website on a random free "port" number. In the screenshot above, the site is running at http://localhost:26641/, so it's using port 26641. Your port number will be different. When we talk about URL's like /Store/Browse in this tutorial, that will go after the port number. Assuming a port number of 26641, browsing to /Store/Browse will mean browsing to http://localhost:26641/Store/Browse.

StoreController eklemeAdding a StoreController

Sitemizin ana sayfasını uygulayan basit bir HomeController ekledik.We added a simple HomeController that implements the Home Page of our site. Şimdi, müzik mağazamız için göz atma işlevini uygulamak üzere kullanacağımız başka bir denetleyici ekleyelim.Let's now add another controller that we'll use to implement the browsing functionality of our music store. Mağaza denetleyicimiz üç senaryoyu destekleyecektir:Our store controller will support three scenarios:

  • Müzik mağazamız içindeki müzik tarzlarımızın bir listeleme sayfasıA listing page of the music genres in our music store
  • Belirli bir tarz tüm müzik albümlerini listeleyen bir tarayıcı sayfasıA browse page that lists all of the music albums in a particular genre
  • Belirli bir müzik albümünden ilgili bilgileri gösteren Ayrıntılar sayfasıA details page that shows information about a specific music album

Yeni bir StoreController sınıfı ekleyerek başlayacağız.We'll start by adding a new StoreController class.. Henüz yapmadıysanız, tarayıcıyı kapatarak veya Debug ⇨ Stop Debugging menü öğesini seçerek uygulamayı çalıştırmayı durdurun.If you haven't already, stop running the application either by closing the browser or selecting the Debug ⇨ Stop Debugging menu item.

Şimdi yeni bir StoreController ekleyin.Now add a new StoreController. HomeController ile yaptığımız gibi, bunu, Çözüm Gezgini içinde "denetleyiciler" klasörüne sağ tıklayıp, Add->Controller menü öğesini seçerek yapacağız.Just like we did with HomeController, we'll do this by right-clicking on the "Controllers" folder within the Solution Explorer and choosing the Add->Controller menu item

Yeni StoreController bir "Dizin" metoduna zaten sahip.Our new StoreController already has an "Index" method. Bu "Dizin" yöntemini, müzik Deponuzdaki tüm tarzları listeleyen listeleme sayfamızı uygulamak için kullanacağız.We'll use this "Index" method to implement our listing page that lists all genres in our music store. Ayrıca, StoreController 'ın işlemesini istediğimiz iki senaryoyu uygulamak için iki ek yöntem de ekleyeceğiz: tarama ve ayrıntılar.We'll also add two additional methods to implement the two other scenarios we want our StoreController to handle: Browse and Details.

Denetleyicimiz içindeki bu yöntemlere (Dizin, gözatmayı ve ayrıntıları) "denetleyici eylemleri" adı verilir ve HomeController. Index () eylem yöntemiyle zaten gördüğünüz gibi, işleri URL isteklerine yanıt verebiliyor ve (genel olarak konuşulur) hangi içeriğin olduğunu belirleme URL 'YI çağıran tarayıcıya veya kullanıcıya geri gönderilmelidir.These methods (Index, Browse and Details) within our Controller are called "Controller Actions", and as you've already seen with the HomeController.Index()action method, their job is to respond to URL requests and (generally speaking) determine what content should be sent back to the browser or user that invoked the URL.

Dizin () yöntemini "Hello. Index ()" dizesini döndürecek şekilde değiştirerek StoreController uygulamamıza başlayacağız ve gözatıp () ve ayrıntılar () için benzer yöntemler ekleyeceğiz:We'll start our StoreController implementation by changing theIndex() method to return the string "Hello from Store.Index()" and we'll add similar methods for Browse() and Details():

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
 
namespace MvcMusicStore.Controllers
{
    public class StoreController : Controller
    {
        //
        // GET: /Store/
        public string Index()
        {
            return "Hello from Store.Index()";
        }
        //
        // GET: /Store/Browse
        public string Browse()
        {
            return "Hello from Store.Browse()";
        }
        //
        // GET: /Store/Details
        public string Details()
        {
            return "Hello from Store.Details()";
        }
    }
}

Projeyi yeniden çalıştırın ve aşağıdaki URL 'Lere gözatamazsınız:Run the project again and browse the following URLs:

  • /Store/Store
  • /Store/zat/Store/Browse
  • /Store/Details/Store/Details

Bu URL 'Lere erişim, denetleyicimiz içindeki eylem yöntemlerini çağırır ve dize yanıtlarını döndürür:Accessing these URLs will invoke the action methods within our Controller and return string responses:

Bu harika, ancak bunlar yalnızca sabit dizelerdir.That's great, but these are just constant strings. Böylece, URL 'den bilgi alıp sayfa çıktısında görüntülenecek şekilde dinamik hale olalım.Let's make them dynamic, so they take information from the URL and display it in the page output.

İlk olarak, URL 'den bir QueryString değeri almak için, gezinme eylemi yöntemini değiştireceksiniz.First we'll change the Browse action method to retrieve a querystring value from the URL. Bunu, eylem yönteimize bir "tarz" parametresi ekleyerek yapabiliriz.We can do this by adding a "genre" parameter to our action method. Bu ASP.NET MVC, çağrıldığında otomatik olarak herhangi bir QueryString veya "tarz" adlı form gönderme parametrelerini eylem yönteimize iletir.When we do this ASP.NET MVC will automatically pass any querystring or form post parameters named "genre" to our action method when it is invoked.

//
// GET: /Store/Browse?genre=Disco
public string Browse(string genre)
 {
    string message = HttpUtility.HtmlEncode("Store.Browse, Genre = "
+ genre);
 
    return message;
 }

Note: Kullanıcı girişini silmek için HttpUtility. HtmlEncode yardımcı programı yöntemini kullanıyoruz. Bu, kullanıcıların JavaScript 'i/Store/gözatmaya benzer bir bağlantıyla ekleme değiştirmesini engeller. Tarz =<betiği>Window. Location = 'http://hackersite.com'</SCRIPT>.Note: We're using the HttpUtility.HtmlEncode utility method to sanitize the user input. This prevents users from injecting Javascript into our View with a link like /Store/Browse?Genre=<script>window.location='http://hackersite.com'</script>.

Şimdi/Store/gözatmaya gözatmaya izin veriyor musunuz? Tarz = discoNow let's browse to /Store/Browse?Genre=Disco

Daha sonra Ayrıntılar eylemini, ID adlı bir giriş parametresi okumak ve görüntülenecek şekilde değiştirelim.Let's next change the Details action to read and display an input parameter named ID. Önceki yönteminizin aksine ID değerini bir QueryString parametresi olarak gömeceğiz.Unlike our previous method, we won't be embedding the ID value as a querystring parameter. Bunun yerine, bunu doğrudan URL 'nin içine ekleyeceğiz.Instead we'll embed it directly within the URL itself. Örneğin:/Store/Details/5.For example: /Store/Details/5.

ASP.NET MVC bunu, herhangi bir şeyi yapılandırmak zorunda kalmadan kolayca yapabilmenizi sağlar.ASP.NET MVC lets us easily do this without having to configure anything. ASP.NET MVC 'nin varsayılan yönlendirme kuralı, eylem yöntemi adından sonra bir URL 'nin segmentini "ID" adlı bir parametre olarak değerlendirmek için kullanılır.ASP.NET MVC's default routing convention is to treat the segment of a URL after the action method name as a parameter named "ID". Eylem yönteminizin ID adlı bir parametresi varsa ASP.NET MVC, URL segmentini otomatik olarak bir parametre olarak size iletir.If your action method has a parameter named ID then ASP.NET MVC will automatically pass the URL segment to you as a parameter.

//
// GET: /Store/Details/5
public string Details(int id)
 {
    string message = "Store.Details, ID = " + id;
 
    return message;
 }

Uygulamayı çalıştırın ve/Store/Details/5 adresine gidin:Run the application and browse to /Store/Details/5:

Şimdiye kadar yaptığımız şeyleri de en üst sınıra bakalım:Let's recap what we've done so far:

  • Visual Web Developer 'da yeni bir ASP.NET MVC projesi oluşturdukWe've created a new ASP.NET MVC project in Visual Web Developer
  • Bir ASP.NET MVC uygulamasının temel klasör yapısını tartıştık.We've discussed the basic folder structure of an ASP.NET MVC application
  • ASP.NET geliştirme sunucusunu kullanarak Web sitemizi nasıl çalıştıracağınızı öğrendinizWe've learned how to run our website using the ASP.NET Development Server
  • İki denetleyici sınıfı oluşturduk: bir HomeController ve StoreControllerWe've created two Controller classes: a HomeController and a StoreController
  • URL isteklerine yanıt veren ve tarayıcıya metin döndüren denetleyicilerimize eylem yöntemleri ekledikWe've added Action Methods to our controllers which respond to URL requests and return text to the browser