Приступаем к работе с проверкой подлинности в службах Mobile Services

Для знакомства с возможностями платформы  вы можетеактивировать Microsoft Azure бесплатно!

Тема практической работы: проверка подлинности пользователей служб Microsoft Azure для мобильных устройств непосредственно из HTML-приложения. Вы научитесь добавлять функцию проверки подлинности в проект быстрого запуска с помощью поставщика удостоверений, поддерживаемого службами Mobile Services. После успешной проверки подлинности и авторизации в службах Mobile Services на экране появится идентификатор пользователя.

Рассмотрим основные этапы проверки подлинности в приложении.

  1. Регистрация приложения для выполнения проверки подлинности и настройка служб Mobile Services
  2. Разрешение работать с таблицами лишь пользователям, прошедшим проверку,
  3. Добавление функции проверки подлинности в приложение

Эта практическая работа выполняется на основе проекта быстрого запуска служб Mobile Services. Сначала нужно сделать практическую работу Приступаем к работе со службами Mobile Services.

Регистрация приложения для выполнения проверки подлинности и настройка служб Mobile Services

Чтобы проверить подлинность пользователя, зарегистрируйте приложение с помощью поставщика удостоверений. Затем зарегистрируйте в службах Mobile Services секретный ключ клиента, полученный от поставщика.

1. Войдите на Портал управления Microsoft Azure, нажмите Mobile Services и выберите  мобильную службу.

2. Перейдите на вкладку Dashboard (Панель мониторинга) и запишите значение Site URL (URL-адрес сайта).

Это значение потребуется поставщику удостоверений для регистрации приложения.

3. Выберите поддерживаемого поставщика удостоверений из списка ниже и выполните следующие шаги для регистрации приложения:

Не забудьте записать идентификатор клиента и секретный ключ, полученный от поставщика.

Советы по безопасности

Секретный ключ, полученный от поставщика, обеспечивает безопасность. Никому не передавайте его и не распространяйте вместе с приложением.

4. На портале управления перейдите на вкладку Identity (Удостоверение), введите идентификатор приложения и секретный ключ, полученные от поставщика удостоверений, и нажмите Save (Сохранить).

Теперь мобильная служба и приложение готовы к работе с выбранным поставщиком проверки подлинности.

Разрешение работать с таблицами лишь пользователям, прошедшим проверку

1. На Портале управления перейдите на вкладку Data (Данные), затем выберите таблицу TodoItem.

2. Откройте вкладку Permissions (Разрешения). Установите для всех разрешений значение Only authenticated users (Только прошедшие проверку пользователи), затем нажмите кнопку Save (Сохранить). Теперь  для работы с таблицей TodoItem требуется проверка подлинности пользователя. Это поможет упростить скрипты (см. следующую практическую работу), поскольку при их выполнении будет запрещен доступ анонимным пользователям.

3. В каталоге приложений запустите один из командных файлов из вложенной папки server (Сервер).

  • launch-windows (Запустить Windows) (для ПК под управлением Windows)
  • launch-mac.command (Запустить mac.command)  (для ПК под управлением Mac OS X)
  • launch-linux.sh (Запустить linux.sh)  (для ПК под управлением Linux)

Примечание

Чтобы выполнить скрипт на ПК под управлением Windows, введите "R" при получении запроса на подтверждение от PowerShell. На экране появится предложение веб-браузера не выполнять этот скрипт, поскольку он  скачан из Интернета. Разрешите загрузку скрипта.

В результате новое приложение будет размещено на веб-сервере локального компьютера.

4. Чтобы запустить приложение, введите URL-адрес https://localhost:8000/ в адресной строке веб-браузера.

Не удается загрузить данные. Ошибка вызвана тем, что приложение пытается войти в службы Mobile Services как неавторизованный пользователь, а для работы с таблицей TodoItem теперь требуется проверка подлинности.

5. (Необязательно) Откройте отладчик скриптов для веб-браузера и перезагрузите страницу. Убедитесь, что появляется сообщение об ошибке access denied (отказано в доступе).

Теперь мы научимся обновлять приложение: сначала оно будет проверять подлинность  и только затем запрашивать ресурсы мобильной службы.

Добавление функции проверки подлинности в приложение

Примечание

Поскольку вход выполняется во всплывающем окне, необходимо вызвать метод входа из события нажатия кнопки. Если этого не сделать, то многие браузеры будут скрывать окно входа.

1. Откройте файл проекта index.html, найдите элемент H1 и добавьте после него следующий фрагмент кода:

<div id="logged-in">  You are logged in as <span id="login-name"></span>. <button id="log-out">Log out</button> </div> <div id="logged-out"> You are not logged in.  <button>Log in</button> </div>

Теперь со страницы можно входить в службы Mobile Services.

9. В самой нижней части файла app.js отыщите строку кода, которая вызывает функцию refreshTodoItems, и замените ее следующим кодом:

.function refreshAuthDisplay() {   var isLoggedIn = client.currentUser !== null; $("#logged-in").toggle(isLoggedIn); $("#logged-out").toggle(!isLoggedIn); if (isLoggedIn) { $("#login-name").text(client.currentUser.userId);   refreshTodoItems(); } } .function logIn() { client.login("facebook").then(refreshAuthDisplay, function(error){ alert(error); }); } .function logOut() { client.logout(); refreshAuthDisplay(); $('#summary').html('<strong>You must login to access data.</strong>'); .} .// При инициализации страницы получите удаленный доступ к данным и настройте обработчики событий $(function () { refreshAuthDisplay(); $('#summary').html('<strong>You must login to access data.</strong>');          $("#logged-out button").click(logIn); $("#logged-in button").click(logOut); });

Код нового метода проверки подлинности готов! Проверка подлинности пользователя выполняется по учетным данным Facebook.

Примечание

При использовании другого поставщика удостоверений необходимо заменить Facebook в строке loginmethod (см. код выше) на microsoftaccount, facebook, twitter или google.

45. Чтобы выполнить приложение, вернитесь в браузер и обновите страницу.

Если вход выполнен успешно, приложение будет работать без ошибок. Вы можете посылать запросы службе Mobile Services и обновлять данные.

Примечание

При использовании браузера Internet Explorer после входа может появится сообщение об ошибке: Cannot reach window opener(Не удается открыть окно). It may be on a different Internet Explorer zone (Вероятно, у него другая зона Internet Explorer) . Ошибка вызвана тем, что всплывающее окно выполняется в одной зоне безопасности (Интернет), а localhost –– в другой (интрасеть). Указанная ошибка возникает только на этапе разработки из-за использования localhost. Чтобы обойти эту ошибку, в меню Internet Options (Свойства браузера) откройте вкладку Security (Безопасность), нажмите Sites (Сайты) и отключите параметр Automatically detect intranet network (Автоматически определять принадлежность к интрасети). Не забудьте снова включить этот параметр после тестирования.