ASP.NET 入门教程：从零开始构建你的第一个网站
第一部分：ASP.NET 是什么？
在开始编码之前，我们先要理解 ASP.NET 是什么。
想象一下,你想开一家餐厅：
- HTML：是餐厅的装修和桌椅,是顾客能看到和触摸到的静态内容。
- CSS：是桌椅的颜色、墙上的画,让餐厅看起来更美观。
- JavaScript：是餐厅里的服务员，可以和顾客互动,比如点餐时弹出确认框。
光有这些是不够的，你需要一个厨房，根据顾客的点单（请求）来烹饪菜品（处理数据），然后上菜（响应），这个厨房就是 后端服务器。
ASP.NET 就是这个厨房的现代化、高效的建造工具。
官方定义： ASP.NET 是一个由微软开发的、用于构建 Web 应用程序的免费开源框架，它运行在 Windows 服务器上，使用 C# 或 VB.NET 等编程语言，让你能够快速、轻松地创建动态的、数据驱动的网站和 Web 服务。
核心特点：
- 跨平台：现代的 ASP.NET Core 可以在 Windows, Linux, macOS 上运行。
- 高性能：在所有主流 Web 框架中名列前茅。
- 开源：拥有活跃的社区,持续更新和改进。
- 易于学习：特别是对于有 C# 基础的开发者。
- 安全性高：内置了许多安全功能,帮助你防范常见的网络攻击。
第二部分：准备工作
你需要安装以下软件：
-
Visual Studio 2025 (Community 版免费)
- 这是微软官方的集成开发环境，是开发 ASP.NET 应用的最佳工具。
- 下载地址：https://visualstudio.microsoft.com/zh-hans/vs/community/
- 安装时务必勾选：
.NET 桌面开发或ASP.NET 和 Web 开发工作负载，这会自动安装 .NET SDK 和必要的开发工具。
-
.NET 6 SDK 或更高版本
（图片来源网络，侵删）SDK (Software Development Kit) 是编译和运行 .NET 应用程序所必需的，Visual Studio 安装程序通常会帮你安装好。
第三部分：创建你的第一个 ASP.NET Core 项目
让我们动手创建项目。
-
打开 Visual Studio 2025。
-
点击 “创建新项目” (Create a new project)。
-
在模板搜索框中输入
ASP.NET Core Web App，选择它，然后点击 “下一步”。 -
配置你的新项目：
- 项目名称：给项目起个名字，
MyFirstWebApp。 - 位置：选择一个你喜欢的文件夹来存放项目。
- 点击 “创建”。
- 项目名称：给项目起个名字，
-
选择其他信息：
- 框架：选择最新的 .NET 8.0 (或 .NET 7.0/6.0)。
- 模板：选择 “空” (Empty) 模板，这能让我们从最简单的结构开始,更好地理解底层原理。
- 不要勾选 “使用控制器...” (Use controllers...)，因为我们先学习最基础的 Razor Pages。
- 点击 “创建”。
恭喜！你成功创建了一个 ASP.NET Core 项目。
第四部分：项目结构解析
创建好项目后,我们来认识一下主要的文件和文件夹。
MyFirstWebApp.csproj：项目文件，定义了项目的基本信息、引用的包等。Program.cs：应用程序的入口点,非常关键！Properties/launchSettings.json：启动配置文件，定义了如何运行你的应用（比如使用 IIS 还是 Kestrel，启动的 URL 等）。wwwroot/：静态文件根目录，所有 CSS, JavaScript, 图片等不需要服务器处理的文件都放在这里。Pages/：存放 Razor Pages 的目录,这是我们项目的核心。
第五部分：核心概念与实战
理解请求-响应模型
Web 的工作本质就是：客户端发送请求 -> 服务器处理 -> 服务器返回响应。
在浏览器地址栏输入 https://localhost:xxxx/ 并回车，你就发送了一个 HTTP GET 请求 到你的服务器，服务器收到后，会返回一个 HTML 响应,浏览器将其渲染成页面。
编写你的第一个页面
默认情况下，访问根路径 会返回一个 404 错误，因为我们还没有创建任何页面,让我们来创建一个首页。
- 在
Pages文件夹上右键 -> 添加 -> 新建项...。 - 选择 “Razor Page - Empty”，命名为
Index.cshtml，然后点击 “添加”。
你得到了两个文件：
Index.cshtml：视图文件，包含 HTML 和 C# 代码。Index.cshtml.cs：后台代码文件（也叫 Page Model）,用于处理逻辑。
修改页面内容
打开 Pages/Index.cshtml,把里面的内容替换成：
@page // 这个指令告诉这个文件是一个可以直接访问的页面，而不是一个被其他页面包含的组件
@model MyFirstWebApp.Pages.IndexModel
@{
ViewData["Title"] = "首页";
}
<div class="text-center">
<h1 class="display-4">欢迎来到 ASP.NET Core!</h1>
<p>这是我的第一个网页。</p>
</div>
代码解释：
@page：Razor Page 的核心指令，使该文件可以直接通过 URL 访问。@model ...：将这个页面与Index.cshtml.cs中的代码类关联起来。- Razor 代码块，用于执行 C# 代码。
ViewData["Title"] = "首页";：设置页面的标题，通常在_Layout.cshtml中被使用。
按 F5 运行你的项目,浏览器会自动打开并显示你刚刚创建的页面！
添加动态内容（C# 逻辑）
静态页面没什么意思,让我们让它动起来。
打开 Pages/Index.cshtml.cs 文件,修改如下：
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
namespace MyFirstWebApp.Pages
{
public class IndexModel : PageModel // 必须继承 PageModel
{
private readonly ILogger<IndexModel> _logger;
// 构造函数，依赖注入日志服务
public IndexModel(ILogger<IndexModel> logger)
{
_logger = logger;
}
// 这是一个属性，用于在页面上显示当前时间
public string CurrentTime { get; private set; }
// 当页面被请求时，这个方法会被自动执行
public void OnGet()
{
// 设置属性的值
CurrentTime = DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss");
}
}
}
代码解释：
public class IndexModel : PageModel：每个 Razor Page 都需要一个对应的 C# 类，并且继承自PageModel。OnGet()：这是一个 页面处理方法，当页面通过GET请求（直接在浏览器访问）时，这个方法会被自动执行，你还可以创建OnPost()方法来处理POST请求（如表单提交）。public string CurrentTime { get; private set; }：这是一个公共属性，在OnGet()中给它赋值后，我们就可以在对应的.cshtml视图中使用它。
回到 代码解释： 再次运行项目（ 恭喜你，你已经掌握了 ASP.NET Core 的最基本概念！接下来你可以按照以下路径继续深入学习： 学习 Razor Pages 的高级用法： 学习 Entity Framework Core (EF Core)： 学习 MVC 架构模式： Razor Pages 是一种简单高效的模型，但 MVC (Model-View-Controller) 是更传统、更强大的架构模式，被广泛应用于大型项目中，理解 MVC 会让你对 Web 应用架构有更深的认识。 学习身份认证与授权： 学习如何实现用户注册、登录,以及如何控制不同用户对不同页面的访问权限。
ASP.NET 是一个功能强大且现代的框架，非常适合构建各种类型的 Web 应用，从创建第一个页面开始，逐步学习处理请求、响应数据、连接数据库，你将能够构建出复杂的、专业的网站。 祝你学习愉快！Pages/Index.cshtml，修改 <h1> 标签下方的 <p>
<p>当前时间是：@Model.CurrentTime</p>
@Model：通过 @model 指令关联的 C# 类的实例，我们可以通过 @Model.属性名 来访问 IndexModel 类中定义的公共属性。F5），你会看到页面中显示了当前的实时时间！这就是动态内容的魅力。
第六部分：进阶学习路径
OnPost() 方法接收用户输入。
第七部分：学习资源推荐
