Ionic Framework — популярный гибридный фреймворк для разработки приложений. Hasura JS SDK можно использовать с Ionic для расширения возможностей вашего приложения с помощью серверных возможностей, таких как аутентификация, данные и файловые API. Он позволяет добавлять эти функции без написания единой строки кода.

В этом руководстве представлена ​​необходимая информация, которая поможет вам приступить к разработке приложения Ionic с использованием внутренних API-интерфейсов Hasura. Мы используем Ionic V1 приложения, использующие AngularJS.

Мы также создали стартовый набор Ionic-Hasura, в котором есть полные рабочие страницы, демонстрирующие возможности Backend API Hasura. Вы можете обратиться к ним, чтобы начать работу, или даже использовать этот комплект непосредственно для своих приложений.

Включая Hasura JS SDK

JS SDK Hasura доступен на GitHub. Минимизированный SDK включен в стартовый комплект по умолчанию. Если вы запускаете собственное приложение, загрузите hasura.min.js и добавьте следующий фрагмент в файл index.html вашего приложения.

Этот скрипт предоставит глобальную переменную с именем hasura, которая доступна в области window. Для обычных JS-приложений этого было бы достаточно. Но для AngularJS, который используется Ionic, полагаться на глобальные переменные не рекомендуется. Нам нужно внедрить этот объект в компоненты, которым он потребуется. Для этого мы помещаем этот объект в фабрику AngularJS и делаем его доступным как компонент AngularJS.

Для этого мы создаем новый компонент в рамках модуля AngulaJS. Создайте файл с именем hasura.js со следующим содержимым и добавьте его в index.html.

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

Теперь вы можете внедрить hasura в любой компонент AngularJS, например в контроллеры и т. д. Прежде чем мы сможем использовать SDK для выполнения запросов и выполнения других действий, SDK необходимо инициализировать с помощью проекта Hasura. Это можно сделать в разделе run приложения AngularJS. Если ваше приложение предназначено только для зарегистрированных пользователей, вы также можете сделать эту проверку в том же разделе.

ПРИМЕЧАНИЕ. Этот шаг также предполагает, что у вас есть готовый проект Hasura. Если у вас его нет, войдите в Панель инструментов Hasura и создайте проект.

API авторизации

Регистрация/Регистрация

Пример контроллера для использования Signup API приведен ниже. Полный рабочий пример можно увидеть в Ionic Hasura Starter-Kit

Авторизоваться

Пример контроллера для использования Login API приведен ниже. Полный рабочий пример можно увидеть в Ionic Hasura Starter-Kit.

API данных

Чтобы использовать Data API, вам необходимо создать таблицы и настроить разрешения с помощью консоли Hasura. Пример, представленный в этом стартовом наборе, представляет собой приложение ToDo, куда вы можете добавлять задачи и помечать их как завершенные. Вы также можете удалить задачи. Преимущество использования API-интерфейсов данных Hasura заключается в том, что вы получаете мгновенные API-интерфейсы JSON для доступа к данным и управления ими, а также простую в использовании модель разрешений для реализации контроля доступа.

  • Создайте новую таблицу с именем todo с помощью консоли Hasura и добавьте следующие столбцы:
  1. id : Целое число (автоинкремент)
  2. title : Текст
  3. user_id : Целое число
  4. completed : логическое значение
  • Выберите id в качестве первичного ключа
  • Нажмите Создать
  • Перейдите на вкладку «Разрешения», нажмите «Добавить разрешения для новой роли».
  • Выберите user из раскрывающегося списка.
  • Введите {"user_id": "REQ_USER_ID"} во все поля проверки и фильтрации.
  • Переключить все для раздела «Выбрать»
  • Отметьте completed в разделе «Обновление».
  • Сохранить изменения

Примечание. Полный рабочий пример можно увидеть в Ionic Hasura Starter-Kit.

Теперь вы можете использовать следующие API:

Выбирать

Чтобы выбрать все задачи, принадлежащие пользователю, вы можете выполнить следующий запрос:

Вставлять

Создать новую задачу

Обновлять

Переключить завершенное состояние существующей задачи

Удалить

Удалить задачу

Файловый API

Загрузить

Скачать

Удалить

Hasura — это Postgres BaaS + Kubernetes PaaS, который поможет вам очень быстро создавать и развертывать серверные части. Попробуйте на https://hasura.io

Первоначально опубликовано на docs.hasura.io.