Trang web ASP.NET - Bố cục trang
Với Trang Web, thật dễ dàng để tạo một trang web có bố cục nhất quán.
Một cái nhìn nhất quán
Trên Internet, bạn sẽ khám phá nhiều trang web có giao diện nhất quán:
- Mỗi trang đều có tiêu đề giống nhau
- Mỗi trang đều có phần chân trang giống nhau
- Mỗi trang đều có kiểu dáng và bố cục giống nhau
Với các trang Web, điều này có thể được thực hiện rất hiệu quả. Bạn có thể có các khối nội dung có thể sử dụng lại (khối nội dung), như đầu trang và chân trang, trong các tệp riêng biệt.
Bạn cũng có thể xác định bố cục nhất quán cho tất cả các trang của mình bằng cách sử dụng mẫu bố cục (tệp bố cục).
Khối nội dung
Nhiều trang web có nội dung được hiển thị trên mọi trang (như đầu trang và chân trang).
Với Trang Web, bạn có thể sử dụng phương thức @RenderPage() để nhập nội dung từ các tệp riêng biệt.
Khối nội dung (từ một tệp khác) có thể được nhập vào bất kỳ đâu trong trang web và có thể chứa văn bản, đánh dấu và mã, giống như bất kỳ trang web thông thường nào.
Lấy đầu trang và chân trang thông thường làm ví dụ, điều này giúp bạn tiết kiệm rất nhiều công sức. Bạn không cần phải viết cùng một nội dung trên mỗi trang và khi bạn thay đổi tệp đầu trang hoặc chân trang, nội dung sẽ được cập nhật trên tất cả các trang của bạn.
Đây là giao diện của nó trong mã:
Ví dụ
<html>
<body>
@RenderPage("header.cshtml")
<h1>Hello Web Pages</h1>
<p>This is a paragraph</p>
@RenderPage("footer.cshtml")
</body>
</html> Chạy ví dụ » Sử dụng trang bố cục
Trong phần trước, bạn đã thấy rằng việc đưa cùng một nội dung vào nhiều trang web là điều dễ dàng.
Một cách tiếp cận khác để tạo giao diện nhất quán là sử dụng trang bố cục. Trang bố cục chứa cấu trúc chứ không phải nội dung của trang web. Khi một trang web (trang nội dung) được liên kết với một trang bố cục sẽ hiển thị theo trang bố cục (template).
Trang bố cục giống như một trang web bình thường, ngoại trừ việc gọi đến phương thức @RenderBody() nơi trang nội dung sẽ được đưa vào.
Mỗi trang nội dung phải bắt đầu bằng chỉ thị Bố cục .
Đây là giao diện của nó trong mã:
Trang bố cục:
<html>
<body>
<p>This is header text</p>
@RenderBody()
<p>© 2014 W3Schools. All rights reserved.</p>
</body>
</html>
Bất kỳ trang web nào:
@{Layout="Layout.cshtml";}
<h1>Welcome to W3Schools</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit,sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laborisnisi ut aliquip ex ea commodo consequat.
</p>
Chạy ví dụ »DRY - Đừng lặp lại chính mình
Với hai công cụ ASP.NET, Khối nội dung và Trang bố cục, bạn có thể mang lại cho ứng dụng web của mình một giao diện nhất quán.
Những công cụ này cũng giúp bạn tiết kiệm rất nhiều công sức vì bạn không phải lặp lại cùng một thông tin trên tất cả các trang. Việc tập trung đánh dấu, kiểu và mã giúp các ứng dụng web dễ quản lý và bảo trì hơn nhiều.
Ngăn chặn các tập tin được duyệt
Với ASP.NET, các tệp có tên bắt đầu bằng dấu gạch dưới không thể duyệt được từ web.
Nếu bạn muốn ngăn người dùng xem các khối nội dung hoặc tệp bố cục của mình, hãy đổi tên các tệp thành:
_header.cshtml
_footer.cshtml
_Layout.cshtml
Ẩn thông tin nhạy cảm
Với ASP.NET, cách phổ biến để ẩn thông tin nhạy cảm (mật khẩu cơ sở dữ liệu, mật khẩu email, v.v.) là giữ thông tin trong một tệp riêng biệt có tên "_AppStart".
_AppStart.cshtml
@{
WebMail.SmtpServer = "mailserver.example.com";
WebMail.EnableSsl = true;
WebMail.UserName = " [email protected] ";
WebMail.Password = "your-password";
WebMail.From = " [email protected] ";
}
