Существует множество доступных сервисов OAuth2. Однако в этой статье мы продемонстрируем услугу Аэробаза. Вы узнаете, как защитить свои клиентские активы с помощью Aerobase и AngularJS.

Мы покажем, как интегрировать AeroBase OAuth2/OIDC и создать страницу регистрации/аутентификации пользователя.

Что такое AeroBase?

Aerobase IAM — этопростое, безопасное и настраиваемоесредство управления идентификацией и доступом. Aerobase.io предоставляет многоплатформенную идентификацию как услугу, и ее можно использовать совершенно БЕСПЛАТНО.

  • Бесплатно: неограниченное количество приложений и серверная защита без дополнительной оплаты.
  • Многоплатформенная поддержка: предоставляет единый пользовательский интерфейс и API для доставки OAuth2 на различные платформы, такие как iOS, Android, Windows Phone, Hybrid Cordova/PhoneGap, JavaScript, Java, C#, Node.js, Python…
  • Поддержка нескольких SDK: предоставляет SDK практически для всех основных кроссплатформенных сред разработки, включая PhoneGap, Cordova, React Native, Angular, Spring Security и т. д.

Подключиться к OpenID

OIDC — это протокол аутентификации, являющийся расширением OAuth 2.0. В то время как OAuth 2.0 — это только платформа для создания протоколов авторизации и в основном неполная, OIDC — это полноценный протокол аутентификации и авторизации. OIDC также широко использует набор стандартов Json Web Token (JWT). Эти стандарты определяют формат токена удостоверения JSON и способы цифровой подписи и шифрования этих данных компактным и удобным для Интернета способом.

Шаг 1: Начало работы с AeroBase

Для начала вам необходимо иметь сервер AeroBase и включить один из SDK в ваше приложение.

Самый простой способ начать использовать AeroBase — подписаться на бесплатный план на https://cloud.aerobase.io/portal.

Зарегистрируйте учетную запись в Aerobase

Чтобы интегрировать AeroBase OAuth2 с приложением Angular, URL-адрес веб-аутентификации aerobase необходимо инициализировать с помощью подключаемого модуля Aerobase-JS-SDK, который позже используется в демонстрационном приложении.

Шаг 2: Импорт демонстрационного проекта Angular

  1. Клонируйте наш образец проекта Angular https://github.com/aerobase-demo/angular-oauth2-starter
  2. Установите параметры своей учетной записи в src/environments/environment.ts
  3. Замените любую ссылку на учетную запись «пример» именем вашей учетной записи.

Шаг 3. Разрешите URI перенаправления AeroBase

Предполагая, что ваша локальная угловая подача с localhost: 3000, вам нужно будет добавить http://localhost: 3000/* к вашему клиенту «Действительный URIS перенаправления».

Шаг 4: Создание и тестирование приложения

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

Более подробное руководство по интеграции Aerogear SDK доступно в нашем руководстве по началу работы https://github.com/aerobase/aerobase-js-sdk.

Вывод

Поскольку OAuth2/OIDC стал важной функцией взаимодействия приложений с пользователями, мы демонстрируем, как интегрировать и использовать aerobase, самый популярный и бесплатный многоплатформенный сервис OIDC, с приложениями Angular/JS.