Razor C#(開發者的工作原理)
Razor 是一個伺服器端標記語言,用於使用 .NET Core 和 .NET Framework 建立動態網頁。 它主要與 ASP.NET Core 結合使用。 Razor Pages 是 ASP.NET Core 的新方面,提供了一個清晰且簡單的方式來組織應用程式中的程式碼,減少了程式碼重複的問題。 Razor 將伺服器端使用 C# 或 VB(Visual Basic)與 HTML 結合以建立網頁內容。
本教程將引導您使用 Visual Studio 中的 C# 與 Razor 建立一個基本應用程式。 讓我們開始吧!
先決條件
在我們進入 Razor 的世界之前,請確保您已安裝以下軟體:
- .NET Core SDK
- Visual Studio
這些是必要的,因為它們提供了 Razor 視圖引擎和我們將在本教程中使用的專案模板。 此外,它們可以在多個操作系統上運行,這意味著無論您是使用 Windows、Linux 還是 macOS,都可以跟隨本教程。
步驟 1:建立一個新的 Razor Pages 專案
打開 Microsoft Visual Studio 並按照以下步驟操作:
- 點擊"文件">"新建">"專案"。
-
在專案模板選擇畫面中,選擇"Blazor Server App"。

-
將您的專案命名為"IronPDFExample"並點擊"建立"。

-
從下拉列表中選擇".NET 7.0"或更高版本。

您現在有了一個新的 Razor Pages 專案。
了解 Razor 語法和文件
Razor 文件使用 .cshtml 文件擴展名,將 C#(因此是 'cs')與 HTML 結合。 如果我們使用的是 Visual Basic,文件擴展名將更改為 .vbhtml。
在您的解決方案資源管理器中,找到並打開名為"Index.cshtml"的 .cshtml 擴展名文件。 在此,您會看到 HTML 程式碼與 C# 程式碼的結合。 這種混合是由 Razor 解析器實現的。
Razor 語法
ASP.NET Core 中的 Razor 語法 結合了 HTML 和伺服器端程式碼。 伺服器程式碼要麼是 C#,要麼是 VB 程式碼。 Razor 程式碼由 @ 符號表示,它在將 HTML 發送到客戶端之前就在伺服器上執行。
一個簡單的 Razor 語法範例:
<p>The current time is @DateTime.Now</p>
<p>The current time is @DateTime.Now</p>
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'<p> The current time is @DateTime.Now</p>
在此程式碼範例中,@DateTime.Now 是 Razor 程式碼。 它在伺服器上執行,並在發送到客戶端之前用目前的日期和時間替換。
Razor 視圖
Razor 中的"視圖"一詞對應於任何意圖向使用者呈現資訊的網頁。 Razor 視圖引擎負責向使用者渲染 HTML 頁面。
@page
@model IndexModel
@{
ViewData["Title"] = "Home page";
}
<div class="text-center">
<h1 class="display-4">Welcome</h1>
<p>Learn about <a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
</div>
@page
@model IndexModel
@{
ViewData["Title"] = "Home page";
}
<div class="text-center">
<h1 class="display-4">Welcome</h1>
<p>Learn about <a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
</div>
page model ReadOnly Property () As IndexModel
ViewData("Title") = "Home page"
End Property
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'<div class="text-center"> <h1 class="display-4"> Welcome</h1> <p> Learn about <a href="https://docs.microsoft.com/aspnet/core"> building Web apps @with ASP.NET Core</a>.</p> </div>
使用 Razor 標記建立動態內容
Razor 標記允許我們在 HTML 標記中插入伺服器端程式碼。我們可以使用各種程式碼構造,例如程式碼塊、內聯表達式和 HTML 編碼表達式。
內聯表達式
內聯表達式直接將結果輸出到 HTML 中,使用以下程式碼:
<p>Hello, my name is @Model.Name</p>
<p>Hello, my name is @Model.Name</p>
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'<p> Hello, my name is @Model.Name</p>
在此,@Model.Name 是一個內聯表達式,輸出從傳遞給 Razor 視圖的模型中獲得的 Name 屬性值。
程式碼塊
程式碼塊是在伺服器上運行的程式碼段落:
@{
var name = "IronPDF";
}
<p>Hello, my name is @name</p>
@{
var name = "IronPDF";
}
<p>Hello, my name is @name</p>
@
If True Then
Dim name = "IronPDF"
End If
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'<p> Hello, my name is @name</p>
在此程式碼範例中,{ } 之間的 Razor 程式碼是一個程式碼塊。
控制結構
我們也可以在 Razor Pages 中使用控制結構,如 if 語句和迴圈:
@{
var count = 5;
}
@if (count > 3)
{
<p>The count is greater than 3.</p>
}
@{
var count = 5;
}
@if (count > 3)
{
<p>The count is greater than 3.</p>
}
@
If True Then
Dim count = 5
End If
'INSTANT VB TODO TASK: Local functions are not converted by Instant VB:
'@if(count > 3)
'{
' <p> The count is greater than 3.</p>
'}
在上述程式碼範例中,if 語句是伺服器端程式碼的一部分,在伺服器上運行,其輸出被插入到生成的 HTML 頁面中。
Switch 語句
Switch 語句是 C# 編程語言中的一種型別的條件控制結構。 它們可以在程式碼塊內使用。
@{
var fileFormat = "PDF";
var message = "";
switch (fileFormat)
{
case "PDF":
message = "You selected PDF.";
break;
default:
message = "Invalid selection.";
break;
}
}
<p>@message</p>
@{
var fileFormat = "PDF";
var message = "";
switch (fileFormat)
{
case "PDF":
message = "You selected PDF.";
break;
default:
message = "Invalid selection.";
break;
}
}
<p>@message</p>
@
If True Then
Dim fileFormat = "PDF"
Dim message = ""
Select Case fileFormat
Case "PDF"
message = "You selected PDF."
Case Else
message = "Invalid selection."
End Select
End If
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'<p> @message</p>
Razor 中的 Hello World
在任何編程語言中,最簡單的程式之一就是"Hello World"。 在 Razor 中,您可以使用一個簡單的內聯表達式來顯示"Hello World",如下例所示:
<p>@("Hello World")</p>
<p>@("Hello World")</p>
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'<p> @("Hello World")</p>
Razor 中的迴圈
Razor 語法允許您編寫迴圈,例如 foreach 語句。 假設您有一個要顯示在網頁上的姓名列表。 您可以使用 Razor 語法中的 foreach 語句來達到這一目標。
@{
var names = new List<string> { "John", "Doe", "Smith" };
}
@foreach (var name in names)
{
<p>@name</p>
}
@{
var names = new List<string> { "John", "Doe", "Smith" };
}
@foreach (var name in names)
{
<p>@name</p>
}
@
If True Then
Dim names = New List(Of String) From {"John", "Doe", "Smith"}
End If
'INSTANT VB TODO TASK: Local functions are not converted by Instant VB:
'@foreach(var name in names)
'{
' <p> @name</p>
'}
該 foreach 語句迴圈遍歷列表中的每個姓名,並將其輸出到網頁上。
了解標籤助手
ASP.NET MVC 中的標籤助手可以在 Razor 文件中建立和渲染 HTML 元素的伺服器端程式碼。 它們有點像 HTML 助手,但語法更類似於 HTML。 它們將您的 Razor 視圖中的類 HTML 元素轉換為發送到客戶端瀏覽器的 HTML 標記。 考慮以下的錨點標籤助手程式碼範例:
<a asp-controller="Home" asp-action="Index">Home</a>
<a asp-controller="Home" asp-action="Index">Home</a>
處理使用者互動
Razor Pages 使用處理器方法來管理使用者互動。 例如,為了處理表單提交,我們可以在 Razor Page 的相應 Page Model 文件中建立一個名為 OnPostAsync 的方法。
public async Task<IActionResult> OnPostAsync()
{
if (!ModelState.IsValid)
{
return Page();
}
// Perform some operation here
return RedirectToPage("./Index");
}
public async Task<IActionResult> OnPostAsync()
{
if (!ModelState.IsValid)
{
return Page();
}
// Perform some operation here
return RedirectToPage("./Index");
}
Public Async Function OnPostAsync() As Task(Of IActionResult)
If Not ModelState.IsValid Then
Return Page()
End If
' Perform some operation here
Return RedirectToPage("./Index")
End Function
Razor 中的註釋
Razor 也支援 C# 樣式的註釋。 記住,Razor 註釋是伺服器端的,也就是說,它們不會被發送到瀏覽器。 它們看起來像這樣:
@* This is a Razor comment *@
@* This is a Razor comment *@
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'@* This is a Razor comment *@
這是一個多行註釋:
@*
This is a multi-line Razor comment.
It's useful when you have a lot to say.
*@
@*
This is a multi-line Razor comment.
It's useful when you have a lot to say.
*@
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'@* This is a multi-line Razor comment.It's useful @when you have a lot @to say. *@
Razor 視圖和頁面可以包含 HTML 註釋。 這些註釋在發送到瀏覽器的 HTML 輸出中可見。
向 Razor Page 傳遞模型
Razor 允許您從伺服器向頁面傳遞模型。 使用 @model 指令來指定所傳遞物件的型別。 此模型屬性可以在 Razor 頁面中存取,如以下例子所示:
@page
@model ExampleModel
<h2>@Model.Title</h2>
<p>@Model.Description</p>
@page
@model ExampleModel
<h2>@Model.Title</h2>
<p>@Model.Description</p>
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'@page @model ExampleModel <h2> @Model.Title</h2> <p> @Model.Description</p>
在 Razor 中使用 IronPDF 生成 PDF
發現 IronPDF for .NET 是一個受歡迎的程式庫,讓開發者能夠從 .NET 中以 HTML、圖像甚至現有網頁生成 PDF。 這是一個建立報告、發票或其他需要標準列印格式的文件的優秀工具。 IronPDF 可以完美地在 ASP.NET MVC 和 ASP.NET Razor Pages 框架中運作。
安裝
首先,您需要安裝 IronPDF 套件。 您可以通過 Visual Studio 的 NuGet 套件管理器主控台來完成此操作。 運行以下命令:
Install-Package IronPdf
建立一個簡單的 PDF
現在,讓我們從您的 Razor 頁面中的 HTML 程式碼建立一個簡單的 PDF。 首先,讓我們在 Razor 頁面頂部導入 IronPDF 命名空間。
@using IronPdf;
@using IronPdf;
Dim IronPdf As [using]
然後,您可以使用 IronPDF 來建立 PDF。 假設我們在 Razor 頁面中有一個按鈕,當點擊時會建立一個簡單的 PDF。
在我們的 Page Model 文件中的相應處理器中,我們可以新增以下程式碼:
@page "/pdf"
@using IronPdf;
@inject IJSRuntime JS
<PageTitle>Create PDF</PageTitle>
<h1>Create PDF</h1>
<div class="form-outline">
<button class="btn btn-primary mt-3" @onclick="CreatePDF">Create PDF</button>
</div>
@code {
private string htmlString { get; set; }
private async Task CreatePDF()
{
var Renderer = new IronPdf.ChromePdfRenderer();
Renderer.RenderingOptions.PaperSize = IronPdf.Rendering.PdfPaperSize.A2;
var doc = Renderer.RenderUrlAsPdf("https://ironpdf.com/");
using var Content = new DotNetStreamReference(stream: doc.Stream);
await JS.InvokeVoidAsync("SubmitHTML", "ironpdf.pdf", Content);
}
}
輸出


結論
您已成功學習 Razor C# 的基礎知識,並探索瞭如何整合 IronPDF 在您的應用程式中生成 PDF 文件。 您從 Visual Studio 中建立一個新專案開始,然後學習如何使用 Razor 語法建立動態網頁。 您還探索了如何使用 IronPDF 從 HTML 程式碼生成 PDF,甚至完整的 Razor 視圖。
現在,隨著您繼續構建更高級的應用程式,您可以利用 IronPDF 所提供的強大功能。 您可以免費試用 IronPDF,如果您覺得有價值,您可以購買適合您需求的授權。
常見問題
如何使用Razor在C#中從HTML生成PDF?
您可以使用IronPDF程式庫在C#中使用Razor從HTML生成PDF。首先,安裝IronPDF套件,導入IronPDF命名空間,然後使用其API方法如RenderHtmlAsPdf來將您的HTML內容轉換為PDF格式。
Razor語法在網頁開發中扮演什麼角色?
Razor語法在網頁開發中扮演關鍵角色,通過將C#或VB與HTML結合來建立動態網頁。它允許開發者撰寫伺服器端程式碼,這些程式碼在HTML被發送到使用者端的瀏覽器之前執行,有助於流暢的整合與功能性。
Razor頁面如何增強網路應用程式開發?
Razor頁面透過提供結構化和有條理的方式來管理程式碼,減少重複和複雜性,以增強網路應用程式的開發。它們簡化了開發流程,使開發者能專注於在基於頁面的格式中構建功能。
什麼是標籤輔助工具,它們如何在Razor頁面中協助?
Razor頁面中的標籤輔助工具通過使用類似HTML的語法讓伺服器端程式碼建立和渲染HTML元素協助開發。這幫助在將元素發送到使用者端的瀏覽器之前,轉換伺服器上的元素,生成乾淨且易於維護的HTML標記。
如何在Razor頁面中處理使用者互動?
Razor頁面中的使用者互動是通過處理方法如OnPostAsync進行管理的。這些方法處理表單提交和其他使用者輸入,允許開發者根據從客戶端接收到的資料來執行操作。
'@model'指令在Razor語法中有什麼重要性?
'@model'指令在Razor中很重要,因為它指定傳遞給Razor頁面的物件的資料型別。這使得開發者能直接在頁面中存取和操作模型的屬性,促進資料綁定和互動。
在Visual Studio中使用Razor與C#有什麼好處?
在Visual Studio中使用Razor與C#帶來諸多好處,例如伺服器端邏輯與HTML的整合,通過Razor頁面簡化開發,以及輕鬆生成動態網頁內容。此外,Visual Studio提供了支持Razor開發的強大工具和模板。
我可以用Razor語法同時使用C#和VB嗎?
是的,Razor語法可以同時用於C#和VB(Visual Basic),以將伺服器端邏輯與HTML結合。此靈活性使開發者在受益於Razor在網頁開發能力的同時,能夠選擇他們偏好的語言。




