ASP.NET Web Pages - ページレイアウト

Web Pagesを使用して、レイアウトが一貫したウェブサイトを作成することが容易です。

一貫した外観

インターネット上には、統一された外観を持つ多くのウェブサイトがあります：

  • 各ページに同じヘッダーがあります
  • 各ページに同じフッターがあります
  • 各ページに同じスタイルとレイアウトがあります

Web Pagesを使用して、これらを実行効率よく実現できます。ヘッダーやフッターのような繰り返しの多いコードブロックを、独立したファイルに持っていきます。

すべてのページに一貫したレイアウトを定義することもできます。レイアウトテンプレート（レイアウトファイル）を使用します。

コンテンツブロック

多くのウェブサイトには、各ページに表示する必要がある内容があります（例えば、ヘッダーやフッター）。

Web Pagesを使用して、 @RenderPage() 方法から異なるファイルに内容をインポートします。

コンテンツブロック（別のファイルから）は、ウェブページのどこにでも挿入され、テキスト、タグ、コードを含み、通常のウェブページと同じように動作します。

一般的なヘッダーやフッターを使用することで、多くの作業を省くことができます。各ページで同じ内容を書かなくても良く、ヘッダーやフッターのファイルを変更した場合、すべてのページで内容が更新されます。

コードではこのようにです：

例

<html>
<body>
@RenderPage("header.cshtml")
<h1>Hello Web Pages</h1> 
<p>これは段落です</p>
@RenderPage("footer.cshtml")
</body>
</html>

実行例

レイアウトページを使用して

前の内容では、同じ内容を複数のウェブページで簡単に参照することをご覧いただきました。

一貫した外観を作成するもう一つの方法は、レイアウトページを使用することです。レイアウトページは内容ではなく、ページの構造を含んでいます。ウェブページ（コンテンツページ）がレイアウトページ（テンプレート）にリンクされると、それに基づいて表示されます。

レイアウトページは通常のウェブページと同様ですが、コンテンツページを参照する場所で呼び出されます。 @RenderBody() 方法。

各コンテンツページは必ず以下の形式で始まる必要があります： レイアウト命令冒頭。

コードではこのようにです：

ウェブページのレイアウト：

<html>
<body>
<p>これはテキスト。</p>
@RenderBody()
<p>© 2012 CodeW3C.com. 全ての権利は保留されます。</p>
</body>
</html>

任意のウェブページ：

@{Layout="Layout.cshtml";}
<h1>CodeW3C.com ウェルカム</h1>
<p>
これはテキストです。これはテキストです。これはテキストです。これはテキストです。これはテキストです。これはテキストです。これはテキストです。これはテキストです。
これはテキストです。これはテキストです。これはテキストです。これはテキストです。これはテキストです。これはテキストです。これはテキストです。これはテキストです。
これはテキストです。これはテキストです。これはテキストです。これはテキストです。これはテキストです。これはテキストです。これはテキストです。これはテキストです。
</p>

実行例

自己複製を避ける

二つの ASP.NET ツール、コンテンツブロックとレイアウトページを使用して、ウェブアプリケーションに一貫した外観を設定できます。

これらのツールは、すべてのページで同じ情報を繰り返す必要がないため、多くの作業を節約します。マークアップ、スタイル、コードを集中させ、ウェブアプリケーションの管理とメンテナンスを容易にします。

コード漏洩を防ぐ

ASP.NET では、名前がアンダースコアで始まるファイルはウェブでブラウズできません。

ユーザーがコンテンツブロックやレイアウトファイルを表示できないようにする場合は、ファイル名を再命名してください：

  • _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";
}