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 CodeW3C.com. 모든 권리 보존.</p>
</body>
</html>

임의의 웹 페이지:

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