Dela via


Del 2, lägg till en kontrollant i en ASP.NET Core MVC-app

Obs

Det här är inte den senaste versionen av den här artikeln. Den senaste versionen finns i den .NET 9-versionen av den här artikeln.

Varning

Den här versionen av ASP.NET Core stöds inte längre. Mer information finns i .NET och .NET Core Support Policy. Den senaste versionen finns i den .NET 9-versionen av den här artikeln.

Viktig

Den här informationen gäller en förhandsversionsprodukt som kan ändras avsevärt innan den släpps kommersiellt. Microsoft lämnar inga garantier, uttryckliga eller underförstådda, med avseende på den information som tillhandahålls här.

Den senaste versionen finns i den .NET 9-versionen av den här artikeln.

Av Rick Anderson

Arkitekturmönstret Model-View-Controller (MVC) separerar en app i tre huvudkomponenter: Model, View och Controller. MVC-mönstret hjälper dig att skapa appar som är mer testbara och enklare att uppdatera än traditionella monolitiska appar.

MVC-baserade appar innehåller:

  • Models: Klasser som representerar appens data. Modellklasserna använder valideringslogik för att framtvinga affärsregler för dessa data. Vanligtvis hämtar och lagrar modellobjekt modelltillstånd i en databas. I denna handledning hämtar en Movie-modell filmdata från en databas och tillhandahåller den till visningen eller uppdaterar den. Uppdaterade data skrivs till en databas.
  • Views: Vyer är de komponenter som visar appens användargränssnitt (UI). I allmänhet visar det här användargränssnittet modelldata.
  • Controllers: Klasser som:
    • Hantera webbläsarbegäranden.
    • Hämta modelldata.
    • Mallarna för samtalsvy som returnerar ett svar.

I en MVC-app visar vyn endast information. Kontrollanten hanterar och svarar på användarindata och interaktion. Kontrollanten hanterar till exempel URL-segment och frågesträngsvärden och skickar dessa värden till modellen. Modellen kan använda dessa värden för att fråga databasen. Till exempel:

  • https://localhost:5001/Home/Privacy: specificerar kontrollern Home och åtgärden Privacy.
  • https://localhost:5001/Movies/Edit/5: är en begäran om att redigera filmen med ID=5 med hjälp av Movies kontrollanten och åtgärden Edit, som beskrivs senare i självstudien.

Routningsdata förklaras senare i handledningen.

MVC-arkitekturmönstret separerar en app i tre huvudgrupper med komponenter: modeller, vyer och styrenheter. Det här mönstret hjälper till att få en uppdelning av problem: Användargränssnittslogik hör hemma i vyn. Indatalogik hör hemma i kontrollanten. Affärslogik hör hemma i modellen. Den här separationen hjälper till att hantera komplexiteten när du skapar en app, eftersom den möjliggör arbete på en aspekt av implementeringen i taget utan att påverka koden för en annan. Du kan till exempel arbeta med visningskoden utan att vara beroende av affärslogiken.

De här begreppen introduceras och demonstreras i den här självstudieserien när du skapar en filmapp. MVC-projektet innehåller mappar för Controllers och Views.

Lägga till en kontrollant

I Solution Explorer, högerklicka på Controllers > , Lägg till > Controller.

Solution Explorer högerklickar du på Controllers > Lägg till > Controller

I dialogrutan Lägg till nytt byggnadsgenererat objekt , välj MVC-styrenhet – tom>Lägg till.

Lägg till MVC-styrenhet

I dialogrutan Lägg till nytt objekt – MvcMovie anger du HelloWorldController.cs och väljer Lägg till.

Ersätt innehållet i Controllers/HelloWorldController.cs med följande kod:

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

Varje public-metod i en kontrollant kan anropas som en HTTP-slutpunkt. I exemplet ovan returnerar båda metoderna en sträng. Observera kommentarerna som föregår varje metod.

En HTTP-slutpunkt:

  • Är en målbar URL i webbprogrammet, till exempel https://localhost:5001/HelloWorld.
  • Kombinerar:
    • Protokollet som används: HTTPS.
    • Nätverksplatsen för webbservern, inklusive TCP-porten: localhost:5001.
    • Mål-URI: HelloWorld.

Den första kommentaren anger att detta är en HTTP GET-metod som anropas genom att lägga till /HelloWorld/ till bas-URL:en.

Den andra kommentaren anger en HTTP GET--metod som anropas genom att lägga till /HelloWorld/Welcome/ till URL:en. Senare i självstudien används scaffoldmotor för att generera HTTP POST-metoder som uppdaterar data.

Kör appen utan felsökningsprogrammet genom att trycka på Ctrl+F5.

Lägg till /HelloWorld till sökvägen i adressfältet. Metoden Index returnerar en sträng.

webbläsarfönster som visar ett appsvar på Det här är min standardåtgärd

MVC anropar kontrollantklasser och åtgärdsmetoderna i dem, beroende på den inkommande URL:en. Standardlogik för URL-routning som används av MVC använder ett format som det här för att avgöra vilken kod som ska anropas:

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

Routningsformatet anges i filen Program.cs.

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

När du bläddrar till appen och inte anger några URL-segment, används som standard kontrollanten "Home" och "Index"-metoden som anges på mallraden som är markerad ovan. I föregående URL-segment:

  • Det första URL-segmentet avgör vilken kontrollantklass som ska köras. Så localhost:5001/HelloWorld mappar till klassen HelloWorld Controller.
  • Den andra delen av URL-segmentet avgör åtgärdsmetoden för klassen. Så localhost:5001/HelloWorld/Index gör att Index-metoden i klassen HelloWorldController körs. Observera att du bara behövde bläddra till localhost:5001/HelloWorld och att metoden Index anropades som standard. Index är standardmetoden som anropas på en kontrollant om ett metodnamn inte uttryckligen anges.
  • Den tredje delen av URL-segmentet ( id) är för routningsdata. Routningsdata förklaras senare i handledningen.

Navigera till: https://localhost:{PORT}/HelloWorld/Welcome. Ersätt {PORT} med portnumret.

Metoden Welcome kör och returnerar strängen This is the Welcome action method.... För den här URL:en är kontrollanten HelloWorld och Welcome är åtgärdsmetoden. Du har inte använt [Parameters] del av URL:en ännu.

webbläsarfönster som visar ett applikationssvar på Det här är Välkommen-åtgärdsmetoden

Ändra koden för att skicka viss parameterinformation från URL:en till kontrollanten. Till exempel /HelloWorld/Welcome?name=Rick&numtimes=4.

Ändra metoden Welcome så att den innehåller två parametrar som visas i följande kod.

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

Föregående kod:

  • Använder funktionen C# optional-parameter för att ange att parametern numTimes som standard är 1 om inget värde skickas för parametern.
  • Använder HtmlEncoder.Default.Encode för att skydda appen mot skadliga indata, till exempel via JavaScript.
  • Använder interpolerade strängar i $"Hello {name}, NumTimes is: {numTimes}".

Kör appen och bläddra till: https://localhost:{PORT}/HelloWorld/Welcome?name=Rick&numtimes=4. Ersätt {PORT} med portnumret.

Prova olika värden för name och numtimes i URL:en. MVC-modellbindningen systemet mappar automatiskt de namngivna parametrarna från frågesträngen till parametrar i metoden. Mer information finns i avsnittet Modellbindning.

Webbläsarfönster som visar ett programsvar från Hello Rick är NumTimes: 4

I föregående bild:

  • URL-segmentet Parameters används inte.
  • Parametrarna name och numTimes skickas i frågesträngen.
  • ? (frågetecken) i ovanstående URL är en avgränsare och frågesträngen följer.
  • Tecknet & separerar fält/värde-par.

Ersätt metoden Welcome med följande kod:

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

Kör appen och ange följande URL: https://localhost:{PORT}/HelloWorld/Welcome/3?name=Rick

I föregående URL:

  • Det tredje URL-segmentet matchade routningsparametern id.
  • Metoden Welcome innehåller en parameter id som matchade URL-mallen i metoden MapControllerRoute.
  • Den avslutande ? startar frågesträngen.
app.MapControllerRoute(
    name: "default",
    pattern: "{controller=Home}/{action=Index}/{id?}");

I föregående exempel:

  • Det tredje URL-segmentet matchade routningsparametern id enligt definitionen i routningsmallen Program.cs i filen.
  • Metoden Welcome innehåller en parameter id som matchade URL-mallen i metoden MapControllerRoute.
  • Den avslutande ? (i id?) anger att parametern id är valfri.

Arkitekturmönstret Model-View-Controller (MVC) separerar en app i tre huvudkomponenter: Model, View och Controller. MVC-mönstret hjälper dig att skapa appar som är mer testbara och enklare att uppdatera än traditionella monolitiska appar.

MVC-baserade appar innehåller:

  • Models: Klasser som representerar appens data. Modellklasserna använder valideringslogik för att framtvinga affärsregler för dessa data. Vanligtvis hämtar och lagrar modellobjekt modelltillstånd i en databas. I denna handledning hämtar en Movie-modell filmdata från en databas och tillhandahåller den till visningen eller uppdaterar den. Uppdaterade data skrivs till en databas.
  • Views: Vyer är de komponenter som visar appens användargränssnitt (UI). I allmänhet visar det här användargränssnittet modelldata.
  • Controllers: Klasser som:
    • Hantera webbläsarbegäranden.
    • Hämta modelldata.
    • Mallarna för samtalsvy som returnerar ett svar.

I en MVC-app visar vyn endast information. Kontrollanten hanterar och svarar på användarindata och interaktion. Kontrollanten hanterar till exempel URL-segment och frågesträngsvärden och skickar dessa värden till modellen. Modellen kan använda dessa värden för att fråga databasen. Till exempel:

  • https://localhost:5001/Home/Privacy: specificerar kontrollern Home och åtgärden Privacy.
  • https://localhost:5001/Movies/Edit/5: är en begäran om att redigera filmen med ID=5 med hjälp av Movies kontrollanten och åtgärden Edit, som beskrivs senare i självstudien.

Routningsdata förklaras senare i handledningen.

MVC-arkitekturmönstret separerar en app i tre huvudgrupper med komponenter: modeller, vyer och styrenheter. Det här mönstret hjälper till att få en uppdelning av problem: Användargränssnittslogik hör hemma i vyn. Indatalogik hör hemma i kontrollanten. Affärslogik hör hemma i modellen. Den här separationen hjälper till att hantera komplexiteten när du skapar en app, eftersom den möjliggör arbete på en aspekt av implementeringen i taget utan att påverka koden för en annan. Du kan till exempel arbeta med visningskoden utan att vara beroende av affärslogiken.

De här begreppen introduceras och demonstreras i den här självstudieserien när du skapar en filmapp. MVC-projektet innehåller mappar för Controllers och Views.

Lägga till en kontrollant

I Solution Explorer, högerklicka på Controllers > , Lägg till > Controller.

Solution Explorer högerklickar du på Controllers > Lägg till > Controller

I dialogrutan Lägg till nytt byggnadsgenererat objekt , välj MVC-styrenhet – tom>Lägg till.

Lägg till MVC-styrenhet

I dialogrutan Lägg till nytt objekt – MvcMovie anger du HelloWorldController.cs och väljer Lägg till.

Ersätt innehållet i Controllers/HelloWorldController.cs med följande kod:

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

Varje public-metod i en kontrollant kan anropas som en HTTP-slutpunkt. I exemplet ovan returnerar båda metoderna en sträng. Observera kommentarerna som föregår varje metod.

En HTTP-slutpunkt:

  • Är en målbar URL i webbprogrammet, till exempel https://localhost:5001/HelloWorld.
  • Kombinerar:
    • Protokollet som används: HTTPS.
    • Nätverksplatsen för webbservern, inklusive TCP-porten: localhost:5001.
    • Mål-URI: HelloWorld.

Den första kommentaren anger att detta är en HTTP GET-metod som anropas genom att lägga till /HelloWorld/ till bas-URL:en.

Den andra kommentaren anger en HTTP GET--metod som anropas genom att lägga till /HelloWorld/Welcome/ till URL:en. Senare i självstudien används scaffoldmotor för att generera HTTP POST-metoder som uppdaterar data.

Kör appen utan felsökningsprogrammet genom att trycka på Ctrl+F5.

Lägg till /HelloWorld till sökvägen i adressfältet. Metoden Index returnerar en sträng.

webbläsarfönster som visar ett appsvar på Det här är min standardåtgärd

MVC anropar kontrollantklasser och åtgärdsmetoderna i dem, beroende på den inkommande URL:en. Standardlogik för URL-routning som används av MVC använder ett format som det här för att avgöra vilken kod som ska anropas:

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

Routningsformatet anges i filen Program.cs.

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

När du bläddrar till appen och inte anger några URL-segment, används som standard kontrollanten "Home" och "Index"-metoden som anges på mallraden som är markerad ovan. I föregående URL-segment:

  • Det första URL-segmentet avgör vilken kontrollantklass som ska köras. Så localhost:5001/HelloWorld mappar till klassen HelloWorld Controller.
  • Den andra delen av URL-segmentet avgör åtgärdsmetoden för klassen. Så localhost:5001/HelloWorld/Index gör att Index-metoden i klassen HelloWorldController körs. Observera att du bara behövde bläddra till localhost:5001/HelloWorld och att metoden Index anropades som standard. Index är standardmetoden som anropas på en kontrollant om ett metodnamn inte uttryckligen anges.
  • Den tredje delen av URL-segmentet ( id) är för routningsdata. Routningsdata förklaras senare i handledningen.

Navigera till: https://localhost:{PORT}/HelloWorld/Welcome. Ersätt {PORT} med portnumret.

Metoden Welcome kör och returnerar strängen This is the Welcome action method.... För den här URL:en är kontrollanten HelloWorld och Welcome är åtgärdsmetoden. Du har inte använt [Parameters] del av URL:en ännu.

webbläsarfönster som visar ett applikationssvar på Det här är Välkommen-åtgärdsmetoden

Ändra koden för att skicka viss parameterinformation från URL:en till kontrollanten. Till exempel /HelloWorld/Welcome?name=Rick&numtimes=4.

Ändra metoden Welcome så att den innehåller två parametrar som visas i följande kod.

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

Föregående kod:

  • Använder funktionen C# optional-parameter för att ange att parametern numTimes som standard är 1 om inget värde skickas för parametern.
  • Använder HtmlEncoder.Default.Encode för att skydda appen mot skadliga indata, till exempel via JavaScript.
  • Använder interpolerade strängar i $"Hello {name}, NumTimes is: {numTimes}".

Kör appen och bläddra till: https://localhost:{PORT}/HelloWorld/Welcome?name=Rick&numtimes=4. Ersätt {PORT} med portnumret.

Prova olika värden för name och numtimes i URL:en. MVC-modellbindningen systemet mappar automatiskt de namngivna parametrarna från frågesträngen till parametrar i metoden. Mer information finns i avsnittet Modellbindning.

Webbläsarfönster som visar ett programsvar från Hello Rick är NumTimes: 4

I föregående bild:

  • URL-segmentet Parameters används inte.
  • Parametrarna name och numTimes skickas i frågesträngen.
  • ? (frågetecken) i ovanstående URL är en avgränsare och frågesträngen följer.
  • Tecknet & separerar fält/värde-par.

Ersätt metoden Welcome med följande kod:

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

Kör appen och ange följande URL: https://localhost:{PORT}/HelloWorld/Welcome/3?name=Rick

I föregående URL:

  • Det tredje URL-segmentet matchade routningsparametern id.
  • Metoden Welcome innehåller en parameter id som matchade URL-mallen i metoden MapControllerRoute.
  • Den avslutande ? startar frågesträngen.
app.MapControllerRoute(
    name: "default",
    pattern: "{controller=Home}/{action=Index}/{id?}");

I föregående exempel:

  • Det tredje URL-segmentet matchade routningsparametern id.
  • Metoden Welcome innehåller en parameter id som matchade URL-mallen i metoden MapControllerRoute.
  • Den avslutande ? (i id?) anger att parametern id är valfri.

Arkitekturmönstret Model-View-Controller (MVC) separerar en app i tre huvudkomponenter: Model, View och Controller. MVC-mönstret hjälper dig att skapa appar som är mer testbara och enklare att uppdatera än traditionella monolitiska appar.

MVC-baserade appar innehåller:

  • Models: Klasser som representerar appens data. Modellklasserna använder valideringslogik för att framtvinga affärsregler för dessa data. Vanligtvis hämtar och lagrar modellobjekt modelltillstånd i en databas. I denna handledning hämtar en Movie-modell filmdata från en databas och tillhandahåller den till visningen eller uppdaterar den. Uppdaterade data skrivs till en databas.
  • Views: Vyer är de komponenter som visar appens användargränssnitt (UI). I allmänhet visar det här användargränssnittet modelldata.
  • Controllers: Klasser som:
    • Hantera webbläsarbegäranden.
    • Hämta modelldata.
    • Mallarna för samtalsvy som returnerar ett svar.

I en MVC-app visar vyn endast information. Kontrollanten hanterar och svarar på användarindata och interaktion. Kontrollanten hanterar till exempel URL-segment och frågesträngsvärden och skickar dessa värden till modellen. Modellen kan använda dessa värden för att fråga databasen. Till exempel:

  • https://localhost:5001/Home/Privacy: specificerar kontrollern Home och åtgärden Privacy.
  • https://localhost:5001/Movies/Edit/5: är en begäran om att redigera filmen med ID=5 med hjälp av Movies kontrollanten och åtgärden Edit, som beskrivs senare i självstudien.

Routningsdata förklaras senare i handledningen.

MVC-arkitekturmönstret separerar en app i tre huvudgrupper med komponenter: modeller, vyer och styrenheter. Det här mönstret hjälper till att få en uppdelning av problem: Användargränssnittslogik hör hemma i vyn. Indatalogik hör hemma i kontrollanten. Affärslogik hör hemma i modellen. Den här separationen hjälper till att hantera komplexiteten när du skapar en app, eftersom den möjliggör arbete på en aspekt av implementeringen i taget utan att påverka koden för en annan. Du kan till exempel arbeta med visningskoden utan att vara beroende av affärslogiken.

De här begreppen introduceras och demonstreras i den här självstudieserien när du skapar en filmapp. MVC-projektet innehåller mappar för Controllers och Views.

Lägga till en kontrollant

I Solution Explorer, högerklicka på Controllers > , Lägg till > Controller.

Solution Explorer högerklickar du på Controllers > Lägg till > Controller

I dialogrutan Lägg till nytt byggnadsgenererat objekt , välj MVC-styrenhet – tom>Lägg till.

Lägg till MVC-styrenhet

I dialogrutan Lägg till nytt objekt – MvcMovie anger du HelloWorldController.cs och väljer Lägg till.

Ersätt innehållet i Controllers/HelloWorldController.cs med följande kod:

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

Varje public-metod i en kontrollant kan anropas som en HTTP-slutpunkt. I exemplet ovan returnerar båda metoderna en sträng. Observera kommentarerna som föregår varje metod.

En HTTP-slutpunkt:

  • Är en målbar URL i webbprogrammet, till exempel https://localhost:5001/HelloWorld.
  • Kombinerar:
    • Protokollet som används: HTTPS.
    • Nätverksplatsen för webbservern, inklusive TCP-porten: localhost:5001.
    • Mål-URI: HelloWorld.

Den första kommentaren anger att detta är en HTTP GET-metod som anropas genom att lägga till /HelloWorld/ till bas-URL:en.

Den andra kommentaren anger en HTTP GET--metod som anropas genom att lägga till /HelloWorld/Welcome/ till URL:en. Senare i självstudien används scaffoldmotor för att generera HTTP POST-metoder som uppdaterar data.

Kör appen utan felsökningsprogrammet genom att trycka på Ctrl+F5.

Lägg till /HelloWorld till sökvägen i adressfältet. Metoden Index returnerar en sträng.

webbläsarfönster som visar ett appsvar på Det här är min standardåtgärd

MVC anropar kontrollantklasser och åtgärdsmetoderna i dem, beroende på den inkommande URL:en. Standardlogik för URL-routning som används av MVC använder ett format som det här för att avgöra vilken kod som ska anropas:

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

Routningsformatet anges i filen Program.cs.

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

När du bläddrar till appen och inte anger några URL-segment, används som standard kontrollanten "Home" och "Index"-metoden som anges på mallraden som är markerad ovan. I föregående URL-segment:

  • Det första URL-segmentet avgör vilken kontrollantklass som ska köras. Så localhost:5001/HelloWorld mappar till klassen HelloWorld Controller.
  • Den andra delen av URL-segmentet avgör åtgärdsmetoden för klassen. Så localhost:5001/HelloWorld/Index gör att Index-metoden i klassen HelloWorldController körs. Observera att du bara behövde bläddra till localhost:5001/HelloWorld och att metoden Index anropades som standard. Index är standardmetoden som anropas på en kontrollant om ett metodnamn inte uttryckligen anges.
  • Den tredje delen av URL-segmentet ( id) är för routningsdata. Routningsdata förklaras senare i handledningen.

Navigera till: https://localhost:{PORT}/HelloWorld/Welcome. Ersätt {PORT} med portnumret.

Metoden Welcome kör och returnerar strängen This is the Welcome action method.... För den här URL:en är kontrollanten HelloWorld och Welcome är åtgärdsmetoden. Du har inte använt [Parameters] del av URL:en ännu.

webbläsarfönster som visar ett applikationssvar på Det här är Välkommen-åtgärdsmetoden

Ändra koden för att skicka viss parameterinformation från URL:en till kontrollanten. Till exempel /HelloWorld/Welcome?name=Rick&numtimes=4.

Ändra metoden Welcome så att den innehåller två parametrar som visas i följande kod.

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

Föregående kod:

  • Använder funktionen C# optional-parameter för att ange att parametern numTimes som standard är 1 om inget värde skickas för parametern.
  • Använder HtmlEncoder.Default.Encode för att skydda appen mot skadliga indata, till exempel via JavaScript.
  • Använder interpolerade strängar i $"Hello {name}, NumTimes is: {numTimes}".

Kör appen och bläddra till: https://localhost:{PORT}/HelloWorld/Welcome?name=Rick&numtimes=4. Ersätt {PORT} med portnumret.

Prova olika värden för name och numtimes i URL:en. MVC-modellbindningen systemet mappar automatiskt de namngivna parametrarna från frågesträngen till parametrar i metoden. Mer information finns i avsnittet Modellbindning.

Webbläsarfönster som visar ett programsvar från Hello Rick är NumTimes: 4

I föregående bild:

  • URL-segmentet Parameters används inte.
  • Parametrarna name och numTimes skickas i frågesträngen.
  • ? (frågetecken) i ovanstående URL är en avgränsare och frågesträngen följer.
  • Tecknet & separerar fält/värde-par.

Ersätt metoden Welcome med följande kod:

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

Kör appen och ange följande URL: https://localhost:{PORT}/HelloWorld/Welcome/3?name=Rick

I föregående URL:

  • Det tredje URL-segmentet matchade routningsparametern id.
  • Metoden Welcome innehåller en parameter id som matchade URL-mallen i metoden MapControllerRoute.
  • Den avslutande ? startar frågesträngen.
app.MapControllerRoute(
    name: "default",
    pattern: "{controller=Home}/{action=Index}/{id?}");

I föregående exempel:

  • Det tredje URL-segmentet matchade routningsparametern id.
  • Metoden Welcome innehåller en parameter id som matchade URL-mallen i metoden MapControllerRoute.
  • Den avslutande ? (i id?) anger att parametern id är valfri.

Arkitekturmönstret Model-View-Controller (MVC) separerar en app i tre huvudkomponenter: Model, View och Controller. MVC-mönstret hjälper dig att skapa appar som är mer testbara och enklare att uppdatera än traditionella monolitiska appar.

MVC-baserade appar innehåller:

  • Models: Klasser som representerar appens data. Modellklasserna använder valideringslogik för att framtvinga affärsregler för dessa data. Vanligtvis hämtar och lagrar modellobjekt modelltillstånd i en databas. I denna handledning hämtar en Movie-modell filmdata från en databas och tillhandahåller den till visningen eller uppdaterar den. Uppdaterade data skrivs till en databas.
  • Views: Vyer är de komponenter som visar appens användargränssnitt (UI). I allmänhet visar det här användargränssnittet modelldata.
  • Controllers: Klasser som:
    • Hantera webbläsarbegäranden.
    • Hämta modelldata.
    • Mallarna för samtalsvy som returnerar ett svar.

I en MVC-app visar vyn endast information. Kontrollanten hanterar och svarar på användarindata och interaktion. Kontrollanten hanterar till exempel URL-segment och frågesträngsvärden och skickar dessa värden till modellen. Modellen kan använda dessa värden för att fråga databasen. Till exempel:

  • https://localhost:5001/Home/Privacy: specificerar kontrollern Home och åtgärden Privacy.
  • https://localhost:5001/Movies/Edit/5: är en begäran om att redigera filmen med ID=5 med hjälp av Movies kontrollanten och åtgärden Edit, som beskrivs senare i självstudien.

Routningsdata förklaras senare i handledningen.

MVC-arkitekturmönstret separerar en app i tre huvudgrupper med komponenter: modeller, vyer och styrenheter. Det här mönstret hjälper till att få en uppdelning av problem: Användargränssnittslogik hör hemma i vyn. Indatalogik hör hemma i kontrollanten. Affärslogik hör hemma i modellen. Den här separationen hjälper till att hantera komplexiteten när du skapar en app, eftersom den möjliggör arbete på en aspekt av implementeringen i taget utan att påverka koden för en annan. Du kan till exempel arbeta med visningskoden utan att vara beroende av affärslogiken.

De här begreppen introduceras och demonstreras i den här självstudieserien när du skapar en filmapp. MVC-projektet innehåller mappar för Controllers och Views.

Lägga till en kontrollant

I Solution Explorer, högerklicka på Controllers > , Lägg till > Controller.

Solution Explorer högerklickar du på Controllers > Lägg till > Controller

I dialogrutan Lägg till nytt byggnadsgenererat objekt , välj MVC-styrenhet – tom>Lägg till.

Lägg till MVC-styrenhet

I dialogrutan Lägg till nytt objekt – MvcMovie anger du HelloWorldController.cs och väljer Lägg till.

Ersätt innehållet i Controllers/HelloWorldController.cs med följande kod:

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

Varje public-metod i en kontrollant kan anropas som en HTTP-slutpunkt. I exemplet ovan returnerar båda metoderna en sträng. Observera kommentarerna som föregår varje metod.

En HTTP-slutpunkt:

  • Är en målbar URL i webbprogrammet, till exempel https://localhost:5001/HelloWorld.
  • Kombinerar:
    • Protokollet som används: HTTPS.
    • Nätverksplatsen för webbservern, inklusive TCP-porten: localhost:5001.
    • Mål-URI: HelloWorld.

Den första kommentaren anger att detta är en HTTP GET-metod som anropas genom att lägga till /HelloWorld/ till bas-URL:en.

Den andra kommentaren anger en HTTP GET--metod som anropas genom att lägga till /HelloWorld/Welcome/ till URL:en. Senare i självstudien används scaffoldmotor för att generera HTTP POST-metoder som uppdaterar data.

Kör appen utan felsökningsprogrammet.

Lägg till "HelloWorld" till sökvägen i adressfältet. Metoden Index returnerar en sträng.

webbläsarfönster som visar ett appsvar på Det här är min standardåtgärd

MVC anropar kontrollantklasser och åtgärdsmetoderna i dem, beroende på den inkommande URL:en. Standardlogik för URL-routning som används av MVC använder ett format som det här för att avgöra vilken kod som ska anropas:

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

Routningsformatet anges i filen Program.cs.

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

När du bläddrar till appen och inte anger några URL-segment, används som standard kontrollanten "Home" och "Index"-metoden som anges på mallraden som är markerad ovan. I föregående URL-segment:

  • Det första URL-segmentet avgör vilken kontrollantklass som ska köras. Så localhost:5001/HelloWorld mappar till klassen HelloWorld Controller.
  • Den andra delen av URL-segmentet avgör åtgärdsmetoden för klassen. Så localhost:5001/HelloWorld/Index gör att Index-metoden i klassen HelloWorldController körs. Observera att du bara behövde bläddra till localhost:5001/HelloWorld och att metoden Index anropades som standard. Index är standardmetoden som anropas på en kontrollant om ett metodnamn inte uttryckligen anges.
  • Den tredje delen av URL-segmentet ( id) är för routningsdata. Routningsdata förklaras senare i handledningen.

Navigera till: https://localhost:{PORT}/HelloWorld/Welcome. Ersätt {PORT} med portnumret.

Metoden Welcome kör och returnerar strängen This is the Welcome action method.... För den här URL:en är kontrollanten HelloWorld och Welcome är åtgärdsmetoden. Du har inte använt [Parameters] del av URL:en ännu.

webbläsarfönster som visar ett applikationssvar på Det här är Välkommen-åtgärdsmetoden

Ändra koden för att skicka viss parameterinformation från URL:en till kontrollanten. Till exempel /HelloWorld/Welcome?name=Rick&numtimes=4.

Ändra metoden Welcome så att den innehåller två parametrar som visas i följande kod.

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

Föregående kod:

  • Använder funktionen C# optional-parameter för att ange att parametern numTimes som standard är 1 om inget värde skickas för parametern.
  • Använder HtmlEncoder.Default.Encode för att skydda appen mot skadliga indata, till exempel via JavaScript.
  • Använder interpolerade strängar i $"Hello {name}, NumTimes is: {numTimes}".

Kör appen och bläddra till: https://localhost:{PORT}/HelloWorld/Welcome?name=Rick&numtimes=4. Ersätt {PORT} med portnumret.

Prova olika värden för name och numtimes i URL:en. MVC-modellbindningen systemet mappar automatiskt de namngivna parametrarna från frågesträngen till parametrar i metoden. Mer information finns i avsnittet Modellbindning.

Webbläsarfönster som visar ett programsvar från Hello Rick är NumTimes: 4

I föregående bild:

  • URL-segmentet Parameters används inte.
  • Parametrarna name och numTimes skickas i frågesträngen.
  • ? (frågetecken) i ovanstående URL är en avgränsare och frågesträngen följer.
  • Tecknet & separerar fält/värde-par.

Ersätt metoden Welcome med följande kod:

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

Kör appen och ange följande URL: https://localhost:{PORT}/HelloWorld/Welcome/3?name=Rick

I föregående URL:

  • Det tredje URL-segmentet matchade routningsparametern id.
  • Metoden Welcome innehåller en parameter id som matchade URL-mallen i metoden MapControllerRoute.
  • Den avslutande ? startar frågesträngen.
app.MapControllerRoute(
    name: "default",
    pattern: "{controller=Home}/{action=Index}/{id?}");

I föregående exempel:

  • Det tredje URL-segmentet matchade routningsparametern id.
  • Metoden Welcome innehåller en parameter id som matchade URL-mallen i metoden MapControllerRoute.
  • Den avslutande ? (i id?) anger att parametern id är valfri.

Arkitekturmönstret Model-View-Controller (MVC) separerar en app i tre huvudkomponenter: Model, View och Controller. MVC-mönstret hjälper dig att skapa appar som är mer testbara och enklare att uppdatera än traditionella monolitiska appar.

MVC-baserade appar innehåller:

  • Models: Klasser som representerar appens data. Modellklasserna använder valideringslogik för att framtvinga affärsregler för dessa data. Vanligtvis hämtar och lagrar modellobjekt modelltillstånd i en databas. I denna handledning hämtar en Movie-modell filmdata från en databas och tillhandahåller den till visningen eller uppdaterar den. Uppdaterade data skrivs till en databas.
  • Views: Vyer är de komponenter som visar appens användargränssnitt (UI). I allmänhet visar det här användargränssnittet modelldata.
  • Controllers: Klasser som:
    • Hantera webbläsarbegäranden.
    • Hämta modelldata.
    • Mallarna för samtalsvy som returnerar ett svar.

I en MVC-app visar vyn endast information. Kontrollanten hanterar och svarar på användarindata och interaktion. Kontrollanten hanterar till exempel URL-segment och frågesträngsvärden och skickar dessa värden till modellen. Modellen kan använda dessa värden för att fråga databasen. Till exempel:

  • https://localhost:5001/Home/Privacy: specificerar kontrollern Home och åtgärden Privacy.
  • https://localhost:5001/Movies/Edit/5: är en begäran om att redigera filmen med ID=5 med hjälp av Movies kontrollanten och åtgärden Edit, som beskrivs senare i självstudien.

Routningsdata förklaras senare i handledningen.

MVC-arkitekturmönstret separerar en app i tre huvudgrupper med komponenter: modeller, vyer och styrenheter. Det här mönstret hjälper till att få en uppdelning av problem: Användargränssnittslogik hör hemma i vyn. Indatalogik hör hemma i kontrollanten. Affärslogik hör hemma i modellen. Den här separationen hjälper till att hantera komplexiteten när du skapar en app, eftersom den möjliggör arbete på en aspekt av implementeringen i taget utan att påverka koden för en annan. Du kan till exempel arbeta med visningskoden utan att vara beroende av affärslogiken.

De här begreppen introduceras och demonstreras i den här självstudieserien när du skapar en filmapp. MVC-projektet innehåller mappar för Controllers och Views.

Lägga till en kontrollant

I Solution Explorerhögerklickar du på Controllers > Lägg till > Controller.

Solution Explorer högerklickar du på Controllers > Lägg till > Controller

I dialogrutan Lägg till ställning väljer du MVC-kontroller – Tom.

Lägg till MVC-styrenhet och ge den namnet

I dialogrutan Lägg till nytt objekt – MvcMovieanger du HelloWorldController.cs och väljer Lägg till.

Ersätt innehållet i Controllers/HelloWorldController.cs med följande:

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

Varje public-metod i en kontrollant kan anropas som en HTTP-slutpunkt. I exemplet ovan returnerar båda metoderna en sträng. Observera kommentarerna som föregår varje metod.

En HTTP-slutpunkt:

  • Är en målbar URL i webbprogrammet, till exempel https://localhost:5001/HelloWorld.
  • Kombinerar:
    • Protokollet som används: HTTPS.
    • Nätverksplatsen för webbservern, inklusive TCP-porten: localhost:5001.
    • Mål-URI: HelloWorld.

Den första kommentaren anger att detta är en HTTP GET-metod som anropas genom att lägga till /HelloWorld/ till bas-URL:en.

Den andra kommentaren anger en HTTP GET--metod som anropas genom att lägga till /HelloWorld/Welcome/ till URL:en. Senare i självstudien används scaffoldmotor för att generera HTTP POST-metoder som uppdaterar data.

Kör appen utan felsökningsprogrammet.

Lägg till "HelloWorld" till sökvägen i adressfältet. Metoden Index returnerar en sträng.

webbläsarfönster som visar ett appsvar på Det här är min standardåtgärd

MVC anropar kontrollantklasser och åtgärdsmetoderna i dem, beroende på den inkommande URL:en. Standardlogik för URL-routning som används av MVC använder ett format som det här för att avgöra vilken kod som ska anropas:

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

Routningsformatet anges i metoden Configure i Startup.cs fil.

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

När du bläddrar till appen och inte anger några URL-segment, används som standard kontrollanten "Home" och "Index"-metoden som anges på mallraden som är markerad ovan. I föregående URL-segment:

  • Det första URL-segmentet avgör vilken kontrollantklass som ska köras. Så localhost:5001/HelloWorld mappar till klassen HelloWorldController.
  • Den andra delen av URL-segmentet avgör åtgärdsmetoden för klassen. Så localhost:5001/HelloWorld/Index gör att Index-metoden i klassen HelloWorldController körs. Observera att du bara behövde bläddra till localhost:5001/HelloWorld och att metoden Index anropades som standard. Index är standardmetoden som anropas på en kontrollant om ett metodnamn inte uttryckligen anges.
  • Den tredje delen av URL-segmentet ( id) är för routningsdata. Routningsdata förklaras senare i handledningen.

Navigera till: https://localhost:{PORT}/HelloWorld/Welcome. Ersätt {PORT} med portnumret.

Metoden Welcome kör och returnerar strängen This is the Welcome action method.... För den här URL:en är kontrollanten HelloWorld och Welcome är åtgärdsmetoden. Du har inte använt [Parameters] del av URL:en ännu.

webbläsarfönster som visar ett applikationssvar på Det här är Välkommen-åtgärdsmetoden

Ändra koden för att skicka viss parameterinformation från URL:en till kontrollanten. Till exempel /HelloWorld/Welcome?name=Rick&numtimes=4.

Ändra metoden Welcome så att den innehåller två parametrar som visas i följande kod.

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

Föregående kod:

  • Använder funktionen C# optional-parameter för att ange att parametern numTimes som standard är 1 om inget värde skickas för parametern.
  • Använder HtmlEncoder.Default.Encode för att skydda appen mot skadliga indata, till exempel via JavaScript.
  • Använder interpolerade strängar i $"Hello {name}, NumTimes is: {numTimes}".

Kör appen och bläddra till: https://localhost:{PORT}/HelloWorld/Welcome?name=Rick&numtimes=4. Ersätt {PORT} med portnumret.

Prova olika värden för name och numtimes i URL:en. MVC-modellbindningen systemet mappar automatiskt de namngivna parametrarna från frågesträngen till parametrar i metoden. Mer information finns i avsnittet Modellbindning.

Webbläsarfönster som visar ett programsvar från Hello Rick är NumTimes: 4

I föregående bild:

  • URL-segmentet Parameters används inte.
  • Parametrarna name och numTimes skickas i frågesträngen.
  • ? (frågetecken) i ovanstående URL är en avgränsare och frågesträngen följer.
  • Tecknet & separerar fält/värde-par.

Ersätt metoden Welcome med följande kod:

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

Kör appen och ange följande URL: https://localhost:{PORT}/HelloWorld/Welcome/3?name=Rick

I föregående URL:

  • Det tredje URL-segmentet matchade routningsparametern id.
  • Metoden Welcome innehåller en parameter id som matchade URL-mallen i metoden MapControllerRoute.
  • Den avslutande ? startar frågesträngen.
app.UseEndpoints(endpoints =>
{
    endpoints.MapControllerRoute(
        name: "default",
        pattern: "{controller=Home}/{action=Index}/{id?}");
});

I föregående exempel:

  • Det tredje URL-segmentet matchade routningsparametern id.
  • Metoden Welcome innehåller en parameter id som matchade URL-mallen i metoden MapControllerRoute.
  • Den avslutande ? (i id?) anger att parametern id är valfri.