Kurz: Začínáme se Razor stránkami v ASP.NET Core

  • Článek
  • 7 min ke čtení

Autor: Rick Anderson

Toto je první kurz série, která vás naučí základy vytváření webové aplikace ASP.NET Core Razor Pages.

Pokročilejší úvod pro vývojáře, kteří znají kontrolery a zobrazení, najdete v tématu Úvod do Razor stránek.

Pokud s vývojem aplikací ASP.NET Core nejste si jistí, které řešení webového uživatelského ASP.NET Core nejlépe vyhovovalo vašim potřebám, podívejte se Volba uživatelského ASP.NET Core prostředí na .

Na konci série budete mít aplikaci, která spravuje databázi filmů.

V tomto kurzu jste:

  • Vytvořte Razor webovou aplikaci Pages.
  • Spusťte aplikaci.
  • Zkontrolujte soubory projektu.

Na konci tohoto kurzu budete mít funkční webovou aplikaci Pages, kterou vylepšete v Razor pozdějších kurzech.

Home nebo Index page

Požadavky

Vytvoření webové Razor aplikace Pages

  1. Spusťte Visual Studio a vyberte Create a new project (Vytvořit nový projekt). Další informace najdete v tématu Vytvoření nového projektu v Visual Studio.

    Vytvoření nového projektu z úvodního okna

  2. V dialogovém okně Create a new project (Vytvořit nový projekt) vyberte ASP.NET Core Web Application (Webová aplikace) a pak vyberte Next (Další).

    Vytvoření webové ASP.NET Core aplikace

  3. V dialogovém okně Configure your new project (Konfigurace nového RazorPagesMovie projektu) zadejte Project name (Název projektu). Je důležité, abyste projekt pojmech měli Razor Pages 1 včetně párování velkých a velkých písmen, aby se obory názvů při kopírování a vkládání vzorového kódu shodují.

  4. Vyberte Vytvořit.

    Konfigurace projektu

  5. V dialogovém okně Vytvořit novou ASP.NET Core webové aplikace vyberte:

    1. V rozevíracích seznamech ASP.NET Core .NET Core a 5.0.
    2. Webová aplikace.
    3. Create.

    Výběr ASP.NET Core aplikace

    Vytvoří se následující počáteční projekt:

    Průzkumník řešení

Spuštění aplikace

  • Stisknutím kombinace kláves Ctrl+F5 spusťte příkaz bez ladicího programu.

    Visual Studio se zobrazí následující dialogové okno, pokud projekt ještě není nakonfigurovaný na použití SSL:

    Tento projekt je nakonfigurovaný tak, aby se používá protokol SSL. Pokud se chcete vyhnout upozorněním PROTOKOLU SSL v prohlížeči, můžete důvěřovat certifikátu podepsanému svým držitelem, IIS Express vygeneroval. Chcete důvěřovat certifikátu SSL IIS Express zabezpečení?

    Vyberte Ano, pokud důvěřujete certifikátu IIS EXPRESS SSL.

    Zobrazí se následující dialogové okno:

    Dialogové okno Upozornění zabezpečení

    Pokud souhlasíte s důvěryhodností vývojového certifikátu, vyberte Ano.

    Informace o důvěřování prohlížeči Firefox naleznete v tématu firefox SEC_ERROR_INADEQUATE_KEY_USAGE Chyba certifikátu.

    Visual Studio spustí IIS Express a spustí aplikaci. V adresní řádku se localhost:port# zobrazuje a ne něco jako example.com . Je to proto, localhost že je to standardní název hostitele pro místní počítač. Localhost slouží pouze k webovým požadavkům z místního počítače. Když Visual Studio vytvoří webový projekt, použije se pro webový server náhodný port.

Prozkoumání souborů projektu

Tady je přehled hlavních složek a souborů projektu, se které budete pracovat v dalších kurzech.

Složka Pages

Obsahuje Razor stránky a podpůrné soubory. Každá Razor stránka je pár souborů:

  • Soubor .cshtml, který má kód HTML s kódem jazyka C# pomocí Razor syntaxe.
  • Soubor .cshtml.cs s kódem jazyka C#, který zpracovává události stránky.

Podpůrné soubory mají názvy, které začínají podtržítkem. Například soubor _Layout.cshtml konfiguruje prvky uživatelského rozhraní společné pro všechny stránky. Tento soubor nastaví navigační nabídku v horní části stránky a oznámení o autorských právech v dolní části stránky. Další informace naleznete v tématu Rozložení v ASP.NET Core.

Složka wwwroot

Obsahuje statické prostředky, jako jsou soubory HTML, soubory JavaScriptu a soubory CSS. Další informace naleznete v tématu Statické soubory v ASP.NET Core.

appsettings.json

Obsahuje konfigurační data, jako jsou připojovací řetězce. Další informace naleznete v tématu Konfigurace v ASP.NET Core.

Program.cs

Obsahuje vstupní bod aplikace. Další informace naleznete v tématu Obecný hostitel .NET v ASP.NET Core.

Startup.cs

Obsahuje kód, který konfiguruje chování aplikace. Další informace naleznete v tématu Spuštění aplikace v ASP.NET Core.

Řešení potíží s dokončenou ukázkou

Pokud nastane problém, který nemůžete vyřešit, porovnejte svůj kód s dokončený projektem. Zobrazení nebo stažení dokončeného projektu (stažení).

Další kroky

Další: Přidání modelu

Toto je první kurz série, která vás naučí základy vytváření webové aplikace ASP.NET Core Razor Pages.

Pokročilejší úvod pro vývojáře, kteří znají kontrolery a zobrazení, najdete v tématu Úvod do Razor stránek.

Na konci série budete mít aplikaci, která spravuje databázi filmů.

Zobrazení nebo stažení ukázkového kódu (stažení).

V tomto kurzu jste:

  • Vytvořte Razor webovou aplikaci Pages.
  • Spusťte aplikaci.
  • Zkontrolujte soubory projektu.

Na konci tohoto kurzu budete mít funkční webovou aplikaci Pages, na které budete stavět v Razor pozdějších kurzech.

Stránka Home nebo ::no-loc(Index):::

Požadavky

Vytvoření webové Razor aplikace Pages

  • V nabídce Visual Studio File (Soubor) vyberte New > Project (Nový Project).

  • Vytvořte novou aplikaci ASP.NET Core webovou aplikaci a vyberte Další. Vytvoření nového projektu z úvodního okna

  • Projekt Razor pojmechnte Pages ( Stránky)– . Je důležité projekt pojmnovat Razor Pages Abychom při kopírování a vkládání kódu obory názvů odpovídaly. Název projektu

  • Vyberte ASP.NET Core 3.1 v rozevíracím seznamu Webová aplikace a pak vyberte Vytvořit.

Výběr ASP.NET Core webové aplikace

Vytvoří se následující počáteční projekt:

Průzkumník řešení

Spuštění aplikace

  • Stisknutím kombinace kláves Ctrl+F5 spusťte příkaz bez ladicího programu.

    Visual Studio se zobrazí následující dialogové okno, pokud projekt ještě není nakonfigurovaný na použití SSL:

    Tento projekt je nakonfigurovaný tak, aby se používá protokol SSL. Pokud se chcete vyhnout upozorněním PROTOKOLU SSL v prohlížeči, můžete důvěřovat certifikátu podepsanému svým držitelem, IIS Express vygeneroval. Chcete důvěřovat certifikátu SSL IIS Express zabezpečení?

    Vyberte Ano, pokud důvěřujete certifikátu IIS EXPRESS SSL.

    Zobrazí se následující dialogové okno:

    Dialogové okno Upozornění zabezpečení

    Pokud souhlasíte s důvěryhodností vývojového certifikátu, vyberte Ano.

    Informace o důvěřování prohlížeči Firefox naleznete v tématu firefox SEC_ERROR_INADEQUATE_KEY_USAGE Chyba certifikátu.

    Visual Studio spustí IIS Express a spustí aplikaci. V adresní řádku se localhost:port# zobrazuje a ne něco jako example.com . Je to proto, localhost že je to standardní název hostitele pro místní počítač. Localhost slouží pouze k webovým požadavkům z místního počítače. Když Visual Studio vytvoří webový projekt, použije se pro webový server náhodný port.

Prozkoumání souborů projektu

Tady je přehled hlavních složek a souborů projektu, se které budete pracovat v dalších kurzech.

Složka Pages

Obsahuje Razor stránky a podpůrné soubory. Každá Razor stránka je pár souborů:

  • Soubor .cshtml, který má kód HTML s kódem jazyka C# pomocí Razor syntaxe.
  • Soubor .cshtml.cs s kódem jazyka C#, který zpracovává události stránky.

Podpůrné soubory mají názvy, které začínají podtržítkem. Například soubor _Layout.cshtml konfiguruje prvky uživatelského rozhraní společné pro všechny stránky. Tento soubor nastaví navigační nabídku v horní části stránky a oznámení o autorských právech v dolní části stránky. Další informace naleznete v tématu Rozložení v ASP.NET Core.

Složka wwwroot

Obsahuje statické soubory, jako jsou soubory HTML, soubory JavaScriptu a soubory CSS. Další informace naleznete v tématu Statické soubory v ASP.NET Core.

appSettings.json

Obsahuje konfigurační data, jako jsou připojovací řetězce. Další informace naleznete v tématu Konfigurace v ASP.NET Core.

Program.cs

Obsahuje vstupní bod pro program. Další informace naleznete v tématu Obecný hostitel .NET v ASP.NET Core.

Startup.cs

Obsahuje kód, který konfiguruje chování aplikace. Další informace naleznete v tématu Spuštění aplikace v ASP.NET Core.

Další kroky

Další: Přidání modelu

Toto je první kurz série, která vás naučí základy vytváření webové aplikace ASP.NET Core Razor Pages.

Pokročilejší úvod pro vývojáře, kteří znají kontrolery a zobrazení, najdete v tématu Úvod do Razor stránek.

Pokud s vývojem aplikací ASP.NET Core nejste si jistí, které řešení webového uživatelského ASP.NET Core nejlépe vyhovovalo vašim potřebám, podívejte se Volba uživatelského ASP.NET Core prostředí na .

Na konci série budete mít aplikaci, která spravuje databázi filmů.

V tomto kurzu jste:

  • Vytvořte Razor webovou aplikaci Pages.
  • Spusťte aplikaci.
  • Zkontrolujte soubory projektu.

Na konci tohoto kurzu budete mít funkční webovou aplikaci Pages, kterou vylepšete v Razor pozdějších kurzech.

Home nebo Index page

Požadavky

Vytvoření webové Razor aplikace Pages

  1. Spusťte Visual Studio 2022 a vyberte Create a new project (Vytvořit nový projekt).

    Vytvoření nového projektu z úvodního okna

  2. V dialogovém okně Create a new project (Vytvořit nový projekt) vyberte ASP.NET Core Web App (Webová aplikace) a pak vyberte Next (Další).

    Vytvoření webové ASP.NET Core aplikace

  3. V dialogovém okně Konfigurovat nový projekt zadejte RazorPagesMovie jako Project název. Je důležité, abyste projekt pojmet měli Razor Pages Abychom shodu s velkými písmeny, aby se obory názvů při kopírování a vkládání příkladu kódu shodují.

    Konfigurace nového projektu

  4. Vyberte Další.

  5. V dialogovém okně Další informace vyberte .NET 6.0 (dlouhodobá podpora) a pak vyberte Vytvořit.

    Další informace

    Vytvoří se následující počáteční projekt:

    Průzkumník řešení

Spuštění aplikace

V okně Průzkumník řešení vyberte Razor Pages (Stránky) a stisknutím Ctrl+F5 spusťte příkaz bez ladicího programu.

Visual Studio se zobrazí následující dialogové okno, pokud projekt ještě není nakonfigurovaný na použití SSL:

Tento projekt je nakonfigurovaný tak, aby se používá protokol SSL. Pokud se chcete vyhnout upozorněním PROTOKOLU SSL v prohlížeči, můžete důvěřovat certifikátu podepsanému svým držitelem, IIS Express vygeneroval. Chcete důvěřovat certifikátu SSL IIS Express zabezpečení?

Vyberte Ano, pokud důvěřujete certifikátu IIS EXPRESS SSL.

Zobrazí se následující dialogové okno:

Dialogové okno Upozornění zabezpečení

Pokud souhlasíte s důvěryhodností vývojového certifikátu, vyberte Ano.

Informace o důvěřování prohlížeči Firefox naleznete v tématu firefox SEC_ERROR_INADEQUATE_KEY_USAGE Chyba certifikátu.

Visual Studio:

  • Spustí aplikaci, která spustí server Kestrel.
  • Spustí výchozí prohlížeč v , https://localhost:5001 který zobrazí uživatelské rozhraní aplikací.

Prozkoumání souborů projektu

Následující části obsahují přehled hlavních složek a souborů projektu, se které budete pracovat v dalších kurzech.

Složka Pages

Obsahuje Razor stránky a podpůrné soubory. Každá Razor stránka je pár souborů:

  • Soubor .cshtml, který má kód HTML s kódem jazyka C# pomocí Razor syntaxe.
  • Soubor .cshtml.cs s kódem jazyka C#, který zpracovává události stránky.

Podpůrné soubory mají názvy, které začínají podtržítkem. Například soubor _Layout.cshtml konfiguruje prvky uživatelského rozhraní společné pro všechny stránky. Tento soubor nastaví navigační nabídku v horní části stránky a oznámení o autorských právech v dolní části stránky. Další informace naleznete v tématu Rozložení v ASP.NET Core.

složka wwwroot

Obsahuje statické prostředky, jako jsou soubory HTML, soubory JavaScriptu a soubory CSS. Další informace naleznete v tématu Statické soubory v ASP.NET Core.

appsettings.json

Obsahuje konfigurační data, jako jsou připojovací řetězce. Další informace naleznete v tématu Konfigurace v ASP.NET Core.

Program.cs

Obsahuje následující kód:

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.UseDeveloperExceptionPage();
}
else
{
    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();

Následující řádky kódu v tomto souboru vytvoří objekt s předkonfigurovaných výchozími nastaveními, do kontejneru injektáže závislostí (DI) přidáte podporu pages a WebApplicationBuilder Razor sestavíte aplikaci: 

using Microsoft.EntityFrameworkCore;
using Microsoft.Extensions.DependencyInjection;
using RazorPagesMovie.Data;
var builder = WebApplication.CreateBuilder(args);

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

builder.Services.AddDbContext<RazorPagesMovieContext>(options => 
       options.UseSqlServer(builder.Configuration.GetConnectionString("RazorPagesMovieContext")));

var app = builder.Build();

Následující zvýrazněný kód povolí stránku výjimky pro vývojáře, když je aplikace spuštěná ve vývojovém režimu:

// Configure the HTTP request pipeline.
if (app.Environment.IsDevelopment())
{
    app.UseDeveloperExceptionPage();
}
else
{
    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();
}

Stránka s výjimkami pro vývojáře poskytuje užitečné informace o výjimce. Produkční aplikace by neměly být spuštěny ve vývojovém režimu, protože stránka výjimky vývojáře může prozrazení citlivých informací.

Následující zvýrazněný kód nastaví koncový bod výjimky na a povolí protokol /Error HSTS (Http Strict Transport Security Protocol), pokud aplikace není spuštěná ve vývojovém režimu:

// Configure the HTTP request pipeline.
if (app.Environment.IsDevelopment())
{
    app.UseDeveloperExceptionPage();
}
else
{
    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();
}

Například předchozí kód se spustí, když je aplikace v produkčním nebo testovacím režimu. Další informace najdete v tématu Použití více prostředí v ASP.NET Core.

Následující kód povolí různé middleware:

  • app.UseHttpsRedirection(); : Přesměruje požadavky HTTP na HTTPS.
  • app.UseStaticFiles(); : Umožňuje obsluhou statických souborů, jako jsou HTML, CSS, obrázky a JavaScript. Další informace naleznete v tématu Statické soubory v ASP.NET Core.
  • app.UseRouting(); : Přidá párování tras do middlewarového kanálu. Další informace najdete v tématu Směrování v ASP.NET Core.
  • app.MapRazorPages();: Nakonfiguruje směrování koncového bodu pro Razor stránky.
  • app.UseAuthorization(); : Autorizuje uživatele pro přístup k zabezpečeným prostředkům. Tato aplikace autorizaci nevyu i používá, proto je možné tento řádek odebrat.
  • app.Run(); : Spustí aplikaci.

Řešení potíží s dokončenou ukázkou

Pokud nastane problém, který nemůžete vyřešit, porovnejte svůj kód s dokončený projektem. Zobrazení nebo stažení dokončeného projektu (stažení).

Další kroky

Další: Přidání modelu