ASP.NET Web Pages - 页面布局

通过 Web Pages，很容易创建布局一致的网站。

一致的外观

在因特网上，您会发现很多拥有统一外观的网站：

  • 每页拥有相同的页眉
  • 每页拥有相同的页脚
  • 每页拥有相同的样式和布局

通过 Web Pages，可以高效地实现这些。您可以得到可重复使用的代码块（内容块），比如页眉和页脚，在独立的文件中。

您也可以为所有页面定义一致的布局，使用布局模板（布局文件）。

内容块

很多网站都有需要在每张页面上显示的内容（比如页眉和页脚）。

通过 Web Pages，您可以使用 @RenderPage() 方法从不同的文件导入内容。

内容块（来自另一个文件）能够被输入网页中的任意位置，并可包含文本、标记和代码，就像任何常规的网页那样。

使用通用的页眉和页脚，会省去大量的工作。您不必在每页中编写相同的内容，并且当您改变页眉或页脚文件时，内容会在所有页面中更新。

在代码中是这样的：

实例

<html>
<body>
@RenderPage("header.cshtml")
<h1>Hello Web Pages</h1> 
<p>This is a paragraph</p>
@RenderPage("footer.cshtml")
</body>
</html>

运行实例

使用布局页面

在之前的内容中，您已看到在多个网页中引用相同的内容是很简单的。

创建一致外观的另一种方法是使用布局网页。布局网页包含网页的结构，而不是内容。当网页（内容页）链接到布局页时，它会根据布局页（模板）来显示。

布局页类似普通的网页，但是会在引用内容页的位置调用 @RenderBody() 方法。

每个内容页必须以 Layout 指令开头。

在代码中是这样的：

布局网页：

<html>
<body>
<p>这是文本。</p>
@RenderBody()
<p>© 2012 W3School. All rights reserved.</p>
</body>
</html>

任意网页：

@{Layout="Layout.cshtml";}

<h1>Welcome to W3School</h1>

<p>
这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。
这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。
这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。
</p>

运行实例

不要重复自己

通过两个 ASP.NET 工具，内容块和布局页，您能够为 web 应用程序设定一致的外观。

这些工具会为您省去大量的工作，因为您不必在所有页面上重复相同的信息。将标记、样式和代码集中起来，使得 web 应用程序更便于管理和维护。

防止代码泄露

在 ASP.NET 中，名称以下划线开头的文件无法通过 web 来浏览。

如果您希望禁止用户查看内容块或布局文件，请对文件重新命名：

  • _header.cshtm
  • _footer.cshtml
  • _Layout.cshtml

隐藏敏感信息

在 ASP.NET 中，隐藏敏感信息（数据库密码、电邮密码等）的常用方法是把这些信息保存在名为 "_AppStart" 的独立文件中。

_AppStart.cshtml

@{
WebMail.SmtpServer = "mailserver.example.com";
WebMail.EnableSsl = true;
WebMail.UserName = "username@example.com";
WebMail.Password = "your-password";
WebMail.From = "your-name-here@example.com";
}