Thứ Hai, 22 tháng 4, 2019

Triển khai ứng dụng ASP.NET MVC 5 an toàn với Tư cách thành viên, OAuth và Cơ sở dữ liệu SQL vào Trang web Azure

Đăng Bởi: Admin - tháng 4 22, 2019 - 0 Bình Luận

https://c-sharp-asp-snippets.blogspot.com/2015/03/deploy-secure-aspnet-mvc-5-app-with.html?view=flipcard


















https://c-sharp-asp-snippets.blogspot.com/2015/03/deploy-secure-aspnet-mvc-5-app-with.html?view=flipcard



Hướng dẫn này chỉ cho bạn cách xây dựng một ứng dụng web ASP.NET MVC 5 an toàn cho phép người dùng đăng nhập bằng thông tin đăng nhập từ Facebook hoặc Google. Bạn cũng sẽ triển khai ứng dụng lên Azure.



Bạn có thể mở tài khoản Azure miễn phí và nếu bạn chưa có Visual Studio 2013, SDK sẽ tự động cài đặt Visual Studio 2013 cho Web Express. Bạn có thể bắt đầu phát triển cho Azure miễn phí.
Hướng dẫn này giả định rằng bạn không có kinh nghiệm trước khi sử dụng Azure. Khi hoàn thành hướng dẫn này, bạn sẽ có một ứng dụng web điều khiển dữ liệu an toàn và chạy trong đám mây và sử dụng cơ sở dữ liệu đám mây.
Bạn sẽ học:
  • Cách tạo một dự án ASP.NET MVC 5 an toàn và xuất bản nó lên một trang web Azure.
  • Cách sử dụng  OAuth  và cơ sở dữ liệu thành viên ASP.NET để bảo mật ứng dụng của bạn.
  • Cách sử dụng cơ sở dữ liệu SQL để lưu trữ dữ liệu trong Azure.
Bạn sẽ xây dựng một ứng dụng web danh sách liên hệ đơn giản được xây dựng trên ASP.NET MVC 5 và sử dụng Khung thực thể ADO.NET để truy cập cơ sở dữ liệu. Hình minh họa sau đây cho thấy trang đăng nhập cho ứng dụng đã hoàn thành:
trang đăng nhập

CHÚ THÍCH:

Trong hướng dẫn này:

Thiết lập môi trường phát triển

Để bắt đầu, hãy thiết lập môi trường phát triển của bạn bằng cách cài đặt  Azure SDK cho Visual Studio 2013 .
Nếu bạn chưa cài đặt Visual Studio, Visual Studio Express cho Web sẽ được cài đặt cùng với SDK.

CHÚ THÍCH:

Để sử dụng chứng chỉ SSL mới cho localhost, bạn sẽ cần cài đặt  Visual Studio 2013 Update 3  trở lên.

Tạo một ứng dụng ASP.NET MVC 5

Tạo dự án

  1. Từ   menu Tệp , bấm  Dự án mới .
    Dự án mới trong menu File
  2. Trong   hộp thoại Dự án mới , mở rộng  C #  và chọn  Web  trong  Mẫu đã cài đặt , sau đó chọn  Ứng dụng web ASP.NET .
  3. Đặt tên cho ứng dụng  ContactManager  và nhấn  OK .
    Hộp thoại Dự án mới
    Lưu ý:  Đảm bảo bạn nhập "ContactManager". Các khối mã mà bạn sẽ sao chép sau này giả sử rằng tên dự án là ContactManager.
  4. Trong   hộp thoại Dự án ASP.NET mới , chọn   mẫu MVC . Xác minh Xác  thực  được đặt  thành Tài khoản người dùng cá nhân *, ** Máy chủ lưu trữ trên đám mây  được chọn và  Trang web  được chọn.
    Hộp thoại dự án ASP.NET mới
  5. Trình hướng dẫn cấu hình sẽ đề xuất một tên duy nhất dựa trên  ContactManager  (xem hình ảnh bên dưới). Chọn một khu vực gần bạn. Bạn có thể sử dụng azurespeed.com  để tìm trung tâm dữ liệu có độ trễ thấp nhất.
  6. Nếu trước đây bạn chưa tạo máy chủ cơ sở dữ liệu, hãy chọn  Tạo máy chủ mới , nhập tên người dùng và mật khẩu cơ sở dữ liệu.
    Cấu hình trang web Azure
Nếu bạn có một máy chủ cơ sở dữ liệu, hãy sử dụng nó để tạo một cơ sở dữ liệu mới. Máy chủ cơ sở dữ liệu là một tài nguyên quý giá và bạn thường muốn tạo nhiều cơ sở dữ liệu trên cùng một máy chủ để thử nghiệm và phát triển thay vì tạo máy chủ cơ sở dữ liệu trên mỗi cơ sở dữ liệu. Hãy chắc chắn rằng trang web và cơ sở dữ liệu của bạn ở cùng một khu vực.
Cấu hình trang web Azure

Đặt đầu trang và chân trang

  1. Trong  Solution Explorer,  mở   tệp Layout.cshtml trong   thư mục Views \ Shared .
    _Layout.cshtml trong Solution Explorer
  2. Thay thế đánh dấu trong   tệp Layout.cshtml bằng mã sau đây. Những thay đổi được đánh dấu dưới đây.
            <! DOCTYPE html>
            <html>
            <đầu>
                <meta charset = "utf-8" />
                <meta name = "viewport" content = "width = chiều rộng thiết bị, scale-scale = 1.0">
                <title> @ ViewBag.Title - Liên hệ quản lý</ tiêu đề>
                @ Styles.Render ("~ / Nội dung / css")
                @ Sc scripts.Render ("~ / bundles / Modernizr")
            
            </ đầu>
            <cơ thể>
                <div class = "navbar navbar-inverse navbar-fixed-top">
                    <div class = "container">
                        <div class = "navbar-header">
                            .
                                <span class = "icon-bar"> </ span>
                                <span class = "icon-bar"> </ span>
                                <span class = "icon-bar"> </ span>
                            </ nút>
                            @ Html.ActionLink ("CM Demo", "Mục lục", "Cm", new {area =" "}, new {@group =" navbar-brand "})
                        </ div>
                        <div class = "sụp đổ thanh điều hướng">
                            <ul class = "nav navbar-nav">
                                <li> @ Html.ActionLink ("Nhà", "Chỉ mục", "Nhà") </ li>
                                <li> @ Html.ActionLink ("Giới thiệu", "Giới thiệu", "Trang chủ") </ li>
                                <li> @ Html.ActionLink ("Liên hệ", "Liên hệ", "Trang chủ") </ li>
                            </ ul>
                            @ Html.Partial ("_ LoginPartial")
                        </ div>
                    </ div>
                </ div>
                <div class = "thùng chứa nội dung">
                    @RenderBody ()
                    <giờ />
                    <chân trang>
                        <p> & sao chép; @ DateTime.Now.Year -Liên hệ quản lý</ p>
                    </ chân trang>
                </ div>
            
                @ ScScript.Render ("~ / bundles / jquery")
                @ Sc scripts.Render ("~ / bundles / bootstrap")
                @RenderSection ("script", bắt buộc: false)
            </ cơ thể>
            </ html>
thay đổi mã

Chạy ứng dụng cục bộ

  1. Nhấn CTRL + F5 để chạy ứng dụng.
    Trang chủ ứng dụng xuất hiện trong trình duyệt mặc định.
    Trang web chạy cục bộ
Đây là tất cả những gì bạn cần làm bây giờ để tạo ứng dụng mà bạn sẽ triển khai lên Azure.

Kích hoạt SSL cho dự án

  1. Kích hoạt SSL. Trong Solution Explorer, bấm vào   dự án ContactManager , sau đó bấm F4 để hiển thị hộp thoại thuộc tính. Thay đổi  SSL Kích hoạt  thành đúng. Sao chép  URL SSL . URL SSL sẽ là https: // localhost: 44300 / trừ khi trước đó bạn đã tạo Trang web SSL.
    bật SSL
  2. Trong Solution Explorer, bấm chuột phải vào   dự án Trình quản lý liên hệ và bấm  Thuộc tính .
  3. Trong tab bên trái, nhấp vào  Web .
  4. Thay đổi  Url dự án  để sử dụng  URL SSL  và lưu trang (Control S).
    bật SSL
  5. Xác minh Internet Explorer là trình duyệt Visual Studio khởi chạy như trong hình bên dưới:
    trình duyệt mặc định
    Bộ chọn trình duyệt cho phép bạn chỉ định trình duyệt Visual Studio khởi chạy.
    bộ chọn trình duyệt
    Bạn có thể chọn nhiều trình duyệt và cập nhật Visual Studio cho mỗi trình duyệt khi bạn thực hiện thay đổi. Để biết thêm thông tin, xem  Sử dụng Liên kết trình duyệt trong Visual Studio 2013 .
  6. Nhấn CTRL + F5 để chạy ứng dụng. Làm theo các hướng dẫn để tin tưởng vào chứng chỉ tự ký mà IIS Express đã tạo.
    hướng dẫn để tin tưởng chứng chỉ tự ký mà IIS Express đã tạo
  7. Đọc   hộp thoại Cảnh báo Bảo mật và sau đó bấm    nếu bạn muốn cài đặt chứng chỉ đại diện cho  localhost .
    cảnh báo chứng chỉ IIS của localhost
  8. IE hiển thị  Trang chủ  và không có cảnh báo SSL.
    IE với SSL localhost và không có cảnh báo
    Google Chrome cũng chấp nhận chứng chỉ và sẽ hiển thị nội dung HTTPS mà không có cảnh báo. Firefox sử dụng kho chứng chỉ của riêng mình, vì vậy nó sẽ hiển thị cảnh báo.
    Cảnh báo chứng nhận FireFox

Triển khai ứng dụng lên Azure

  1. Trong Visual Studio, bấm chuột phải vào dự án trong  Solution Explorer  và chọn  Xuất bản  từ menu ngữ cảnh.
    Xuất bản trong menu ngữ cảnh dự án
Các  Publish Web  Wizard sẽ mở ra.
  1. Trong   hộp thoại Xuất bản Web , bấm  Xuất bản .
    Công bố
    Ứng dụng bạn đã tạo hiện đang chạy trên đám mây. Lần tới khi bạn triển khai ứng dụng, chỉ các tệp đã thay đổi (hoặc mới) sẽ được triển khai.
    Chạy trong đám mây

Thêm cơ sở dữ liệu vào ứng dụng

Tiếp theo, bạn sẽ cập nhật ứng dụng để thêm khả năng hiển thị và cập nhật danh bạ và lưu trữ dữ liệu trong cơ sở dữ liệu. Ứng dụng sẽ sử dụng Entity Framework (EF) để tạo cơ sở dữ liệu và đọc và cập nhật dữ liệu.

Thêm các lớp mô hình dữ liệu cho các liên hệ

Bạn bắt đầu bằng cách tạo một mô hình dữ liệu đơn giản trong mã.
  1. Trong  Solution Explorer , bấm chuột phải vào thư mục Mô hình, bấm  Thêm , rồi  Lớp .
    Thêm lớp trong menu ngữ cảnh thư mục Mô hình
  2. Trong   hộp thoại Thêm mục mới , đặt tên tệp lớp mới là  Contact.cs , sau đó bấm  Thêm .
    Thêm hộp thoại Mục mới
  3. Thay thế nội dung của tệp Danh bạ.cs bằng mã sau đây.
    sử dụng hệ thống . Thành phầnModel . Chú thích dữ liệu ; sử dụng hệ thống . Toàn cầu hóa ; không gian tên ContactManager . Mô hình { lớp công khai Liên hệ { public int ContactId { get ; đặt ; } Tên chuỗi công khai { get ; đặt ; } Địa chỉ chuỗi công khai { get ; đặt ; } công khai 
     
     
    
          
        
                  
                  
                  
             chuỗi Thành phố { get ; đặt ; } Trạng thái chuỗi công khai { get ; đặt ; } chuỗi công khai Zip { get ; đặt ; } [ Kiểu dữ liệu ( Kiểu dữ liệu . EmailAddress )] chuỗi công khai Email { get ; đặt ; } } }     
                  
                  
            
                  
        
    
    Lớp  Danh bạ  xác định dữ liệu mà bạn sẽ lưu trữ cho mỗi liên hệ, cộng với khóa chính,  ContactID , cơ sở dữ liệu cần thiết.

Tạo các trang web cho phép người dùng ứng dụng làm việc với các liên hệ

Tính năng giàn giáo ASP.NET MVC có thể tự động tạo mã thực hiện các hành động tạo, đọc, cập nhật và xóa (CRUD).

Thêm Bộ điều khiển và chế độ xem cho dữ liệu

  1. Xây dựng dự án  (Ctrl + Shift + B) . (Bạn phải xây dựng dự án trước khi sử dụng cơ chế giàn giáo.)
  2. Trong  Solution Explorer , bấm chuột phải vào thư mục Bộ điều khiển và bấm  Thêm , rồi bấm  Bộ điều khiển .
    Thêm trình điều khiển trong menu ngữ cảnh thư mục Bộ điều khiển
  3. Trong   hộp thoại Thêm Giàn giáo , chọn  Bộ điều khiển MVC 5 có khung nhìn, sử dụng EF  và sau đó bấm  Thêm .
    Thêm giàn giáo dlg
  4. Trong   hộp thả xuống Lớp mô hình , chọn  Liên hệ (ContactManager.Models) . (Xem hình dưới đây.)
  5. Trong  lớp ngữ cảnh dữ liệu , chọn  ApplicationDbContext (ContactManager.Models) . Các  ApplicationDbContext sẽ được sử dụng cho cả DB thành viên và dữ liệu liên lạc của chúng tôi.
  6. Trong   hộp nhập văn bản tên Trình điều khiển , nhập "CmContoder" cho tên của trình điều khiển.
    Dữ liệu mới ctx dlg
  7. Nhấp vào  Thêm .
Visual Studio tạo ra các phương thức và khung nhìn của bộ điều khiển cho các hoạt động cơ sở dữ liệu CRUD cho   các đối tượng Liên hệ .

Bật Di chuyển, tạo cơ sở dữ liệu, thêm dữ liệu mẫu và trình khởi tạo dữ liệu

Nhiệm vụ tiếp theo là kích hoạt   tính năng Di chuyển mã đầu tiên để tạo cơ sở dữ liệu dựa trên mô hình dữ liệu bạn đã tạo.
  1. Trong   menu Công cụ , chọn  Trình quản lý gói NuGet  , rồi  Bảng điều khiển Trình quản lý gói . Bảng điều khiển quản lý gói trong menu Công cụ
  2. Trong   cửa sổ Gói quản lý gói , nhập lệnh sau:
    cho phép - di chuyển
    Lệnh  enable-di chuyển  tạo một   thư mục Di chuyển và nó đặt trong thư mục đó một   tệp Cấu hình .
  3. Trong   cửa sổ Gói quản lý gói , nhập lệnh sau:
    thêm - di chuyển ban đầu
    Các  add-di cư ban đầu  lệnh tạo ra một file có tên  <date_stamp> Initial  trong  Migrations  thư mục đó tạo ra cơ sở dữ liệu. Tham số đầu tiên (  Ban đầu  ) là tùy ý và được sử dụng để tạo tên của tệp. Bạn có thể thấy các tệp lớp mới trong  Solution Explorer . Trong   lớp Ban đầu ,  phương thức Lên tạo bảng Danh bạ và   phương thức Xuống(được sử dụng khi bạn muốn trở về trạng thái trước đó) bỏ nó.
  4. Mở   tệp Migations \ Configuration.cs .
  5. Thêm không gian tên sau đây.
     sử dụng ContactManager . Mô hình ; 
  6. Thay thế   phương thức Seed bằng mã sau:
    bảo vệ ghi đè void Seed ( ContactManager . Model . ApplicationDbContext bối cảnh ) { 
        bối cảnh . Liên hệ . AddOrUpdate ( p => p . Name , new Contact { Name = "Debra Garcia" , Địa chỉ = "1234 Main St" , City = "Redmond" , State = "WA" , Zip = "10999" , Email   
    
            
           
                 
                 
                 
                 
                 
                = "debra@example.com" , }, Liên hệ mới { Name = "Thorsten Weinrich" , Địa chỉ = "5678 1st Ave W" , City = "Redmond" , State = "WA" , Zip = "10999" , Email = "thorsten@example.com" , }, Liên hệ mới { Name = "Yuhong Li" , Địa chỉ = "9012 State st" , City = "Redmond", Nhà nước 
           
             
            
                  
                  
                  
                  
                  
                  
            
             
            
                  
                  
                  
                 = "WA" , Zip = "10999" , Email = "yuhong@example.com" , }, Liên hệ mới { Name = "Jon Orton" , Địa chỉ = "3456 Maple St" , City = "Redmond" , State = " WA " , Zip = " 10999 " , Email = " jon@example.com " , }, Liên hệ mới { Name = " Diliana Alexieva-Bosseva " ,Địa chỉ = 
                  
                  
            
             
            
                  
                  
                  
                  
                  
                  
            
             
            
                  
                  "7890 2nd Ave E" , City = "Redmond" , State = "WA" , Zip = "10999" , Email = "Diliana@example.com" , } ); }
                  
                  
                  
                  
            
            
    
    Mã này khởi tạo (hạt giống) cơ sở dữ liệu với thông tin liên hệ. Để biết thêm thông tin về seeding cơ sở dữ liệu, hãy xem  DB DB của Seeding and Debugging Entity Framework (EF) .
  7. Trong  Bảng điều khiển quản lý gói,  nhập lệnh:
    cập nhật - cơ sở dữ liệu
    Lệnh Console Manager
    Cơ  sở dữ liệu cập nhật  chạy di chuyển đầu tiên tạo cơ sở dữ liệu. Theo mặc định, cơ sở dữ liệu được tạo dưới dạng cơ sở dữ liệu SQL Server Express LocalDB.
  8. Nhấn CTRL + F5 để chạy ứng dụng, rồi bấm vào   liên kết CM Demo ; hoặc điều hướng đến http: // localhost: (port #) / Cm.
    Ứng dụng hiển thị dữ liệu hạt giống và cung cấp chỉnh sửa, chi tiết và xóa liên kết. Bạn có thể tạo, chỉnh sửa, xóa và xem dữ liệu.
    Giao diện MVC của dữ liệu

Thêm nhà cung cấp OAuth2

OAuth  là một giao thức mở cho phép ủy quyền an toàn theo phương pháp đơn giản và tiêu chuẩn từ các ứng dụng web, di động và máy tính để bàn. Mẫu internet ASP.NET MVC sử dụng OAuth để hiển thị Facebook, Twitter, Google và Microsoft là nhà cung cấp xác thực. Mặc dù hướng dẫn này chỉ sử dụng Google làm nhà cung cấp xác thực, bạn có thể dễ dàng sửa đổi mã để sử dụng bất kỳ nhà cung cấp nào trong số này. Các bước để thực hiện các nhà cung cấp khác rất giống với các bước bạn sẽ thấy trong hướng dẫn này. Để sử dụng Facebook làm nhà cung cấp xác thực, hãy xem Hướng dẫn ứng dụng MVC 5 của tôi  với Đăng nhập Facebook, Twitter, LinkedIn và Google OAuth2  .
Ngoài xác thực, hướng dẫn cũng sẽ sử dụng các vai trò để thực hiện ủy quyền. Chỉ những người dùng bạn thêm vào   vai trò canEdit mới có thể thay đổi dữ liệu (nghĩa là tạo, chỉnh sửa hoặc xóa danh bạ).
Làm theo các hướng dẫn trong Hướng dẫn ứng dụng MVC 5 của tôi  với Đăng nhập Facebook, Twitter, LinkedIn và Google OAuth2  trong phần  Tạo ứng dụng Google cho OAuth 2 để thiết lập ứng dụng Google cho OAuth2 . Chạy và kiểm tra ứng dụng để xác minh bạn có thể đăng nhập bằng xác thực Google.

Sử dụng API thành viên

Trong phần này, bạn sẽ thêm người dùng cục bộ và   vai trò canEdit vào cơ sở dữ liệu thành viên. Chỉ những người dùng trong   vai trò canEdit mới có thể chỉnh sửa dữ liệu. Cách thực hành tốt nhất là đặt tên cho các vai trò bằng các hành động mà chúng có thể thực hiện, vì vậy  canEdit  được ưu tiên hơn một vai trò gọi là  quản trị viên . Khi ứng dụng của bạn tiến hóa bạn có thể thêm vai trò mới như  canDeleteMembers  chứ không phải là ít mô tả  trị cấp cao .
  1. Mở   tệp di chuyển \ configure.cs và thêm các using câu lệnh sau  :
    sử dụng Microsoft . AspNet . Danh tính ; sử dụng Microsoft . AspNet . Danh tính . EntityFramework ; 
     
  2. Thêm  phương thức AddUserAndRole sau  vào lớp:
     bool AddUserAndRole ( ContactManager . Models . ApplicationDbContext bối cảnh ) { IdentityResult ir ; var rm = new RoleManager < IdentityRole > ( new RoleStore < IdentityRole > ( bối cảnh )); 
        ir = rm . Tạo ( IdentityRole mới ( "canEdit" )); var um = mới UserManager < 
     
        
          
              
          ApplicationUser > ( UserStore mới < ApplicationUser > ( bối cảnh )); var user = new ApplicationUser () { UserName = "user1@contoso.com" , }; 
        ir = um . Tạo ( người dùng , "P_assw0rd1" ); if ( ir . Succeeded == false ) return ir . Thành công ; 
        ir = um . AddToRole
             
          
        
             
         
           
           ( người dùng . Id , "canEdit" ); trở lại ir . Thành công ; } 
        
     
  3. Gọi phương thức mới từ   phương thức Seed :
        bảo vệ ghi đè void Seed (ContactManager.Models.ApplicationDbContext bối cảnh)
        {
            AddUserAndRole (bối cảnh);
            bối cảnh.Contacts.AddOrUpdate (p => p.Name,
                // Mã bị xóa cho ngắn gọn
        }
    
    Các hình ảnh sau đây cho thấy những thay đổi của   phương pháp Seed :
    mã hình ảnh
Mã này tạo ra một vai trò mới gọi là  canEdit , tạo một người dùng cục bộ mới  user1@contoso.com và thêm  user1@contoso.com  vào   vai trò canEdit . Để biết thêm thông tin, hãy xem  trang tài nguyên Nhận dạng ASP.NET .

Sử dụng mã tạm thời để thêm người dùng đăng nhập xã hội mới vào vai trò canEdit

Trong phần này bạn sẽ tạm thời thay đổi  ExternalLoginConfirmation  phương pháp trong điều khiển tài khoản để thêm người dùng mới đăng ký với nhà cung cấp OAuth cho  canEdit  vai trò. Chúng tôi sẽ tạm thời sửa đổi   phương thức InternalLoginConf Confirmation để tự động thêm người dùng mới vào vai trò quản trị. Cho đến khi chúng tôi cung cấp một công cụ để thêm và quản lý vai trò, chúng tôi sẽ sử dụng mã đăng ký tự động tạm thời bên dưới. Chúng tôi hy vọng sẽ cung cấp một công cụ tương tự như  WSAT  trong tương lai cho phép bạn tạo và chỉnh sửa tài khoản và vai trò của người dùng. Sau đó trong hướng dẫn tôi sẽ chỉ cho bạn cách sử dụng  Server Explorer  để thêm người dùng vào vai trò.
  1. Mở  Controller \ AccountController.cs  tập tin và điều hướng đến  ExternalLoginConfirmation  phương pháp.
  2. Thêm cuộc gọi sau vào  AddToRoleAsync  ngay trước   cuộc gọi SignInAsync .
            chờ đợi UserManager . AddToRoleAsync ( người dùng . Id , "canEdit" ); 
Đoạn mã trên thêm người dùng mới đăng ký vào vai trò "canEdit", cho phép họ truy cập vào các phương thức hành động thay đổi (chỉnh sửa) dữ liệu. Một hình ảnh của sự thay đổi mã được hiển thị dưới đây:
mã
Sau đó trong hướng dẫn, bạn sẽ triển khai ứng dụng lên Azure, nơi bạn sẽ đăng nhập bằng Google hoặc nhà cung cấp xác thực bên thứ ba khác. Điều này sẽ thêm tài khoản mới đăng ký của bạn vào   vai trò canEdit . Bất cứ ai tìm thấy URL trang web của bạn và có ID Google đều có thể đăng ký và cập nhật cơ sở dữ liệu của bạn. Để ngăn chặn người khác làm điều đó, bạn có thể dừng trang web. Bạn sẽ có thể xác minh ai là người có   vai trò canEdit bằng cách kiểm tra cơ sở dữ liệu.
Trong  Bảng điều khiển Trình quản lý gói,  nhấn phím mũi tên lên để hiển thị lệnh sau:
    Cập nhật - Cơ sở dữ liệu
Chạy lệnh  Update-Database  sẽ chạy   phương thức Seed và nó sẽ chạy  AddUserAndRole  mà bạn vừa thêm. Các  AddUserAndRole  sẽ tạo người dùng  user1@contoso.com  và thêm cô đến  canEdit  vai trò.

Bảo vệ Ứng dụng bằng SSL và Thuộc tính ủy quyền

Trong phần này, bạn sẽ áp dụng   thuộc tính Authorize để hạn chế quyền truy cập vào các phương thức hành động. Người dùng ẩn danh sẽ chỉ có thể xem   phương thức hành động Index của bộ điều khiển gia đình. Người dùng đã đăng ký sẽ có thể xem dữ liệu liên hệ (trang  Chỉ mục  và  Chi tiết  của bộ điều khiển Cm), trang Giới thiệu và trang Liên hệ. Chỉ người dùng trong   vai trò canEdit mới có thể truy cập các phương thức hành động thay đổi dữ liệu.
  1. Thêm   bộ lọc Ủy quyền và   bộ lọc RequireHttps vào ứng dụng. Một cách tiếp cận khác là thêm   thuộc tính Authorize và thuộc tính  RequireHttps vào mỗi bộ điều khiển, nhưng nó được coi là cách thực hành tốt nhất về bảo mật để áp dụng chúng cho toàn bộ ứng dụng. Bằng cách thêm chúng trên toàn cầu, mọi bộ điều khiển và phương thức hành động mới mà bạn thêm sẽ tự động được bảo vệ, bạn sẽ không cần phải nhớ áp dụng chúng. Để biết thêm thông tin, hãy xem  Bảo mật ứng dụng ASP.NET MVC của bạn và Thuộc tính AllowAnonymous mới . Mở   tệp App_Start \ FilterConfig.cs và thay thế   phương thức RegisterGlobalFilters bằng cách sau (thêm hai bộ lọc):
        khoảng trống tĩnh công cộng
        RegisterGlobalFilters (bộ lọc GlobalFilterCollection)
        {
            bộ lọc.Add (new HandleErrorAttribution ());
            bộ lọc.Add (new System.Web.Mvc.AuthorizeAttribution ());
            bộ lọc.Add (new RequireHttpsAttribution ());
        }
        
    Bộ   lọc ủy quyền được áp dụng trong mã ở trên sẽ ngăn người dùng ẩn danh truy cập bất kỳ phương thức nào trong ứng dụng. Bạn sẽ sử dụng  thuộc tính AllowAnonymous để từ chối yêu cầu cấp phép theo một vài phương thức, để người dùng ẩn danh có thể đăng nhập và có thể xem trang chủ. Các  RequireHttps  sẽ yêu cầu tất cả các truy cập vào các ứng dụng web được thông qua HTTPS.
  2. Thêm   thuộc tính AllowAnonymous vào   phương thức Index của bộ điều khiển Home. Các  AllowAnonymous  thuộc tính cho phép bạn trắng-list những phương pháp bạn muốn chọn không tham gia được ủy quyền. Một hình ảnh của một phần của HomeContoder được hiển thị bên dưới:
    mã
  3. Thực hiện tìm kiếm toàn cầu cho  AllowAnonymous , bạn có thể thấy nó được sử dụng trong các phương thức đăng nhập và đăng ký của Trình điều khiển tài khoản.
  4. Trong  CmControll.cs , hãy thêm  [Authorize(Roles = "canEdit")] vào các phương thức HttpGet và HttpPost thay đổi dữ liệu (Tạo, Chỉnh sửa, Xóa, mọi phương thức hành động trừ Chỉ mục và Chi tiết) trong   bộ điều khiển Cm . Một phần của mã hoàn thành được hiển thị dưới đây:
    img của mã
  5. Nếu bạn vẫn đăng nhập từ phiên trước, hãy nhấn vào   liên kết Đăng xuất .
  6. Nhấp vào   liên kết Giới thiệu  hoặc  Liên hệ . Bạn sẽ được chuyển hướng đến trang đăng nhập vì người dùng ẩn danh không thể xem các trang đó.
  7. Nhấp vào   liên kết Đăng ký dưới dạng liên kết người dùng mới và thêm người dùng cục bộ bằng email  joe@contoso.com . Xác minh  Joe  có thể xem các trang Home, About và Contact.
    đăng nhập
  8. Nhấp vào   liên kết CM Demo và xác minh bạn thấy dữ liệu.
  9. Nhấp vào liên kết chỉnh sửa trên trang, bạn sẽ được chuyển hướng đến trang đăng nhập (vì người dùng cục bộ mới không được thêm vào   vai trò canEdit ).
  10. Đăng nhập với tên  user1@contoso.com  bằng mật khẩu của "P_assw0rd1" ("0" trong "word" là số không). Bạn sẽ được chuyển hướng đến trang chỉnh sửa bạn đã chọn trước đó. 
    Nếu bạn không thể đăng nhập bằng tài khoản và mật khẩu đó, hãy thử sao chép mật khẩu từ mã nguồn và dán nó. Nếu bạn vẫn không thể đăng nhập, hãy kiểm tra  cột Tên người dùng của   bảng AspNetUsers để xác minh  user1@contoso.com  đã được thêm.
  11. Xác nhận bạn có thể thay đổi dữ liệu.

Triển khai ứng dụng lên Azure

  1. Trong Visual Studio, bấm chuột phải vào dự án trong  Solution Explorer  và chọn  Xuất bản  từ menu ngữ cảnh.
    Xuất bản trong menu ngữ cảnh dự án
    Các  Publish Web  Wizard sẽ mở ra.
  2. Bấm vào   tab Cài đặt ở bên trái   hộp thoại Xuất bản Web . Nhấp vào   biểu tượng v để chọn  chuỗi kết nối từ xa cho ApplicationDbContext  và chọn  ContactManagerNN_db .
    cài đặt
  3. Trong  ContactManagerContext , chọn  Thực thi di chuyển mã đầu tiên .
    cài đặt
  4. Nhấp vào  Xuất bản .
  5. Đăng nhập với tên  user1@contoso.com  (với mật khẩu của "P_assw0rd1") và xác minh bạn có thể chỉnh sửa dữ liệu.
  6. Đăng xuất.
  7. Chuyển đến  Bảng điều khiển dành cho nhà phát triển của Google  và trên   tab Thông tin xác thực cập nhật các cơ quan URIS và JavaScript chuyển hướng để sử dụng URL Azure.
  8. Đăng nhập bằng Google hoặc Facebook. Điều đó sẽ thêm tài khoản Google hoặc Facebook vào   vai trò canEdit . Nếu bạn gặp lỗi HTTP 400 với thông báo URI chuyển hướng trong yêu cầu: https: // contactmanager {phiên bản của tôi} .azurewebsites.net / đăng nhập-google không khớp với URI chuyển hướng đã đăng ký. , bạn sẽ phải đợi cho đến khi những thay đổi bạn thực hiện được tuyên truyền. Nếu bạn gặp lỗi này sau hơn một phút, hãy xác minh các URI là chính xác.

Dừng trang web để ngăn người khác đăng ký

  1. Trong  Server Explorer , điều hướng đến  trang web .
  2. Nhấp chuột phải vào từng trường hợp Trang web và chọn  Dừng trang web .
    dừng trang web
    Ngoài ra, từ cổng quản lý Azure, bạn có thể chọn trang web, sau đó nhấp vào   biểu tượng dừng ở cuối trang.
    dừng trang web

Xóa AddToRoleAsync, xuất bản và kiểm tra

  1. Nhận xét hoặc xóa mã sau khỏi   phương thức InternalLoginConf Confirmation trong Trình điều khiển tài khoản: await UserManager.AddToRoleAsync(user.Id, "canEdit");
  2. Xây dựng dự án (giúp lưu các thay đổi tệp và xác minh rằng bạn không có bất kỳ lỗi biên dịch nào).
  3. Bấm chuột phải vào dự án trong  Solution Explorer  và chọn  Xuất bản .
    Xuất bản trong menu ngữ cảnh dự án
  4. Nhấp vào nút  Bắt đầu xem trước  . Chỉ các tệp cần được cập nhật mới được triển khai.
  5. Bắt đầu trang web từ Visual Studio hoặc từ Cổng thông tin. Bạn sẽ không thể xuất bản trong khi trang web bị dừng.
    bắt đầu trang web
  6. Quay trở lại Visual Studio và bấm  Xuất bản .
  7. Ứng dụng Azure của bạn mở ra trong trình duyệt mặc định của bạn. Nếu bạn đã đăng nhập, hãy đăng xuất để bạn có thể xem trang chủ dưới dạng người dùng ẩn danh.
  8. Nhấp vào   liên kết Giới thiệu . Bạn sẽ được chuyển hướng đến trang Đăng nhập.
  9. Nhấp vào   liên kết Đăng ký trên trang Đăng nhập và tạo tài khoản cục bộ. Chúng tôi sẽ sử dụng tài khoản cục bộ này để xác minh bạn có thể truy cập các trang chỉ đọc nhưng bạn không thể truy cập các trang thay đổi dữ liệu (được bảo vệ bởi   vai trò canEdit ). Sau đó trong hướng dẫn, chúng tôi sẽ loại bỏ quyền truy cập tài khoản địa phương.
    Ghi danh
  10. Xác minh bạn có thể điều hướng đến các trang  Giới thiệu  và  Liên hệ  .
    Đăng xuất
  11. Nhấp vào   liên kết CM Demo để điều hướng đến   bộ điều khiển Cm . Ngoài ra, bạn có thể nối  Cm  vào URL.
    Trang CM
  12. Nhấp vào liên kết Chỉnh sửa. Bạn sẽ được chuyển hướng đến trang đăng nhập. Trong  Sử dụng dịch vụ khác để đăng nhập , Nhấp vào Google hoặc Facebook và đăng nhập bằng tài khoản bạn đã đăng ký trước đó. (Nếu bạn đang làm việc nhanh chóng và cookie phiên của bạn chưa hết thời gian, bạn sẽ tự động đăng nhập bằng tài khoản Google hoặc Facebook bạn đã sử dụng trước đó.)
  13. Xác minh bạn có thể chỉnh sửa dữ liệu trong khi đăng nhập vào tài khoản đó. Lưu ý:  Bạn không thể đăng xuất khỏi Google từ ứng dụng này và đăng nhập vào một tài khoản google khác có cùng trình duyệt. Nếu bạn đang sử dụng một trình duyệt, bạn sẽ phải điều hướng đến Google và đăng xuất. Bạn có thể đăng nhập bằng một tài khoản khác từ cùng một trình xác thực bên thứ ba (chẳng hạn như Google) bằng cách sử dụng một trình duyệt khác.
Nếu bạn chưa điền tên và họ của thông tin tài khoản Google của bạn, NullReferenceException sẽ xảy ra.

Kiểm tra SQL Azure DB

  1. Trong  Server Explorer , điều hướng đến  ContactDB
  2. Nhấp chuột phải vào  ContactDB  và chọn  Mở trong SQL Server Object Explorer .
    mở trong SSOX
Lưu ý:  Nếu bạn không thể mở rộng  Cơ sở dữ liệu SQL  và  không thể  thấy  ContactDB  từ Visual Studio, bạn sẽ phải làm theo các hướng dẫn bên dưới để mở cổng tường lửa hoặc một loạt cổng. Thực hiện theo các hướng dẫn bên dưới  Thiết lập quy tắc tường lửa Azure . Bạn có thể phải chờ vài phút để truy cập cơ sở dữ liệu sau khi thêm quy tắc tường lửa.
  1. Nhấp chuột phải vào   bảng AspNetUsers và chọn  Xem dữ liệu .
    Trang CM
  2. Lưu ý Id từ tài khoản Google mà bạn đã đăng ký có   vai trò canEdit và Id của  user1@contoso.com . Đây phải là những người dùng duy nhất trong   vai trò canEdit . (Bạn sẽ xác minh rằng trong bước tiếp theo.)
    Trang CM
  3. Trong  SQL Server Object Explorer , nhấp chuột phải vào  AspNetUserRoles  và chọn  Xem dữ liệu .
    Trang CM
Xác minh các  UserId là từ  user1@contoso.com  và tài khoản Google bạn đã đăng ký.

Thiết lập quy tắc tường lửa Azure

Làm theo các bước trong phần này nếu bạn không thể kết nối với SQL Azure từ Visual Studio hoặc nếu bạn gặp hộp thoại báo lỗi "Không thể mở máy chủ".
lỗi tường lửa
Bạn sẽ cần thêm địa chỉ IP của mình vào các IP được phép.
  1. Trong Cổng thông tin Azure, chọn  Cơ sở dữ liệu SQL  ở tab bên trái.
    Chọn SQL
  2. Nhấp vào  ContactDB .
  3. Nhấp vào liên kết  Thiết lập quy tắc tường lửa Azure cho  liên kết địa chỉ IP này .
    quy tắc tường lửa
  4. Khi bạn được nhắc với "Địa chỉ IP hiện tại xxx.xxx.xxx.xxx không được bao gồm trong các quy tắc tường lửa hiện có. Bạn có muốn cập nhật các quy tắc tường lửa không?", Nhấp vào   . Thêm địa chỉ này thường không đủ đằng sau một số tường lửa của công ty, bạn sẽ cần thêm một loạt địa chỉ IP.
Bước tiếp theo là thêm một loạt các địa chỉ IP được phép.
  1. Trong Cổng thông tin Azure, bấm vào  Cơ sở dữ liệu SQL .
  2. Chọn   tab Máy chủ , rồi bấm vào máy chủ bạn muốn định cấu hình.
    Tab máy chủ trong Azure
  3. Nhấp vào   tab Cấu hình .
  4. Thêm một tên quy tắc, bắt đầu và kết thúc địa chỉ IP.
    Phạm vi ip
  5. Ở dưới cùng của trang, bấm  Lưu .
  6. Vui lòng để lại phản hồi và cho tôi biết nếu bạn cần thêm một dải địa chỉ IP để kết nối.
Cuối cùng, bạn có thể kết nối với phiên bản Cơ sở dữ liệu SQL từ SQL Server Object Explorer (SSOX)
  1. Từ menu View, bấm  SQL Server Object Explorer .
  2. Nhấp chuột phải vào  SQL Server  và chọn  Thêm SQL Server .
  3. Trong  Kết nối với máy chủ  hộp thoại, thiết lập  xác thực  cho  SQL Server Authentication . Bạn sẽ nhận được  tên Máy chủ  và  Đăng nhập  từ Cổng thông tin Azure.
  4. Trong trình duyệt của bạn, điều hướng đến cổng thông tin và chọn  Cơ sở dữ liệu SQL .
  5. Chọn  ContactDB , sau đó bấm  Xem chuỗi kết nối Cơ sở dữ liệu SQL .
  6. Từ   trang Chuỗi kết nối , sao chép  Máy chủ  và  ID người dùng .
    chuỗi con
  7. Vượt qua các   giá trị Máy chủ  và  ID người dùng vào   hộp thoại Kết nối với máy chủ trong Visual Studio. Các  User ID  giá trị đi vào  Login  nhập cảnh. Nhập mật khẩu bạn đã sử dụng để tạo SQL DB.
    Kết nối với máy chủ DLG
Bây giờ bạn có thể điều hướng đến Liên hệ DB bằng cách sử dụng các hướng dẫn được cung cấp trước đó.

Để thêm người dùng vào vai trò canEdit bằng cách chỉnh sửa các bảng cơ sở dữ liệu

Trước đó trong hướng dẫn bạn đã sử dụng mã để thêm người dùng vào vai trò canEdit. Một phương pháp khác là thao tác trực tiếp dữ liệu trong các bảng thành viên. Các bước sau đây cho thấy cách sử dụng phương pháp thay thế này để thêm người dùng vào vai trò.
  1. Trong  SQL Server Object Explorer , nhấp chuột phải vào  AspNetUserRoles  và chọn  Xem dữ liệu .
    Trang CM
  2. Sao chép  RoleId  và dán nó vào hàng trống (mới).
    Trang CM
  3. Trong   bảng AspNetUsers, tìm người dùng bạn muốn đặt vai trò và sao chép Id người dùng  , sau đó dán nó vào   cột UserId của  bảng AspNetUserRoles .
Chúng tôi đang làm việc trên một công cụ sẽ giúp quản lý người dùng và vai trò dễ dàng hơn nhiều.

Bước tiếp theo

Thực hiện theo các hướng dẫn của tôi dựa trên mẫu này:
  1. Tạo một ứng dụng web ASP.NET MVC 5 an toàn với đăng nhập, xác nhận email và đặt lại mật khẩu
  2. Ứng dụng ASP.NET MVC 5 với SMS và email Xác thực hai yếu tố
  3. Thực tiễn tốt nhất để triển khai mật khẩu và dữ liệu nhạy cảm khác vào ASP.NET và Azure
  4. Tạo ứng dụng ASP.NET MVC 5 với Facebook và Google OAuth2  Điều này bao gồm các hướng dẫn về cách thêm dữ liệu hồ sơ vào DB đăng ký người dùng và để được hướng dẫn chi tiết về cách sử dụng Facebook làm nhà cung cấp xác thực.
  5. Bắt đầu với ASP.NET MVC 5
Để bật các nút đăng nhập xã hội được hiển thị ở đầu hướng dẫn này, hãy xem Các  nút đăng nhập xã hội khá cho ASP.NET MVC 5 .
Sự bắt đầu tuyệt vời của Tom Dykstra  với EF và MVC  sẽ cho bạn thấy lập trình MVC và EF tiên tiến hơn.
Hướng dẫn này và ứng dụng mẫu được viết bởi  Rick Anderson  (Twitter  @RickAndMSFT ) với sự hỗ trợ từ Tom Dykstra và Barry Dorrans (Twitter  @blowdart ).
Vui lòng để lại phản hồi  về những gì bạn thích hoặc những gì bạn muốn thấy được cải thiện, không chỉ về bản thân hướng dẫn mà còn về các sản phẩm mà nó thể hiện. Phản hồi của bạn sẽ giúp chúng tôi ưu tiên cải tiến. Bạn cũng có thể yêu cầu và bỏ phiếu cho các chủ đề mới tại  Show Me How With Code .

Phản Hồi Độc Giả

Một số lưu ý khi bình luận

Mọi bình luận sai nội quy sẽ bị xóa mà không cần báo trước (xem nội quy)

Bấm Thông báo cho tôi bên dưới khung bình luận để nhận thông báo khi admin trả lời

Để bình luận một đoạn code, hãy mã hóa code trước nhé