Приложение ASP.NET MVC 5 с двухфакторной проверкой подлинности по SMS и электронной почте

Статья
07/13/2023

В этом руководстве показано, как создать веб-приложение ASP.NET MVC 5 с проверкой подлинности Two-Factor. Прежде чем продолжить, завершите создание безопасного веб-приложения ASP.NET MVC 5 с помощью входа, подтверждения электронной почты и сброса пароля . Готовое приложение можно скачать здесь. Скачивание содержит вспомогательные средства отладки, которые позволяют проверить подтверждение электронной почты и SMS без настройки поставщика электронной почты или SMS.

Это руководство было написано Риком Андерсоном (Rick Anderson ) (Twitter: @RickAndMSFT ).

Создание приложения MVC ASP.NET
Настройка SMS для двухфакторной проверки подлинности
Включение двухфакторной проверки подлинности
Дополнительные ресурсы

Создание приложения MVC ASP.NET

Начните с установки и запуска Visual Studio Express 2013 для Web или более поздней версии.

Примечание

Предупреждение. Прежде чем продолжить, завершите создание безопасного веб-приложения ASP.NET MVC 5 с помощью входа, подтверждения электронной почты и сброса пароля . Для работы с этим руководством необходимо установить Visual Studio 2013 обновление 3 или более поздней версии.

Создайте веб-проект ASP.NET и выберите шаблон MVC. веб-формы также поддерживает ASP.NET Identity, поэтому вы можете выполнить аналогичные действия в приложении веб-форм.
Оставьте проверку подлинности по умолчанию учетными записями отдельных пользователей. Если вы хотите разместить приложение в Azure, оставьте флажок проверка. Далее в этом руководстве мы развернем его в Azure. Вы можете открыть учетную запись Azure бесплатно.
Задайте для проекта использование SSL.

Настройка SMS для двухфакторной проверки подлинности

В этом руководстве содержатся инструкции по использованию Twilio или ASPSMS, но вы можете использовать любой другой поставщик SMS.

Создание учетной записи пользователя с помощью поставщика SMS

Создайте учетную запись Twilio или ASPSMS .
Установка дополнительных пакетов или добавление ссылок на службы

Twilio:
В консоли диспетчера пакетов введите следующую команду.
Install-Package Twilio

ASPSMS:
Необходимо добавить следующую ссылку на службу:

Адрес:
https://webservice.aspsms.com/aspsmsx2.asmx?WSDL

Пространство имен:
ASPSMSX2
Определение учетных данных пользователя поставщика SMS

Twilio:
На вкладке Панель мониторинга учетной записи Twilio скопируйте идентификатор безопасности учетной записи и маркер проверки подлинности.

ASPSMS:
В параметрах учетной записи перейдите в раздел Userkey и скопируйте его вместе со своим самоопределитым паролем.

Позже эти значения будут сохранены в файлеweb.config в ключах "SMSAccountIdentification" и "SMSAccountPassword" .
Указание SenderID или инициатора

Twilio:
На вкладке Числа скопируйте свой номер телефона Twilio.

ASPSMS:
В меню Разблокировать источники разблокируйте один или несколько источников или выберите буквенно-цифровой инициатор (не поддерживается всеми сетями).

Позже мы будем хранить это значение в файлеweb.config в ключе "SMSAccountFrom" .
Передача учетных данных поставщика SMS в приложение

Сделайте учетные данные и номер телефона отправителя доступными для приложения. Чтобы упростить все, мы сохраним эти значения в файлеweb.config . При развертывании в Azure значения можно безопасно хранить в разделе параметров приложения на вкладке настройки веб-сайта.
```
</connectionStrings>
   <appSettings>
      <add key="webpages:Version" value="3.0.0.0" />
      
      
      <add key="mailAccount" value="account" />
      <add key="mailPassword" value="password" />
      <add key="SMSAccountIdentification" value="My Identification" />
      <add key="SMSAccountPassword" value="My Password" />
      <add key="SMSAccountFrom" value="+12065551234" />
   </appSettings>
  <system.web>
```
Предупреждение

Безопасность. Никогда не храните конфиденциальные данные в исходном коде. Учетная запись и учетные данные добавляются в приведенный выше код, чтобы упростить пример. Ознакомьтесь с рекомендациями по развертыванию паролей и других конфиденциальных данных в ASP.NET и Azure.

Реализация передачи данных поставщику SMS

SmsService Настройте класс в файле App_Start\IdentityConfig.cs.

В зависимости от используемого поставщика SMS активируйте раздел Twilio или ASPSMS :

public class SmsService : IIdentityMessageService
{
    public Task SendAsync(IdentityMessage message)
    {
        // Twilio Begin
        //var accountSid = ConfigurationManager.AppSettings["SMSAccountIdentification"];
        //var authToken = ConfigurationManager.AppSettings["SMSAccountPassword"];
        //var fromNumber = ConfigurationManager.AppSettings["SMSAccountFrom"];

        //TwilioClient.Init(accountSid, authToken);

        //MessageResource result = MessageResource.Create(
            //new PhoneNumber(message.Destination),
            //from: new PhoneNumber(fromNumber),
           //body: message.Body
        //);

        ////Status is one of Queued, Sending, Sent, Failed or null if the number is not valid
         //Trace.TraceInformation(result.Status.ToString());
        ////Twilio doesn't currently have an async API, so return success.
         //return Task.FromResult(0);    
        // Twilio End

        // ASPSMS Begin 
        // var soapSms = new MvcPWx.ASPSMSX2.ASPSMSX2SoapClient("ASPSMSX2Soap");
        // soapSms.SendSimpleTextSMS(
        //   System.Configuration.ConfigurationManager.AppSettings["SMSAccountIdentification"],
        //   System.Configuration.ConfigurationManager.AppSettings["SMSAccountPassword"],
        //   message.Destination,
        //   System.Configuration.ConfigurationManager.AppSettings["SMSAccountFrom"],
        //   message.Body);
        // soapSms.Close();
        // return Task.FromResult(0);
        // ASPSMS End
    }
}

Обновите представление Razor Views\Manage\Index.cshtml (обратите внимание: не просто удаляйте комментарии в коде выхода, используйте приведенный ниже код).)

@model MvcPWy.Models.IndexViewModel
@{
   ViewBag.Title = "Manage";
}
<h2>@ViewBag.Title.</h2>
<p class="text-success">@ViewBag.StatusMessage</p>
<div>
   <h4>Change your account settings</h4>
   <hr />
   <dl class="dl-horizontal">
      <dt>Password:</dt>
      <dd>
         [
         @if (Model.HasPassword)
         {
            @Html.ActionLink("Change your password", "ChangePassword")
         }
         else
         {
            @Html.ActionLink("Create", "SetPassword")
         }
         ]
      </dd>
      <dt>External Logins:</dt>
      <dd>
         @Model.Logins.Count [
         @Html.ActionLink("Manage", "ManageLogins") ]
      </dd>
        <dt>Phone Number:</dt>
      <dd>
         @(Model.PhoneNumber ?? "None") [
         @if (Model.PhoneNumber != null)
         {
            @Html.ActionLink("Change", "AddPhoneNumber")
            @: &nbsp;|&nbsp;
            @Html.ActionLink("Remove", "RemovePhoneNumber")
         }
         else
         {
            @Html.ActionLink("Add", "AddPhoneNumber")
         }
         ]
      </dd>
      <dt>Two-Factor Authentication:</dt> 
      <dd>
         @if (Model.TwoFactor)
         {
            using (Html.BeginForm("DisableTwoFactorAuthentication", "Manage", FormMethod.Post, new { @class = "form-horizontal", role = "form" }))
            {
               @Html.AntiForgeryToken()
               <text>Enabled
                  <input type="submit" value="Disable" class="btn btn-link" />
               </text>
            }
         }
         else
         {
            using (Html.BeginForm("EnableTwoFactorAuthentication", "Manage", FormMethod.Post, new { @class = "form-horizontal", role = "form" }))
            {
               @Html.AntiForgeryToken()
               <text>Disabled
                  <input type="submit" value="Enable" class="btn btn-link" />
               </text>
            }
         }
      </dd>
   </dl>
</div>

Убедитесь, что EnableTwoFactorAuthentication методы действия и DisableTwoFactorAuthentication в имеют ManageController атрибут [ValidateAntiForgeryToken] :

//
// POST: /Manage/EnableTwoFactorAuthentication
[HttpPost,ValidateAntiForgeryToken]
public async Task<ActionResult> EnableTwoFactorAuthentication()
{
    await UserManager.SetTwoFactorEnabledAsync(User.Identity.GetUserId(), true);
    var user = await UserManager.FindByIdAsync(User.Identity.GetUserId());
    if (user != null)
    {
        await SignInAsync(user, isPersistent: false);
    }
    return RedirectToAction("Index", "Manage");
}
//
// POST: /Manage/DisableTwoFactorAuthentication
[HttpPost, ValidateAntiForgeryToken]
public async Task<ActionResult> DisableTwoFactorAuthentication()
{
    await UserManager.SetTwoFactorEnabledAsync(User.Identity.GetUserId(), false);
    var user = await UserManager.FindByIdAsync(User.Identity.GetUserId());
    if (user != null)
    {
        await SignInAsync(user, isPersistent: false);
    }
    return RedirectToAction("Index", "Manage");
}

Запустите приложение и войдите в систему с ранее зарегистрированной учетной записью.
Щелкните идентификатор пользователя, который активирует Index метод действия в Manage контроллере.
Нажмите кнопку "Добавить".
Метод AddPhoneNumber действия отображает диалоговое окно для ввода номера телефона, который может принимать SMS-сообщения.
```
// GET: /Account/AddPhoneNumber
public ActionResult AddPhoneNumber()
{
   return View();
}
```
Через несколько секунд вы получите текстовое сообщение с кодом проверки. Введите его и нажмите кнопку Отправить.
В представлении Управление отображается добавленный номер телефона.

Включение двухфакторной проверки подлинности

В приложении, созданном шаблоном, необходимо использовать пользовательский интерфейс для включения двухфакторной проверки подлинности (2FA). Чтобы включить двухфакторную проверку подлинности, щелкните свой идентификатор пользователя (псевдоним электронной почты) на панели навигации.

Снимок экрана: домашняя страница приложения NET точки A P. Выделен пример пользовательского идентификатора.

Щелкните Включить 2FA.

Снимок экрана, на котором показана страница параметров учетной записи приложения NET точки A P. Two-Factor проверка подлинности: отключен с выделенным разделом Включить ссылку.

Выйдите из системы, а затем снова войдите в систему. Если вы включили электронную почту (см. мой предыдущий учебник), вы можете выбрать SMS или электронную почту для 2FA.

Снимок экрана, на котором показана страница отправки кода проверки приложения A P.NET. Выбрано раскрывающееся меню с пунктом

Отобразится страница Проверка кода, на которой можно ввести код (из SMS или электронной почты).

Снимок экрана, на котором показана страница проверки приложения A P ТОЧКИ NET для 2 FA. Под примером кода выделен флажок Запомнить этот браузер.

Если щелкнуть поле Запомнить этот браузер проверка, вам не потребуется использовать 2FA для входа при использовании браузера и устройства, на котором вы установите флажок. Если злоумышленники не смогут получить доступ к вашему устройству, включение двухфакторной проверки подлинности и нажатие кнопки Запомнить этот браузер обеспечит вам удобный одношаговый доступ по паролю, сохраняя при этом надежную 2FA-защиту для всего доступа с ненадежных устройств. Это можно сделать на любом частном устройстве, которое вы регулярно используете.

В этом руководстве содержатся краткие сведения о включении двухфакторной проверки подлинности в новом приложении MVC ASP.NET. В моем руководстве Двухфакторная проверка подлинности с помощью SMS и электронной почты с помощью ASP.NET Identity подробно рассматривается код, лежащий в основе примера.

Дополнительные ресурсы

Двухфакторная проверка подлинности с помощью SMS и электронной почты с ASP.NET Identity Подробное описание двухфакторной проверки подлинности
Ссылки на рекомендуемые ресурсы ASP.NET Identity
Подтверждение учетной записи и восстановление пароля с помощью удостоверения ASP.NET Дополнительные сведения о восстановлении пароля и подтверждении учетной записи.
Вход в приложение MVC 5 с Facebook, Twitter, LinkedIn и Google OAuth2 В этом руководстве показано, как написать приложение ASP.NET MVC 5 с авторизацией Facebook и Google OAuth 2. В ней также показано, как добавить дополнительные данные в базу данных Identity.
Развертывание приложения Secure ASP.NET MVC с членством, OAuth и База данных SQL в Интернете Azure. В этом руководстве описано развертывание Azure, защита приложения с помощью ролей, использование API членства для добавления пользователей и ролей, а также дополнительные функции безопасности.
Создание приложения Google для OAuth 2 и подключение приложения к проекту
Создание приложения в Facebook и подключение приложения к проекту
Настройка SSL в проекте
Настройка среды разработки MVC на C# и ASP.NET

Поделиться через

Приложение ASP.NET MVC 5 с двухфакторной проверкой подлинности по SMS и электронной почте

Создание приложения MVC ASP.NET

Настройка SMS для двухфакторной проверки подлинности

Включение двухфакторной проверки подлинности

Дополнительные ресурсы

Обратная связь

Дополнительные ресурсы