Delen via

Zelfstudie: Aan de slag met Razor Pagina's in ASP.NET Core

  • Artikel

Notitie

Dit is niet de nieuwste versie van dit artikel. Zie de .NET 9-versie van dit artikelvoor de huidige release.

Waarschuwing

Deze versie van ASP.NET Core wordt niet meer ondersteund. Zie de .NET- en .NET Core-ondersteuningsbeleidvoor meer informatie. Zie de .NET 9-versie van dit artikelvoor de huidige release.

Belangrijk

Deze informatie heeft betrekking op een pre-releaseproduct dat aanzienlijk kan worden gewijzigd voordat het commercieel wordt uitgebracht. Microsoft geeft geen garanties, uitdrukkelijk of impliciet, met betrekking tot de informatie die hier wordt verstrekt.

Zie de .NET 9-versie van dit artikelvoor de huidige release.

Door Rick Anderson

Dit is de eerste zelfstudie van een reeks die de basisbeginselen leert van het bouwen van een ASP.NET Core Razor Pages-web-app.

Zie Inleiding tot Razor Pagina'svoor een geavanceerdere inleiding bedoeld voor ontwikkelaars die al vertrouwd zijn met controllers en weergaven. Zie voor een video-inleiding Entity Framework Core voor beginners.

Als u nieuw bent in de ontwikkeling van ASP.NET Core en niet zeker weet welke webgebruiksinterface voor ASP.NET Core het beste bij uw behoeften past, zie Een ASP.NET Core UI-kiezen.

Aan het einde van deze zelfstudie hebt u een Razor Pages-web-app waarmee een database met films wordt beheerd.

Home of Indexpagina

Voorwaarden

Een Razor Pages-web-app maken

  • Start Visual Studio en selecteer Nieuw project.

  • Selecteer in het dialoogvenster Een nieuw project makenASP.NET Core Web App (Razor Pagina's)>Volgende.

  • Voer in het dialoogvenster Uw nieuwe project configurerenRazorPagesMovie in voor projectnaam. Het is belangrijk om het project een naam te geven RazorPagesMovie, inclusief overeenkomende hoofdletters, zodat de naamruimten overeenkomen wanneer u voorbeeldcode kopieert en plakt.

  • Selecteer Volgende.

  • In het dialoogvenster Aanvullende informatie:

    • Selecteer .NET 9.0.
    • Controleer: Gebruik geen instructies op het hoogste niveau is uitgeschakeld.

  • Selecteer maken.

    Aanvullende informatie

    Het volgende startersproject wordt gemaakt:

    Solution Explorer

Zie Een nieuw project maken in Visual Studiovoor alternatieve methoden voor het maken van het project.

De app uitvoeren

Selecteer RazorPagesMovie in Solution Explorer-en druk vervolgens op Ctrl+F5- om de app uit te voeren zonder het foutopsporingsprogramma.

Visual Studio geeft het volgende dialoogvenster weer wanneer een project nog niet is geconfigureerd voor het gebruik van SSL:

Dit project is geconfigureerd voor het gebruik van SSL. Als u SSL-waarschuwingen in de browser wilt voorkomen, kunt u ervoor kiezen om het zelfondertekende certificaat te vertrouwen dat IIS Express heeft gegenereerd. Wilt u het IIS Express SSL-certificaat vertrouwen?

Selecteer Ja als u het IIS Express SSL-certificaat vertrouwt.

Het volgende dialoogvenster wordt weergegeven:

beveiligingswaarschuwingsdialoogvenster

Selecteer Ja als u akkoord gaat met het vertrouwen van het ontwikkelingscertificaat.

Zie Firefox SEC_ERROR_INADEQUATE_KEY_USAGE certificaatfoutvoor meer informatie over het vertrouwen van de Firefox-browser.

Visual Studio:

  • Hiermee wordt de app uitgevoerd, waarmee de Kestrel-server wordt gestart.
  • Hiermee start u de standaardbrowser op https://localhost:<port>, waarin de gebruikersinterface van de apps wordt weergegeven. <port> is de willekeurige poort die wordt toegewezen toen de app werd gemaakt.

Sluit het browservenster.

De projectbestanden onderzoeken

De volgende secties bevatten een overzicht van de hoofdprojectmappen en bestanden waarmee u in latere zelfstudies gaat werken.

Paginamap

Bevat Razor pagina's en bijbehorende bestanden. Elke Razor pagina is een paar bestanden:

  • Een .cshtml-bestand met HTML-markeringen met C#-code met behulp van Razor syntaxis.
  • Een .cshtml.cs-bestand met C#-code waarmee paginagebeurtenissen worden verwerkt.

Ondersteunende bestanden hebben namen die beginnen met een onderstrepingsteken. Het bestand _Layout.cshtml configureert bijvoorbeeld UI-elementen die voor alle pagina's gebruikelijk zijn. _Layout.cshtml stelt het navigatiemenu boven aan de pagina en de copyrightmelding onder aan de pagina in. Zie Indeling in ASP.NET Corevoor meer informatie.

wwwroot-folder

Bevat statische assets, zoals HTML-bestanden, JavaScript-bestanden en CSS-bestanden. Zie Statische bestanden in ASP.NET Corevoor meer informatie.

appsettings.json

Bevat configuratiegegevens, zoals verbindingsreeksen. Zie Configuratie in ASP.NET Corevoor meer informatie.

Program.cs

Bevat de volgende code:

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.
builder.Services.AddRazorPages();

var app = builder.Build();

// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Error");
    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
    app.UseHsts();
}

app.UseHttpsRedirection();

app.UseRouting();

app.UseAuthorization();

app.MapStaticAssets();
app.MapRazorPages();

app.Run();

Met de volgende regels code in dit bestand maakt u een WebApplicationBuilder met vooraf geconfigureerde standaardinstellingen, voegt u ondersteuning voor Razor Pagina's toe aan de afhankelijkheidsinjectiecontainer (DI)en bouwt u de app.

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.
builder.Services.AddRazorPages();

var app = builder.Build();

De uitzonderingspagina voor ontwikkelaars is standaard ingeschakeld en biedt nuttige informatie over uitzonderingen. Productie-apps mogen niet worden uitgevoerd in de ontwikkelingsmodus omdat de uitzonderingspagina voor ontwikkelaars gevoelige informatie kan lekken.

Met de volgende code wordt het uitzonderingseindpunt ingesteld op /Error en wordt HSTS - (HTTP Strict Transport Security Protocol) ingeschakeld wanneer de app niet wordt uitgevoerd in de ontwikkelmodus:

// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Error");
    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
    app.UseHsts();
}

De voorgaande code wordt bijvoorbeeld uitgevoerd wanneer de app zich in de productie- of testmodus bevindt. Zie Meerdere omgevingen gebruiken in ASP.NET Corevoor meer informatie.

De volgende code schakelt verschillende soorten middlewarein:

  • app.UseHttpsRedirection();: stuurt HTTP-aanvragen om naar HTTPS.
  • app.UseRouting();: hiermee voegt u routekoppeling toe aan de middleware-pijplijn. Zie Routering in ASP.NET Corevoor meer informatie.
  • app.UseAuthorization();: geeft een gebruiker toestemming om toegang te krijgen tot beveiligde resources. Deze app gebruikt geen autorisatie, daarom kan deze regel worden verwijderd.
  • app.MapRazorPages();: Configureert endpoint-routing voor Razor pagina's.
  • app.MapStaticAssets();: optimaliseer de levering van statische assets in een app, zoals HTML, CSS, afbeeldingen en JavaScript. Zie Wat is er nieuw in ASP.NET Core 9.0voor meer informatie.
  • app.Run();: hiermee wordt de app uitgevoerd.

Problemen oplossen met het voltooide voorbeeld

Als u een probleem ondervindt dat u niet kunt oplossen, vergelijkt u de code met het voltooide project. Voltooid project weergeven of downloaden (hoe te downloaden).

Volgende stappen

Volgende: Een model toevoegen

Dit is de eerste zelfstudie van een reeks die de basisbeginselen leert van het bouwen van een ASP.NET Core Razor Pages-web-app.

Zie Inleiding tot Razor Pagina'svoor een meer geavanceerde inleiding voor ontwikkelaars die bekend zijn met controllers en weergaven. Zie voor een video-inleiding Entity Framework Core voor beginners.

Als u nieuw bent in de ontwikkeling van ASP.NET Core en niet zeker weet welke ASP.NET Core-webgebruikersinterfaceoplossing het beste aansluit bij uw behoeften, zie dan Een ASP.NET Core UIkiezen.

Aan het einde van deze zelfstudie hebt u een Razor Pages-web-app waarmee een database met films wordt beheerd.

Home of indexpagina

Voorwaarden

Een Razor Pages-web-app maken

  • Start Visual Studio en selecteer Nieuw project.

  • Selecteer in het dialoogvenster Een nieuw project makenASP.NET Core Web App (Razor Pagina's)>Volgende.

  • Voer in het dialoogvenster Configureer uw nieuwe projectRazorPagesMovie in voor de Projectnaam. Het is belangrijk om het project een naam te geven RazorPagesMovie, inclusief overeenkomende hoofdletters, zodat de naamruimten overeenkomen wanneer u voorbeeldcode kopieert en plakt.

  • Selecteer Volgende.

  • In het dialoogvenster Aanvullende informatie:

    • Selecteer .NET 8.0 (Langetermijnondersteuning).
    • Controleer: Gebruik geen instructies op het hoogste niveau is niet aangevinkt.

  • Selecteer Maak.

    Aanvullende informatie

    Het volgende startersproject wordt gemaakt:

    Solution Explorer

Zie Een nieuw project maken in Visual Studiovoor alternatieve methoden voor het maken van het project.

De app uitvoeren

Selecteer RazorPagesMovie in Solution Explorer-en druk vervolgens op Ctrl+F5- om de app uit te voeren zonder het foutopsporingsprogramma.

Visual Studio geeft het volgende dialoogvenster weer wanneer een project nog niet is geconfigureerd voor het gebruik van SSL:

Dit project is geconfigureerd voor het gebruik van SSL. Als u SSL-waarschuwingen in de browser wilt voorkomen, kunt u ervoor kiezen om het zelfondertekende certificaat te vertrouwen dat IIS Express heeft gegenereerd. Wilt u het IIS Express SSL-certificaat vertrouwen?

Selecteer Ja als u het IIS Express SSL-certificaat vertrouwt.

Het volgende dialoogvenster wordt weergegeven:

beveiligingswaarschuwingsdialoogvenster

Selecteer Ja als u akkoord gaat met het vertrouwen van het ontwikkelingscertificaat.

Zie Firefox SEC_ERROR_INADEQUATE_KEY_USAGE certificaatfoutvoor meer informatie over het vertrouwen van de Firefox-browser.

Visual Studio:

  • Hiermee wordt de app uitgevoerd, waarmee de server Kestrelwordt gestart.
  • Hiermee start u de standaardbrowser op https://localhost:<port>, waarin de gebruikersinterface van de apps wordt weergegeven. <port> is de willekeurige poort die wordt toegewezen toen de app werd gemaakt.

Sluit het browservenster.

De projectbestanden onderzoeken

De volgende secties bevatten een overzicht van de hoofdprojectmappen en bestanden waarmee u in latere zelfstudies gaat werken.

Map Pagina's

Bevat Razor pagina's en ondersteunende bestanden. Elke Razor pagina is een paar bestanden:

  • Een .cshtml-bestand met HTML-markeringen met C#-code met behulp van Razor syntaxis.
  • Een .cshtml.cs-bestand met C#-code waarmee paginagebeurtenissen worden verwerkt.

Ondersteunende bestanden hebben namen die beginnen met een onderstrepingsteken. Het bestand _Layout.cshtml configureert bijvoorbeeld UI-elementen die voor alle pagina's gebruikelijk zijn. _Layout.cshtml stelt het navigatiemenu bovenaan de pagina en de copyrightmelding onderaan de pagina in. Zie Indeling in ASP.NET Corevoor meer informatie.

wwwroot-folder

Bevat statische assets, zoals HTML-bestanden, JavaScript-bestanden en CSS-bestanden. Zie Statische bestanden in ASP.NET Corevoor meer informatie.

appsettings.json

Bevat configuratiegegevens, zoals verbindingsreeksen. Zie Configuratie in ASP.NET Corevoor meer informatie.

Program.cs

Bevat de volgende code:

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.
builder.Services.AddRazorPages();

var app = builder.Build();

// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Error");
    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
    app.UseHsts();
}

app.UseHttpsRedirection();
app.UseStaticFiles();

app.UseRouting();

app.UseAuthorization();

app.MapRazorPages();

app.Run();

Met de volgende regels code in dit bestand maakt u een WebApplicationBuilder met vooraf geconfigureerde standaardinstellingen, voegt u Razor Pagina's-ondersteuning toe aan de afhankelijkheidsinjectiecontainer (DI)en bouwt u de app:

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.
builder.Services.AddRazorPages();

var app = builder.Build();

De uitzonderingspagina voor ontwikkelaars is standaard ingeschakeld en biedt nuttige informatie over uitzonderingen. Productie-apps mogen niet worden uitgevoerd in de ontwikkelingsmodus omdat de uitzonderingspagina voor ontwikkelaars gevoelige informatie kan lekken.

Met de volgende code wordt het uitzonderingseindpunt ingesteld op /Error en wordt HSTS - (HTTP Strict Transport Security Protocol) ingeschakeld wanneer de app niet wordt uitgevoerd in de ontwikkelmodus:

// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Error");
    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
    app.UseHsts();
}

De voorgaande code wordt bijvoorbeeld uitgevoerd wanneer de app zich in de productie- of testmodus bevindt. Zie Meerdere omgevingen gebruiken in ASP.NET Corevoor meer informatie.

Met de volgende code worden verschillende Middleware-ingeschakeld:

  • app.UseHttpsRedirection();: stuurt HTTP-aanvragen om naar HTTPS.
  • app.UseStaticFiles();: maakt het mogelijk om statische bestanden, zoals HTML, CSS, afbeeldingen en JavaScript, te verwerken. Zie Statische bestanden in ASP.NET Corevoor meer informatie.
  • app.UseRouting();: hiermee voegt u routekoppeling toe aan de middleware-pijplijn. Zie Routering in ASP.NET Core voor meer informatie
  • app.MapRazorPages();: configureert de eindpuntroutering voor Razor-pagina's.
  • app.UseAuthorization();: geeft een gebruiker toestemming om toegang te krijgen tot beveiligde resources. Deze app gebruikt geen autorisatie, daarom kan deze regel worden verwijderd.
  • app.Run();: hiermee wordt de app uitgevoerd.

Problemen oplossen met het voltooide voorbeeld

Als u een probleem ondervindt dat u niet kunt oplossen, vergelijkt u de code met het voltooide project. Voltooid project bekijken of downloaden (hoe te downloaden).

Volgende stappen

Volgende: Een model toevoegen

Dit is de eerste zelfstudie van een reeks die de basisbeginselen leert van het bouwen van een ASP.NET Core Razor Pages-web-app.

Zie Inleiding tot Razor Pagina'svoor een geavanceerdere inleiding gericht op ontwikkelaars die bekend zijn met controllers en views. Zie voor een video-inleiding Entity Framework Core voor beginners.

Als u nieuw bent bij ASP.NET Core-ontwikkeling en niet zeker weet welke ASP.NET Core-webgebruikersinterfaceoplossing het beste aansluit bij uw behoeften, zie Een ASP.NET Core UI kiezen.

Aan het einde van deze zelfstudie hebt u een Razor Pages-web-app waarmee een database met films wordt beheerd.

Home of Indexpagina

Voorwaarden

Een Razor Pages-web-app maken

  • Start Visual Studio en selecteer Een nieuw project maken.

  • Selecteer in het dialoogvenster Een nieuw project makenASP.NET Core Web App>Volgende.

  • Voer in het dialoogvenster Configureer uw nieuwe projectRazorPagesMovie in als Projectnaam. Het is belangrijk om het project een naam te geven RazorPagesMovie, inclusief overeenkomende hoofdletters, zodat de naamruimten overeenkomen wanneer u voorbeeldcode kopieert en plakt.

  • Selecteer Volgende.

  • In het dialoogvenster Aanvullende informatie:

    • Selecteer .NET 7.0 (Standaard Term Ondersteuning).
    • Controleer: Gebruik geen instructies op het hoogste niveau is niet aangevinkt.

  • Selecteer maken.

    Aanvullende informatie

    Het volgende startersproject wordt gemaakt:

    Solution Explorer-

Zie Een nieuw project maken in Visual Studiovoor alternatieve methoden voor het maken van het project.

De app uitvoeren

Selecteer RazorPagesMovie in Solution Explorer-en druk vervolgens op Ctrl+F5- om de app uit te voeren zonder het foutopsporingsprogramma.

Visual Studio geeft het volgende dialoogvenster weer wanneer een project nog niet is geconfigureerd voor het gebruik van SSL:

Dit project is geconfigureerd voor het gebruik van SSL. Als u SSL-waarschuwingen in de browser wilt voorkomen, kunt u ervoor kiezen om het zelfondertekende certificaat te vertrouwen dat IIS Express heeft gegenereerd. Wilt u het IIS Express SSL-certificaat vertrouwen?

Selecteer Ja als u het IIS Express SSL-certificaat vertrouwt.

Het volgende dialoogvenster wordt weergegeven:

beveiligingswaarschuwingsdialoogvenster

Selecteer Ja als u akkoord gaat met het vertrouwen van het ontwikkelingscertificaat.

Zie Firefox SEC_ERROR_INADEQUATE_KEY_USAGE certificaatfoutvoor meer informatie over het vertrouwen van de Firefox-browser.

Visual Studio:

  • Door de app uit te voeren, wordt de Kestrel-servergestart.
  • Hiermee start u de standaardbrowser op https://localhost:<port>, waarin de gebruikersinterface van de apps wordt weergegeven. <port> is de willekeurige poort die wordt toegewezen toen de app werd gemaakt.

Sluit het browservenster.

De projectbestanden onderzoeken

De volgende secties bevatten een overzicht van de hoofdprojectmappen en bestanden waarmee u in latere zelfstudies gaat werken.

Paginamap

Bevat Razor pagina's en ondersteunende bestanden. Elke Razor pagina is een paar bestanden:

  • Een .cshtml-bestand met HTML-markeringen met C#-code met behulp van Razor syntaxis.
  • Een .cshtml.cs-bestand met C#-code waarmee paginagebeurtenissen worden verwerkt.

Ondersteunende bestanden hebben namen die beginnen met een onderstrepingsteken. Het bestand _Layout.cshtml configureert bijvoorbeeld UI-elementen die voor alle pagina's gebruikelijk zijn. _Layout.cshtml stelt het navigatiemenu bovenaan de pagina en de copyrightmelding onderaan de pagina in. Zie Indeling in ASP.NET Corevoor meer informatie.

wwwroot-map

Bevat statische assets, zoals HTML-bestanden, JavaScript-bestanden en CSS-bestanden. Zie Statische bestanden in ASP.NET Corevoor meer informatie.

appsettings.json

Bevat configuratiegegevens, zoals verbindingsreeksen. Zie Configuratie in ASP.NET Corevoor meer informatie.

Program.cs

Bevat de volgende code:

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.
builder.Services.AddRazorPages();

var app = builder.Build();

// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Error");
    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
    app.UseHsts();
}

app.UseHttpsRedirection();
app.UseStaticFiles();

app.UseRouting();

app.UseAuthorization();

app.MapRazorPages();

app.Run();

Met de volgende regels code in dit bestand maakt u een WebApplicationBuilder met vooraf geconfigureerde standaardinstellingen, voegt u ondersteuning voor Razor pagina's toe aan de afhankelijkheidsinjectiecontainer (DI)en bouwt u de app.

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.
builder.Services.AddRazorPages();

var app = builder.Build();

De uitzonderingspagina voor ontwikkelaars is standaard ingeschakeld en biedt nuttige informatie over uitzonderingen. Productie-apps mogen niet worden uitgevoerd in de ontwikkelingsmodus omdat de uitzonderingspagina voor ontwikkelaars gevoelige informatie kan lekken.

Met de volgende code wordt het uitzonderingseindpunt ingesteld op /Error en wordt HSTS - (HTTP Strict Transport Security Protocol) ingeschakeld wanneer de app niet wordt uitgevoerd in de ontwikkelmodus:

// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Error");
    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
    app.UseHsts();
}

De voorgaande code wordt bijvoorbeeld uitgevoerd wanneer de app zich in de productie- of testmodus bevindt. Zie Meerdere omgevingen gebruiken in ASP.NET Corevoor meer informatie.

Met de volgende code worden verschillende Middleware-ingeschakeld:

  • app.UseHttpsRedirection();: stuurt HTTP-aanvragen om naar HTTPS.
  • app.UseStaticFiles();: maakt het mogelijk om statische bestanden, zoals HTML, CSS, afbeeldingen en JavaScript, te verwerken. Zie Statische bestanden in ASP.NET Corevoor meer informatie.
  • app.UseRouting();: hiermee voegt u routekoppeling toe aan de middleware-pijplijn. Zie Routering in ASP.NET Core voor meer informatie
  • app.MapRazorPages();: Hiermee configureert u de eindpuntroutering voor de Razor Pagina's.
  • app.UseAuthorization();: geeft een gebruiker toestemming om toegang te krijgen tot beveiligde resources. Deze app gebruikt geen autorisatie, daarom kan deze regel worden verwijderd.
  • app.Run();: hiermee wordt de app uitgevoerd.

Problemen oplossen met het voltooide voorbeeld

Als u een probleem ondervindt dat u niet kunt oplossen, vergelijkt u de code met het voltooide project. Afgerond project weergeven of downloaden (hoe te downloaden).

Volgende stappen

Volgende: Een model toevoegen

Dit is de eerste zelfstudie van een reeks die de basisbeginselen leert van het bouwen van een ASP.NET Core Razor Pages-web-app.

Zie Inleiding tot Razor Pagina'sals je een meer geavanceerde introductie zoekt, gericht op ontwikkelaars die bekend zijn met controllers en views. Zie voor een video-inleiding Entity Framework Core voor beginners.

Als u nieuw bent in de ontwikkeling van ASP.NET Core en niet zeker weet welke ASP.NET Core web-UI-oplossing het beste aan uw behoeften voldoet, zie dan Een ASP.NET Core UIkiezen.

Aan het einde van de serie hebt u een app waarmee een database met films wordt beheerd.

In deze zelfstudie gaat u het volgende doen:

  • Een Razor Pages-web-app maken.
  • Voer de app uit.
  • Bekijk de projectbestanden.

Aan het einde van deze zelfstudie hebt u een werkende Razor Pages-web-app die u in latere zelfstudies gaat verbeteren.

Home of indexpagina

Voorwaarden

Een Razor Pages-web-app maken

  1. Start Visual Studio 2022 en selecteer Een nieuw project maken.

    Een nieuw project maken vanuit het startvenster

  2. Selecteer in het dialoogvenster Een nieuw project makenASP.NET Core Web Appen selecteer vervolgens Volgende.

    Een ASP.NET Core-web-app maken

  3. Voer in het dialoogvenster Configure your new projectRazorPagesMovie in voor projectnaam. Het is belangrijk om het project een naam te geven RazorPagesMovie, inclusief overeenkomende hoofdletters, zodat de naamruimten overeenkomen wanneer u voorbeeldcode kopieert en plakt.

    uw nieuwe project configureren

  4. Selecteer Volgende.

  5. Selecteer in het dialoogvenster Aanvullende informatie.NET 6.0 (Langdurige ondersteuning) en selecteer vervolgens Maken.

    Aanvullende informatie

Het volgende startersproject wordt gemaakt:

Solution Explorer

De app uitvoeren

Selecteer RazorPagesMovie- in Solution Explorer-en druk op Ctrl+F5 om zonder foutopsporingsprogramma uit te voeren.

Visual Studio geeft het volgende dialoogvenster weer wanneer een project nog niet is geconfigureerd voor het gebruik van SSL:

Dit project is geconfigureerd voor het gebruik van SSL. Als u SSL-waarschuwingen in de browser wilt voorkomen, kunt u ervoor kiezen om het zelfondertekende certificaat te vertrouwen dat IIS Express heeft gegenereerd. Wilt u het IIS Express SSL-certificaat vertrouwen?

Selecteer Ja als u het IIS Express SSL-certificaat vertrouwt.

Het volgende dialoogvenster wordt weergegeven:

beveiligingswaarschuwingsdialoogvenster

Selecteer Ja als u akkoord gaat met het vertrouwen van het ontwikkelingscertificaat.

Zie Firefox SEC_ERROR_INADEQUATE_KEY_USAGE certificaatfoutvoor meer informatie over het vertrouwen van de Firefox-browser.

Visual Studio:

  • Hiermee wordt de app uitgevoerd, waarmee de Kestrel-server wordt gestart.
  • Hiermee start u de standaardbrowser op https://localhost:5001, waarin de gebruikersinterface van de apps wordt weergegeven.

De projectbestanden onderzoeken

De volgende secties bevatten een overzicht van de hoofdprojectmappen en bestanden waarmee u in latere zelfstudies gaat werken.

Map Pagina's

Bevat Razor pagina's en ondersteunende bestanden. Elke Razor pagina is een paar bestanden:

  • Een .cshtml-bestand met HTML-markeringen met C#-code met behulp van Razor syntaxis.
  • Een .cshtml.cs-bestand met C#-code waarmee paginagebeurtenissen worden verwerkt.

Ondersteunende bestanden hebben namen die beginnen met een onderstrepingsteken. Het bestand _Layout.cshtml configureert bijvoorbeeld UI-elementen die voor alle pagina's gebruikelijk zijn. Met dit bestand stelt u het navigatiemenu boven aan de pagina en de copyrightmelding onder aan de pagina in. Zie Indeling in ASP.NET Corevoor meer informatie.

wwwroot-map

Bevat statische assets, zoals HTML-bestanden, JavaScript-bestanden en CSS-bestanden. Zie Statische bestanden in ASP.NET Corevoor meer informatie.

appsettings.json

Bevat configuratiegegevens, zoals verbindingsreeksen. Zie Configuratie in ASP.NET Corevoor meer informatie.

Program.cs

Bevat de volgende code:

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.
builder.Services.AddRazorPages();

var app = builder.Build();

// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Error");
    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
    app.UseHsts();
}

app.UseHttpsRedirection();
app.UseStaticFiles();

app.UseRouting();

app.UseAuthorization();

app.MapRazorPages();

app.Run();

Met de volgende regels code in dit bestand maakt u een WebApplicationBuilder met vooraf geconfigureerde standaardinstellingen, voegt u Razor Pages-ondersteuning toe aan de Afhankelijkheidsinjectiecontainer (DI)en bouwt u de app:

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.
builder.Services.AddRazorPages();

var app = builder.Build();

De uitzonderingspagina voor ontwikkelaars is standaard ingeschakeld en biedt nuttige informatie over uitzonderingen. Productie-apps mogen niet worden uitgevoerd in de ontwikkelingsmodus omdat de uitzonderingspagina voor ontwikkelaars gevoelige informatie kan lekken.

Met de volgende code wordt het uitzonderingseindpunt ingesteld op /Error en wordt HSTS - (HTTP Strict Transport Security Protocol) ingeschakeld wanneer de app niet wordt uitgevoerd in de ontwikkelmodus:

// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Error");
    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
    app.UseHsts();
}

De voorgaande code wordt bijvoorbeeld uitgevoerd wanneer de app zich in de productie- of testmodus bevindt. Zie Meerdere omgevingen gebruiken in ASP.NET Corevoor meer informatie.

Met de volgende code worden verschillende Middlewareingeschakeld:

  • app.UseHttpsRedirection();: stuurt HTTP-aanvragen om naar HTTPS.
  • app.UseStaticFiles();: maakt het mogelijk om statische bestanden, zoals HTML, CSS, afbeeldingen en JavaScript, te verwerken. Zie Statische bestanden in ASP.NET Corevoor meer informatie.
  • app.UseRouting();: hiermee voegt u routekoppeling toe aan de middleware-pijplijn. Zie Routering in ASP.NET Core voor meer informatie
  • app.MapRazorPages();: hiermee configureert u eindpuntroutering voor Razor Pagina's.
  • app.UseAuthorization();: geeft een gebruiker toestemming om toegang te krijgen tot beveiligde resources. Deze app gebruikt geen autorisatie, daarom kan deze regel worden verwijderd.
  • app.Run();: hiermee wordt de app uitgevoerd.

Problemen oplossen met het voltooide voorbeeld

Als u een probleem ondervindt dat u niet kunt oplossen, vergelijkt u de code met het voltooide project. Voltooid project weergeven of downloaden (hoe te downloaden).

Volgende stappen

Volgende: Een model toevoegen

Dit is de eerste zelfstudie van een reeks die de basisbeginselen leert van het bouwen van een ASP.NET Core Razor Pages-web-app.

Zie Inleiding tot Razor Pagina'svoor een inleiding die gericht is op ontwikkelaars die bekend zijn met controllers en views en die wat geavanceerder is.

Als u nieuw bent in de ontwikkeling van ASP.NET Core en niet zeker weet welke ASP.NET Core-webgebruikersinterfaceoplossing het beste bij uw behoeften past, zie dan Een ASP.NET Core UIkiezen.

Aan het einde van de serie hebt u een app waarmee een database met films wordt beheerd.

In deze zelfstudie gaat u het volgende doen:

  • Een Razor Pages-web-app maken.
  • Voer de app uit.
  • Bekijk de projectbestanden.

Aan het einde van deze zelfstudie hebt u een werkende Razor Pages-web-app die u in latere zelfstudies gaat verbeteren.

Home of indexpagina

Voorwaarden

Een Razor Pages-web-app maken

  1. Start Visual Studio en selecteer Een nieuw project maken. Zie Een nieuw project maken in Visual Studiovoor meer informatie.

    Een nieuw project maken vanuit het startvenster

  2. In het dialoogvenster Een nieuw project maken, selecteer ASP.NET Core-webtoepassingen selecteer vervolgens Volgende.

    Een ASP.NET Core-webtoepassing maken

  3. In het Configureren van je nieuwe project dialoogvenster voer je RazorPagesMovie in voor Projectnaam. Het is belangrijk om het project een naam te geven RazorPagesMovie, inclusief overeenkomende hoofdletters, zodat de naamruimten overeenkomen wanneer u voorbeeldcode kopieert en plakt.

  4. Selecteer Maak.

    het project configureren

  5. Selecteer in het dialoogvenster Een nieuwe ASP.NET Core-webtoepassing maken:

    1. .NET Core en ASP.NET Core 5.0 in de vervolgkeuzelijsten.
    2. webtoepassing.
    3. maken.

    ASP.NET Core Web App selecteren

Het volgende startersproject wordt gemaakt:

Solution Explorer-

De app uitvoeren

  • Druk op Ctrl+F5 om uit te voeren zonder het foutopsporingsprogramma.

    Visual Studio geeft het volgende dialoogvenster weer wanneer een project nog niet is geconfigureerd voor het gebruik van SSL:

    Dit project is geconfigureerd voor het gebruik van SSL. Als u SSL-waarschuwingen in de browser wilt voorkomen, kunt u ervoor kiezen om het zelfondertekende certificaat te vertrouwen dat IIS Express heeft gegenereerd. Wilt u het IIS Express SSL-certificaat vertrouwen?

    Selecteer Ja als u het IIS Express SSL-certificaat vertrouwt.

    Het volgende dialoogvenster wordt weergegeven:

    beveiligingswaarschuwingsdialoogvenster

    Selecteer Ja als u akkoord gaat met het vertrouwen van het ontwikkelingscertificaat.

    Zie Firefox SEC_ERROR_INADEQUATE_KEY_USAGE certificaatfoutvoor meer informatie over het vertrouwen van de Firefox-browser.

    Visual Studio start IIS Express en voert de app uit. De adresbalk toont localhost:port# en niet iets als example.com. Dat komt doordat localhost de standaardhostnaam is voor de lokale computer. Localhost dient alleen webaanvragen van de lokale computer. Wanneer Visual Studio een webproject maakt, wordt er een willekeurige poort gebruikt voor de webserver.

De projectbestanden onderzoeken

Hier volgt een overzicht van de belangrijkste projectmappen en bestanden waarmee u in latere zelfstudies gaat werken.

Paginamap

Bevat Razor pagina's en ondersteunende bestanden. Elke Razor pagina is een paar bestanden:

  • Een .cshtml-bestand met HTML-markeringen met C#-code met behulp van Razor syntaxis.
  • Een .cshtml.cs-bestand met C#-code waarmee paginagebeurtenissen worden verwerkt.

Ondersteunende bestanden hebben namen die beginnen met een onderstrepingsteken. Het bestand _Layout.cshtml configureert bijvoorbeeld UI-elementen die voor alle pagina's gebruikelijk zijn. Met dit bestand stelt u het navigatiemenu boven aan de pagina en de copyrightmelding onder aan de pagina in. Zie Indeling in ASP.NET Corevoor meer informatie.

wwwroot-map

Bevat statische assets, zoals HTML-bestanden, JavaScript-bestanden en CSS-bestanden. Zie Statische bestanden in ASP.NET Corevoor meer informatie.

appsettings.json

Bevat configuratiegegevens, zoals verbindingsreeksen. Zie Configuratie in ASP.NET Corevoor meer informatie.

Program.cs

Bevat het toegangspunt voor de app. Zie .NET Generic Host in ASP.NET Corevoor meer informatie.

Startup.cs

Bevat code waarmee app-gedrag wordt geconfigureerd. Zie App opstarten in ASP.NET Corevoor meer informatie.

Problemen oplossen met het voltooide voorbeeld

Als u een probleem ondervindt dat u niet kunt oplossen, vergelijkt u de code met het voltooide project. Voltooid project bekijken of downloaden (hoe te downloaden).

Volgende stappen

Volgende: Een model toevoegen

Dit is de eerste zelfstudie van een reeks die de basisbeginselen leert van het bouwen van een ASP.NET Core Razor Pages-web-app.

Zie Inleiding tot Razor Pagina'svoor een meer geavanceerde introductie die gericht is op ontwikkelaars die bekend zijn met controllers en views.

Aan het einde van de serie hebt u een app waarmee een database met films wordt beheerd.

voorbeeldcode weergeven of downloaden (hoe te downloaden).

In deze zelfstudie gaat u het volgende doen:

  • Een Razor Pages-web-app maken.
  • Voer de app uit.
  • Bekijk de projectbestanden.

Aan het einde van deze zelfstudie hebt u een werkende Razor Pages-web-app die u verderop in zelfstudies gaat gebruiken.

De pagina Home of indexeren

Voorwaarden

Een Razor Pages-web-app maken

  • Selecteer in het Visual Studio-menu Bestand Nieuw>Project.

  • Maak een nieuwe ASP.NET Core-webtoepassing en selecteer Volgende. Het nieuwe project maken vanuit het startvenster

  • Noem het project RazorPagesMovie. Het is belangrijk om het project een naam te geven RazorPagesMovie zodat de naamruimten overeenkomen wanneer u code kopieert en plakt. Geef het project een naam

  • Selecteer ASP.NET Core 3.1 in de vervolgkeuzelijst, Webtoepassing, en selecteer vervolgens Maken.

ASP.NET Core-webtoepassing selecteren

Het volgende startersproject wordt gemaakt:

Solution Explorer

De app uitvoeren

  • Druk op Ctrl+F5 om uit te voeren zonder het foutopsporingsprogramma.

    Visual Studio geeft het volgende dialoogvenster weer wanneer een project nog niet is geconfigureerd voor het gebruik van SSL:

    Dit project is geconfigureerd voor het gebruik van SSL. Als u SSL-waarschuwingen in de browser wilt voorkomen, kunt u ervoor kiezen om het zelfondertekende certificaat te vertrouwen dat IIS Express heeft gegenereerd. Wilt u het IIS Express SSL-certificaat vertrouwen?

    Selecteer Ja als u het IIS Express SSL-certificaat vertrouwt.

    Het volgende dialoogvenster wordt weergegeven:

    beveiligingswaarschuwingsdialoogvenster

    Selecteer Ja als u akkoord gaat met het vertrouwen van het ontwikkelingscertificaat.

    Zie Firefox SEC_ERROR_INADEQUATE_KEY_USAGE certificaatfoutvoor meer informatie over het vertrouwen van de Firefox-browser.

    Visual Studio startt IIS Express en voert de app uit. De adresbalk toont localhost:port# en niet iets als example.com. Dat komt doordat localhost de standaardhostnaam is voor de lokale computer. Localhost dient alleen webaanvragen van de lokale computer. Wanneer Visual Studio een webproject maakt, wordt er een willekeurige poort gebruikt voor de webserver.

De projectbestanden onderzoeken

Hier volgt een overzicht van de belangrijkste projectmappen en bestanden waarmee u in latere zelfstudies gaat werken.

Paginamap

Bevat Razor pagina's en ondersteunende bestanden. Elke Razor pagina is een paar bestanden:

  • Een .cshtml-bestand met HTML-markeringen met C#-code met behulp van Razor syntaxis.
  • Een .cshtml.cs-bestand met C#-code waarmee paginagebeurtenissen worden verwerkt.

Ondersteunende bestanden hebben namen die beginnen met een onderstrepingsteken. Het bestand _Layout.cshtml configureert bijvoorbeeld UI-elementen die voor alle pagina's gebruikelijk zijn. Met dit bestand stelt u het navigatiemenu boven aan de pagina en de copyrightmelding onder aan de pagina in. Zie Indeling in ASP.NET Corevoor meer informatie.

wwwroot-folder

Bevat statische bestanden, zoals HTML-bestanden, JavaScript-bestanden en CSS-bestanden. Zie Statische bestanden in ASP.NET Corevoor meer informatie.

appSettings.json

Bevat configuratiegegevens, zoals verbindingsreeksen. Zie Configuratie in ASP.NET Corevoor meer informatie.

Program.cs

Bevat het toegangspunt voor het programma. Zie .NET Generic Host in ASP.NET Corevoor meer informatie.

Startup.cs

Bevat code waarmee app-gedrag wordt geconfigureerd. Zie App opstarten in ASP.NET Corevoor meer informatie.

Volgende stappen

Volgende: Een model toevoegen