Część 2. Dodawanie kontrolera do aplikacji MVC platformy ASP.NET Core

Autor: Rick Anderson

Wzorzec architektury Model-View-Controller (MVC) oddziela aplikację od trzech głównych składników: Model, View i Controller. Wzorzec MVC ułatwia tworzenie aplikacji, które są bardziej testowalne i łatwiejsze do zaktualizowania niż tradycyjne aplikacje monolityczne.

Aplikacje oparte na mvC zawierają:

• Węgorze: klasy reprezentujące dane aplikacji. Klasy modeli używają logiki walidacji, aby wymusić reguły biznesowe dla tych danych. Zazwyczaj obiekty modelu pobierają i przechowują stan modelu w bazie danych. W tym samouczku Movie model pobiera dane filmu z bazy danych, udostępnia je do widoku lub aktualizacji. Zaktualizowane dane są zapisywane w bazie danych.
• Views: Widoki to składniki, które wyświetlają interfejs użytkownika aplikacji. Ogólnie rzecz biorąc, ten interfejs użytkownika wyświetla dane modelu.
• Controllers: Klasy, które:
  • Obsługa żądań przeglądarki.
  • Pobieranie danych modelu.
  • Wywołaj szablony widoku, które zwracają odpowiedź.

W aplikacji MVC widok wyświetla tylko informacje. Kontroler obsługuje dane wejściowe i interakcje użytkownika oraz reaguje na nie. Na przykład kontroler obsługuje segmenty adresów URL i wartości ciągu zapytania i przekazuje te wartości do modelu. Model może używać tych wartości do wykonywania zapytań względem bazy danych. Na przykład:

• https://localhost:5001/Home/Privacy: określa Home kontroler i Privacy akcję.
• https://localhost:5001/Movies/Edit/5: to żądanie edycji filmu o identyfikatorze ID=5 przy użyciu Movies kontrolera i Edit akcji, które zostały szczegółowo opisane w dalszej części samouczka.

Dane trasy wyjaśniono w dalszej części tego samouczka.

Wzorzec architektury MVC oddziela aplikację na trzy główne grupy składników: Modele, widoki i kontrolery. Ten wzorzec pomaga w osiągnięciu separacji problemów: logika interfejsu użytkownika należy do widoku. Logika wejściowa należy do kontrolera. Logika biznesowa należy do modelu. Ta separacja ułatwia zarządzanie złożonością podczas kompilowania aplikacji, ponieważ umożliwia pracę nad jednym aspektem implementacji w danym momencie bez wpływu na kod innego. Na przykład możesz pracować nad kodem widoku bez względu na kod logiki biznesowej.

Te pojęcia zostały wprowadzone i zaprezentowane w tej serii samouczków podczas tworzenia aplikacji filmowej. Projekt MVC zawiera foldery kontrolerów i widoków.

Dodawanie kontrolera

Program Visual Studio

W Eksplorator rozwiązań kliknij prawym przyciskiem myszy pozycję Kontrolery > Dodaj > kontroler.

W oknie dialogowym Dodawanie nowego elementu szkieletowego wybierz pozycję Kontroler MVC — pusty>dodaj.

W oknie dialogowym Dodawanie nowego elementu — MvcFilm wprowadź HelloWorldController.cs i wybierz pozycję Dodaj.

Visual Studio Code

Wybierz ikonę EKSPLORATOR, a następnie kliknij prawym przyciskiem myszy pozycję Kontrolery > Nowy plik i nadaj nowej nazwie nowy plik HelloWorldController.cs.

Visual Studio dla komputerów Mac

W Eksplorator rozwiązań kliknij pozycję Kontrolery i wybierz pozycję Dodaj > nowy plik.

Wybierz pozycję ASP.NET Core i Controller Class (Klasa kontrolera).

Nadaj kontrolerowi nazwę HelloWorldController.

Zastąp zawartość Controllers/HelloWorldController.cs następującym kodem:

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...";
    }
}

Każda public metoda w kontrolerze jest wywoływana jako punkt końcowy HTTP. W powyższym przykładzie obie metody zwracają ciąg. Zwróć uwagę na komentarze poprzedzające każdą metodę.

Punkt końcowy HTTP:

• To docelowy adres URL w aplikacji internetowej, taki jak https://localhost:5001/HelloWorld.
• Łączy:
  • Używany protokół: HTTPS.
  • Lokalizacja sieciowa serwera internetowego, w tym port TCP: localhost:5001.
  • Docelowy identyfikator URI: HelloWorld.

Pierwszy komentarz wskazuje, że jest to metoda HTTP GET wywoływana przez dołączenie /HelloWorld/ do podstawowego adresu URL.

Drugi komentarz określa metodę HTTP GET wywoływaną przez dołączenie /HelloWorld/Welcome/ do adresu URL. W dalszej części samouczka aparat tworzenia szkieletów jest używany do generowania HTTP POST metod, które aktualizują dane.

Uruchom aplikację bez debugera, naciskając klawisze Ctrl+F5 (Windows) lub ⌘+F5 (macOS).

Dołącz /HelloWorld do ścieżki na pasku adresu. Metoda Index zwraca ciąg.

MvC wywołuje klasy kontrolerów i metody akcji w nich, w zależności od przychodzącego adresu URL. Domyślna logika routingu adresów URL używana przez MVC używa formatu podobnego do tego w celu określenia, jaki kod ma być wywoływany:

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

Format routingu Program.cs jest ustawiany w pliku.

app.MapControllerRoute(
    name: "default",
    pattern: "{controller=Home}/{action=Index}/{id?}");

Gdy przechodzisz do aplikacji i nie podajesz żadnych segmentów adresów URL, domyślnie jest to kontroler "Home" i metoda "Index" określona w wierszu szablonu wyróżnionym powyżej. W poprzednich segmentach adresów URL:

• Pierwszy segment adresu URL określa klasę kontrolera do uruchomienia. Dlatego localhost:5001/HelloWorld mapuje na klasę Kontrolera HelloWorld .
• Druga część segmentu adresu URL określa metodę akcji w klasie . Powoduje to localhost:5001/HelloWorld/Index uruchomienie Index metody HelloWorldController klasy. Zwróć uwagę, że domyślnie trzeba było przejść tylko do localhost:5001/HelloWorld metody , Index a metoda została wywołana domyślnie. Index to domyślna metoda, która zostanie wywołana na kontrolerze, jeśli nazwa metody nie zostanie jawnie określona.
• Trzecia część segmentu adresu URL ( id) dotyczy danych trasy. Dane trasy wyjaśniono w dalszej części tego samouczka.

Przejdź do: https://localhost:{PORT}/HelloWorld/Welcome. Zastąp {PORT} ciąg numerem portu.

Metoda Welcome jest uruchamiana i zwraca ciąg This is the Welcome action method.... Dla tego adresu URL kontroler jest HelloWorld i Welcome jest metodą akcji. Nie użyto [Parameters] jeszcze części adresu URL.

Zmodyfikuj kod, aby przekazać niektóre informacje o parametrach z adresu URL do kontrolera. Na przykład /HelloWorld/Welcome?name=Rick&numtimes=4.

Zmień metodę tak Welcome , aby zawierała dwa parametry, jak pokazano w poniższym kodzie.

// 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}");
}

Powyższy kod ma następujące działanie:

• Używa funkcji opcjonalnego parametru języka C#, aby wskazać, że numTimes parametr jest domyślnie ustawiony na 1, jeśli dla tego parametru nie zostanie przekazana żadna wartość.
• Używa HtmlEncoder.Default.Encode metody do ochrony aplikacji przed złośliwymi danymi wejściowymi, takimi jak za pomocą języka JavaScript.
• Używa ciągów interpolowanych w pliku $"Hello {name}, NumTimes is: {numTimes}".

Uruchom aplikację i przejdź do: https://localhost:{PORT}/HelloWorld/Welcome?name=Rick&numtimes=4. Zastąp {PORT} ciąg numerem portu.

Spróbuj użyć różnych wartości dla name i numtimes w adresie URL. System powiązania modelu MVC automatycznie mapuje nazwane parametry z ciągu zapytania na parametry w metodzie . Aby uzyskać więcej informacji, zobacz Powiązanie modelu.

Na poprzedniej ilustracji:

• Segment Parameters adresu URL nie jest używany.
• Parametry name i numTimes są przekazywane w ciągu zapytania.
• ( ? znak zapytania) w powyższym adresie URL jest separatorem, a ciąg zapytania następuje.
• Znak & oddziela pary pól-wartość.

Zastąp metodę Welcome poniższym kodem:

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

Uruchom aplikację i wprowadź następujący adres URL: https://localhost:{PORT}/HelloWorld/Welcome/3?name=Rick

W poprzednim adresie URL:

• Trzeci segment adresu URL był zgodny z parametrem idtrasy .
• Metoda Welcome zawiera parametr id pasujący do szablonu adresu URL w metodzie MapControllerRoute .
• ? Końcowy ciąg zapytania rozpoczyna się.

app.MapControllerRoute(
    name: "default",
    pattern: "{controller=Home}/{action=Index}/{id?}");

W powyższym przykładzie:

• Trzeci segment adresu URL był zgodny z parametrem idtrasy .
• Metoda Welcome zawiera parametr id pasujący do szablonu adresu URL w metodzie MapControllerRoute .
• ? Końcowy (w pliku id?) wskazuje, że id parametr jest opcjonalny.

Poprzedni: Rozpocznijdalej: Dodawanie widoku