Download

Bài thực hành lập trình thiết kế web bằng ASP.NET nâng cao – Bài 1-2

Trong bài thực hành này bạn sẽ thực hiện các thao tác cấu hình cho ứng dụng Web theo các yêu cầu dưới đây

-       Thiết đặt cấu hình Authentication cho Form trong ứng dụng Web

-       Cấu hình truy nhập cho người dùng Anonymous hoặc người dùng không được xác thực (Unauthentication)

-       Kích hoạt chế độ quản lý nhóm (Role) trong ứng dụng Web.  Tạo nhóm cho ứng dụng Web. Tạo người dùng và gán người dùng vào nhóm. Tạo quy tắc truy nhập (Rule) và kiểm tra người dùng đăng nhập

I. Thiết đặt cấu hình Authentication cho Form trong việc thiết kế web:

  1. Mở ứng dụng Web từ thư mục ASPNET_ADV_Lab21 chỉ định
    1. Chọn File-> chọn Open ->Web site
    2. Trong hộp hội thoại, chọn thư mục ASPNET_ADV_Lab21 trong thư mục chỉ định
  2. Bấm đúp vào file Web.config để xem thông tin cấu hình. Bạn sẽ thấy file này chưa được cấu hình bảo mật. Nhiệm vụ của bạn là sẽ thực hiện cấu hình trong các bước dưới đây.
  3. Sử dụng công cụ Administration Tool
    1. Trên thanh Menu, chọn Website->ASP.NET Configuration

thiết kế web

    1. Chọn Tab Security

thiết kế web

  1. Chọn Select authentication type

thiết kế web

  1. Chọn Form the internet và chọn bấm nút Done
  2. Bạn hãy mở file Web.config (chọn nút Yes nếu hộp thoại xuất hiện) sẽ thấy một thẻ mới xuất hiện như hình dưới đây

thiết kế web

  1. Bạn hãy sửa thành cặp thẻ để cấu hình thêm như hình dưới đây

thiết kế web

  1. Trong cặp thẻ <authentication>, bạn thêm thông tin cấu hình cho form đăng nhập như hình sau:

thiết kế web

  1. Hãy nhận xét về dòng bạn vừa thêm vào?
  2. Bên dưới cặp thẻ <authentication>, bạn thêm một cặp thẻ <authorization> như hình dưới đây:

thiết kế web

  1. Hãy nhận xét cặp thẻ và nội dung vừa thêm vào?
  2. Đến đây bạn đã hoàn thành việc Thiết đặt cấu hình Authentication cho Form trong ứng dụng Web.

II. Cấu hình truy nhập cho người dùng Anonymous hoặc người dùng không được xác thực (Unauthentication)

  1. Trong chế độ thiết kế web, thêm mới một Web Form và đặt tên là Login.aspx

thiết kế web

  1. Chuyển Web Form Login.aspx về chế độ html Source và copy  đoạn mã sau vào bên trong cặp thẻ <div>.

<table border="0" cellpadding="0" cellspacing="0" style="width: 896px; height: 456px;

            background-color: ivory">

            <tr>

                <td style="width: 314px; height: 164px" align="left" valign="top" title="Zion Defense Academy">

                    <asp:Image ID="imgMain" runat="server" AlternateText="Jets" Height="194px" ImageUrl="~/Images/jets.jpg"

                        Width="315px" /></td>

                <td style="height: 164px" align="left" colspan="2" valign="top">

                    <asp:Label ID="lblTitle" runat="server" Font-Bold="True" Font-Size="XX-Large" Text="Zion Defense Academy"></asp:Label></td>

            </tr>

            <tr>

                <td style="width: 314px; height: 242px" title="Zion Defense Academy">

                </td>

                <td style="height: 242px; width: 340px;" align="left" valign="middle">

                    <asp:Label ID="lblLoginId" runat="server" Text="Username:"></asp:Label>

                    <asp:TextBox ID="txtUsername" runat="server"></asp:TextBox>

                    <br />

                    <asp:Label ID="lblPassword" runat="server" Text="Password:"></asp:Label>

                    <asp:TextBox ID="txtPassword" runat="server" TextMode="Password"></asp:TextBox>

                    <br />

                    <asp:Button ID="btnLogin" runat="server" Text="Login" OnClick="btnLogin_Click" /></td>

                <td style="width: 280px; height: 242px">

                </td>

            </tr>

            <tr>

                <td style="width: 314px" title="Zion Defense Academy">

                </td>

                <td style="width: 340px">

                </td>

                <td style="width: 280px">

                </td>

            </tr>

        </table>

  1. Hãy chuyển về chế độ thiết kế web Design và xem kỹ thông tin về các thuộc tính của các control.
  2. Trong cửa sổ Soloution Explorer ở chế độ thiết kế web, bấm chuột phải lên file HomePage.aspx và chọn Set As Start Page để chạy trang này đầu tiên
  3. Bấm F5 để chạy chương trình với chế độ debug.
  4. Bạn sẽ thấy trang được chuyển tới trang Login.aspx.
  5. Hãy nhận xét xem điều gì xảy ra?

III. Kích hoạt chế độ quản lý nhóm (Role) trong ứng dụng Web.  Tạo nhóm cho ứng dụng Web. Tạo người dùng và gán người dùng vào nhóm. Tạo quy tắc truy nhập (Rule) và kiểm tra người dùng đăng nhập

  1. Sử dụng công cụ Administration Tool
    1. Trên thanh Menu, chọn Website->ASP.NET Configuration

thiết kế web

    1. Chọn Tab Security

thiết kế web

  1. Chọn Enable roles.
  2. Mở file Web.config, bạn sẽ thấy thông tin mới được cập nhật như hình dưới đây

thiết kế web

  1. Quay trở về trang Web Site Administration Tool , trong tab Security, chọn Create or Manage roles

thiết kế web

  1. Trong hộp New role name, nhập Trainer và bấm nút Add Role
  2. Tương tự nhập thêm mới một role tên là Cadet và  bấm nút Add Role

thiết kế web

  1. Bạn có thể thao tác xóa một role và tạo lại nếu nhầm lẫn hoặc muốn đặtt ên khác.
  2. Trong tab Security , bấm chọn Create User
  3. Nhập thông tin người dùng và chọn các Checkbox  tương tự như hình dưới đây và nhận xét về việc chọn đó?. Lưu ý, Checkbox Active User dùng để kích hoạt tài khoản ngay khi người dùng được tạo. Nếu mục này không chọn, bạn sẽ không thể đăng nhập sau khi tạo tài khoản mà phải chờ kích hoạt.  Chọn Trainer là nhóm bạn muốn gán cho người dùng khi được tạo. Cuối cùng bấm nút Create User để hoàn tất. Một thông điệp thông báo tạo người dùng và gán nhóm thành công.

thiết kế web

thiết kế web

 

  1. Bấm nút Continue để tiếp tục tạo tài khoản khác nếu muốn
  2. Bấm vào tab Security, và chọn Manage access rules

thiết kế web

  1. Trong cửa sổ gán quyền, bấm chọn thư mục Trainer, và thiết đặt các tùy chọn như hình dưới đây. Hãy đưa ra nhận xét cho từng thao tác? Bấm nút OK để hoàn tất

thiết kế web

  1. Trong Soloution Explorer ở chế độ thiết kế web, mở rộng thư mục Trainer, bạn sẽ thấy có thêm một file Web.config. Bấm đúp vào file này để mở. Hãy xem thông tin của file và đưa ra nhận xét đánh giá.
  2. Mở file Login.aspx ở chế độ thiết kế web.
  3. Bấm đúp vào nút Login và viết mã lệnh sau:

thiết kế web

  1. Hãy nhận xét khối lệnh.
  2. Ấn F5 để kiểm tra
  3. Nhập thông tin đăng nhập với tài khoản bạn đã tạo bước trên và bấm nút Login

thiết kế web

  1. Bạn hãy kiểm tra các trang bằng cách bấm vào các nút và đường link giữa các trang để kiểm tra kết quả
  2. Nhận xét tổng thể các bước làm trong bài thực hành.

Bạn hãy download tài liệu miễn phí bằng cách bấm nút Download trên menu bên phải.


Chúc bạn thành công!


ESVN công ty thiết kế webDịch vụ SEO - Đăng ký tên miền

Thiet ke web mien phiHoc thiet ke web

Nơi hội tụ giải pháp
Công ty  Cổ phần Eastern Sun Việt Nam