Thứ Tư, 29 tháng 3, 2017

Tạo trang Not Found 404 tuỳ chỉnh trong ASP.NET MVC

Với trang lỗi 404 Not Found mặc định trong ASP.NET nếu không được tùy chỉnh gì thì nó nhìn rất không thân thiện với người dùng ngoài ra vì là thông báo bằng tiếng Anh cho nên nhiều khách hàng sẽ không hiểu ý nghĩa lệnh thông báo hiện trên màn hình.  Vì thế, với mục đích tạo ra trang 404 thân thiện, đẹp mắt thì mình sẽ hướng dẫn các bạn cách tạo trang lỗi 404 tuỳ chỉnh đẹp cho website của bạn.


1. Trang lỗi 404 là gì?


Là trang sẽ xuất hiện mỗi khi người dùng truy cập vào web nhưng địa chỉ này không tồn tại, có thể đường dẫn này là của 1 bài viết cũ đã bị xóa, cũng có thể đó là 1 đường dẫn chưa từng tồn tại, do người dùng gõ nhầm. Trang 404 sẽ thông báo cho người dùng biết rằng bài viết đã bị xóa hoặc đường dẫn chưa từng tồn tại, và người dùng nên vào 1 đường dẫn khác, điều này giúp che dấu hacker không thể biết được những trang web của admin trang.

2. Lợi ích của trang 404 là gì?


Như đã nói ở trên, trang 404 thông báo cho người dùng biết rằng đường dẫn này đã không tồn tại hay không còn tồn tại nữa. Ngoài ra trang 404 giúp thông báo với các bots tìm kiếm trang không tồn tại và điều hướng bots trên web, việc không có trang 404 sẽ làm cho website bị đánh giá thấp vì quá nhiều đường dẫn không tồn tại và báo lỗi.

Tạo trang 404 có thể tự code hoặc các bạn có thể down template trên internet về dùng, ở đây mình hướng dẫn các bạn sử dụng template có sẵn.

Các bạn có thể vào trang web sau để down nhiều template 404 error pages https://www.freshdesignweb.com/free-404-error-page-template/

Sau khi down về các bạn giải nén ra rồi copy thư mục giải nén được vào trong project của các bạn. Ở đây mình sẽ để thư mục 404 (thư mục mình vừa giải nén được) dán vào thư mục pages mình đã tạo sẫn.



Bạn có thể tuỳ chỉnh nội dung của trang 404 bằng cách sửa nội dung trong file index của thư mục vừa copy.

Tiếp theo bạn mở file Web.config, thêm lệnh sau vào trong tag <system.web> </system.web>:

 <customErrors mode="On" >
      <error statusCode="404" redirect="~/pages/404"/>
 </customErrors>

Lưu file Web.config lại là xong. Bây giờ khi người dùng nhập URL sai thì sẽ được chuyển hướng về trang 404 do bạn tạo ra thay vì trang 404 mặc định của ASP.NET.

Trong 1 số trường hợp bạn cần gọi đến trang 404 ở trong controller thì bạn sử dụng lệnh: return Redirect("/pages/404").  

Chúc bạn thực hành thành công.


EmoticonEmoticon