ASP.NET Web Pages - Layout Halaman

Dengan Web Pages, dengan mudah dapat membuat situs yang memiliki layout yang seragam.

Penampilan yang seragam

Di Internet, Anda akan menemukan banyak situs yang memiliki penampilan yang seragam:

  • Setiap halaman memiliki judul yang sama
  • Setiap halaman memiliki kaki yang sama
  • Setiap halaman memiliki gaya dan layout yang sama

Dengan Web Pages, dapat dicapai dengan efisien. Anda dapat mendapatkan blok kode yang dapat diulang guna-guna (blok konten), seperti judul dan kaki halaman, di berkas yang terpisah.

Anda juga dapat menentukan layout yang seragam untuk semua halaman menggunakan template layout (berkas layout).

Blok konten

Banyak situs web memiliki konten yang harus ditampilkan di setiap halaman (seperti judul dan kaki halaman).

Dengan Web Pages, Anda dapat menggunakan @RenderPage() Metode mengimpor konten dari berkas yang berbeda.

Blok konten (dari berkas lain) dapat dimasukkan ke lokasi apapun di halaman web dan dapat mengandung teks, tag, dan kode, seperti halaman web biasa.

Menggunakan judul dan kaki halaman umum dapat menghemat banyak kerja. Anda tidak perlu menulis konten yang sama di setiap halaman, dan saat Anda merubah berkas judul atau kaki halaman, konten akan diupdate di semua halaman.

Dalam kode ini seperti ini:

Contoh

<html>
<body>
@RenderPage("header.cshtml")
<h1>Hello Halaman Web</h1> 
<p>Ini adalah paragraf</p>
@RenderPage("footer.cshtml")
</body>
</html>

运行实例

Menggunakan halaman layout

Dalam konten sebelumnya, Anda telah melihat bahwa mengutip konten yang sama di banyak halaman adalah sangat mudah.

Salah satu metode lain untuk menciptakan penampilan yang seragam adalah menggunakan halaman layout. Halaman layout mengandung struktur halaman, bukan konten. Ketika halaman (halaman konten) menghubungkan ke halaman layout, ia akan menampilkan menurut layout (template).

Halaman layout mirip seperti halaman web biasa, tetapi akan memanggil lokasi konten yang diambil @RenderBody() metode.

Setiap halaman konten harus dimulai dengan Perintah Layoutawal.

Dalam kode ini seperti ini:

Rancang halaman web:

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

任意网页：

@{Layout="Layout.cshtml";}
<h1>Welcome to CodeW3C.com</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";
}