Как создать серверную часть для EmberJS?
В этом учебном пособии вы научитесь создавать полный бэкенд для приложения EmberJS с использованием Back4app.
Мы пройдем через интеграцию основных функций Back4app — таких как управление базами данных, функции Cloud Code, REST и GraphQL API, аутентификация пользователей и запросы в реальном времени (Live Queries) — чтобы создать безопасный, масштабируемый и надежный бэкенд, который бесшовно взаимодействует с вашим фронтендом EmberJS.
Вы также увидите, как быстрая настройка и интуитивно понятная среда Back4app могут значительно сократить время и усилия по сравнению с ручной настройкой серверов и баз данных.
В процессе вы получите практический опыт с ключевыми функциональными возможностями, включая расширенные функции безопасности, планирование задач с помощью Cloud Jobs и настройку вебхуков для внешних интеграций.
К концу этого учебного пособия вы будете хорошо подготовлены, чтобы улучшить эту базовую настройку до готового к производству приложения или легко интегрировать пользовательскую логику и сторонние API по мере необходимости.
Чтобы завершить этот учебник, вам потребуется:
- Аккаунт Back4app и новый проект Back4app Начало работы с Back4app. Если у вас нет аккаунта, вы можете создать его бесплатно. Следуйте приведенному выше руководству, чтобы подготовить ваш проект.
- Базовая среда разработки EmberJS Вы можете настроить это с помощью Ember CLI или аналогичного инструмента. Убедитесь, что у вас установлен Node.js на вашем компьютере.
- Установленный Node.js (версия 14 или выше) Вам потребуется Node.js для установки npm пакетов и запуска локальных серверов разработки. Установка Node.js
- Знание JavaScript и основных концепций EmberJS Официальная документация EmberJS. Если вы новичок в Ember, ознакомьтесь с официальной документацией или учебником для начинающих перед началом.
Убедитесь, что у вас есть все эти предварительные требования перед началом. Наличие вашего проекта Back4app и готовой локальной среды EmberJS поможет вам легче следовать за процессом.
Первый шаг в создании вашего бэкенда EmberJS на Back4app — это создание нового проекта. Если вы еще не создали его, выполните следующие шаги:
- Войдите в свою учетную запись Back4app.
- Нажмите кнопку “Новое приложение” в вашей панели управления Back4app.
- Дайте вашему приложению имя (например, “EmberJS-Backend-Tutorial”).
![Document image Document image](https://images.archbee.com/yD3zCY-NNBBIfd0uqcfR5/drXO0UqsgxhFvRDiVmsMb_image.png?format=webp)
После создания проекта вы увидите его в списке на вашей панели управления Back4app. Этот проект станет основой для всех конфигураций бэкенда, обсуждаемых в этом руководстве.
Back4app использует платформу Parse для управления вашими данными, предоставления функций в реальном времени, обработки аутентификации пользователей и многого другого. Подключение вашего приложения EmberJS к Back4app включает установку пакета parse npm и его инициализацию с учетными данными из вашей панели управления Back4app.
Получите ваши ключи Parse: На вашей панели управления Back4app перейдите в раздел “Настройки приложения” или “Безопасность и ключи”, чтобы найти ваш Идентификатор приложения и JavaScript ключ. Вы также найдете URL сервера Parse (часто в формате https://parseapi.back4app.com).
![Document image Document image](https://images.archbee.com/yD3zCY-NNBBIfd0uqcfR5/F9teHXd_M8ERn1OPGirbi_image.png?format=webp)
Установите Parse SDK в вашем проекте EmberJS:
Если вы используете Yarn, вы можете установить его с помощью:
Инициализируйте Parse в вашем приложении EmberJS:
Для EmberJS вы можете создать специальный сервис (например, parse-service.js) или утилитный файл внутри вашей app папки. Ниже приведен пример подхода с утилитным файлом:
Этот файл гарантирует, что всякий раз, когда вы импортируете Parse в другом месте вашего приложения Ember, он предварительно настроен для подключения к вашему конкретному экземпляру Back4app.
Завершив этот шаг, вы установили безопасное соединение между вашим фронтендом EmberJS и бэкендом Back4app. Все запросы и транзакции данных безопасно маршрутизируются через этот SDK, что снижает сложность ручных вызовов REST или GraphQL (хотя вы все равно можете использовать их при необходимости).
С вашим проектом Back4app, настроенным и интегрированным с SDK Parse в вашем приложении Ember, вы теперь можете начинать сохранять и извлекать данные. Самый простой способ создать запись – использовать класс Parse.Object :
В качестве альтернативы вы можете использовать конечные точки REST API Back4app:
Back4app также предоставляет интерфейс GraphQL:
Эти разнообразные варианты позволяют вам интегрировать операции с данными так, как это лучше всего подходит вашему процессу разработки — будь то через Parse SDK, REST или GraphQL.
По умолчанию Parse позволяет создавать схемы на лету, но вы также можете определить свои классы и типы данных в панели управления Back4app для большего контроля.
- Перейдите в раздел “База данных” в вашей панели управления Back4app.
- Создайте новый класс (например, “Todo”) и добавьте соответствующие столбцы, такие как title (String) и isCompleted (Boolean).
![Создать новый класс Создать новый класс](https://images.archbee.com/yD3zCY-NNBBIfd0uqcfR5/iaZ_P-7epc_LSMFIPlaZV_image.png?format=webp)
Back4app также поддерживает различные типы данных: String, Number, Boolean, Object, Date, File, Pointer, Array, Relation, GeoPoint, и Polygon. Вы можете выбрать подходящий тип для каждого поля. Если вы предпочитаете, вы также можете позволить Parse автоматически создать эти столбцы, когда вы впервые сохраняете объект из вашего Ember приложения.
![Создать столбец Создать столбец](https://images.archbee.com/yD3zCY-NNBBIfd0uqcfR5/DEh9vyxdBTZcslXxkVQMA_image.png?format=webp)
Back4app предлагает AI-агента, который может помочь вам спроектировать вашу модель данных:
- Откройте AI-агента из вашей панели управления приложением или в меню.
- Опишите вашу модель данных простым языком (например, “Пожалуйста, создайте новое приложение ToDo на back4app с полной схемой класса.”).
- Позвольте AI-агенту создать схему для вас.
![Document image Document image](https://images.archbee.com/yD3zCY-NNBBIfd0uqcfR5/0snNZwHWzxuXlNu30n7IA_image.png?format=webp)
Использование AI-агента может сэкономить ваше время при настройке архитектуры данных и обеспечить согласованность в вашем приложении.
Если у вас есть реляционные данные — скажем, объект Категория который указывает на несколько Задач — вы можете использовать Указатели или Связи в Parse. Например, добавление указателя на Категорию:
Когда вы выполняете запрос, вы также можете включить данные указателя:
Этот include('category') вызов извлекает детали категории вместе с каждой задачей, делая ваши реляционные данные легко доступными.
Для обновлений в реальном времени Back4app предоставляет Живые запросы. В вашем приложении EmberJS вы можете подписаться на изменения в конкретном классе:
- Включите живые запросы в вашей панели управления Back4app в разделе вашего приложения Настройки сервера. Убедитесь, что «Живые запросы» включены.
- Инициализируйте подписку на живой запрос в вашем коде:
Подписываясь, вы получаете уведомления в реальном времени, когда создается, обновляется или удаляется новый Todo. Эта функция особенно ценна для совместных или динамических приложений, где нескольким пользователям необходимо видеть последние данные без обновления страницы.
Back4app серьезно относится к безопасности, предоставляя Списки управления доступом (ACL) и Разрешения на уровне класса (CLP). Эти функции позволяют ограничить, кто может читать или записывать данные на уровне объекта или класса, обеспечивая, чтобы только авторизованные пользователи могли изменять ваши данные.
![Document image Document image](https://images.archbee.com/yD3zCY-NNBBIfd0uqcfR5/PdAyrw1nqA1QQJFuCc-4t_image.png?format=webp)
ACL применяется к отдельным объектам, чтобы определить, какие пользователи, роли или общественность могут выполнять операции чтения/записи. Например:
Когда вы сохраняете объект, у него есть ACL, который предотвращает чтение или изменение его кем-либо, кроме указанного пользователя.
![Редактировать ACL Редактировать ACL](https://images.archbee.com/yD3zCY-NNBBIfd0uqcfR5/3YNfxEcv7CKdLC6ca8my6_image.png?format=webp)
CLP управляют стандартными разрешениями для всего класса, такими как возможность публичного чтения или записи, или если только определенные роли могут получить к нему доступ.
- Перейдите в свою панель управления Back4app, выберите свое приложение и откройте раздел База данных.
- Выберите класс (например, “Todo”).
- Откройте вкладку Разрешения на уровне класса.
- Настройте свои параметры по умолчанию, такие как “Требуется аутентификация” для чтения или записи, или “Нет доступа” для публичного.
![Document image Document image](https://images.archbee.com/yD3zCY-NNBBIfd0uqcfR5/MF1Uf7HSJF03Xg6djap9m_image.png?format=webp)
Эти разрешения устанавливают базовый уровень, в то время как ACL уточняют разрешения для отдельных объектов. Надежная модель безопасности обычно сочетает как CLP (широкие ограничения), так и ACL (точные ограничения для каждого объекта). Для получения дополнительной информации перейдите на Руководство по безопасности приложений.
Облачный код – это функция среды Parse Server, которая позволяет вам запускать пользовательский JavaScript код на стороне сервера, не требуя управления вашими серверами или инфраструктурой. Написав облачный код, вы можете расширить свой бэкенд Back4app дополнительной бизнес-логикой, валидациями, триггерами и интеграциями, которые работают безопасно и эффективно в среде Parse Server.
Когда вы пишете облачный код, вы обычно помещаете свои функции JavaScript, триггеры и любые необходимые модули NPM в файл main.js (или app.js). Этот файл затем развертывается в вашем проекте Back4app, который выполняется в среде Parse Server. Поскольку эти функции и триггеры работают на сервере, вы можете доверять им обрабатывать конфиденциальную логику, обрабатывать чувствительные данные или выполнять API вызовы только для бэкенда — процессы, которые вы, возможно, не хотите открывать напрямую клиенту.
Весь Cloud Code для вашего приложения Back4app работает внутри Parse Server, который управляется Back4app, поэтому вам не нужно беспокоиться о техническом обслуживании сервера, масштабировании или предоставлении ресурсов. Каждый раз, когда вы обновляете и развертываете свой файл main.js, работающий Parse Server обновляется с вашим последним кодом.
Структура файла main.js Типичный main.js может содержать:
- Заявления о необходимости для любых необходимых модулей (пакеты NPM, встроенные модули Node или другие файлы облачного кода).
- Определения облачных функций с использованием Parse.Cloud.define().
- Триггеры такие как Parse.Cloud.beforeSave(), Parse.Cloud.afterSave(), и т.д.
- Модули NPM которые вы установили (если необходимо). Например, вы можете установить пакет, такой как axios для выполнения HTTP-запросов. Затем вы можете подключить (или импортировать) его в начале вашего файла.
С возможностью установки и использования модулей NPM, Cloud Code становится невероятно гибким, позволяя вам интегрироваться с внешними API, выполнять преобразования данных или выполнять сложную серверную логику.
- Бизнес-логика: Например, вы можете рассчитать балл пользователя в игре, агрегируя несколько свойств объектов, а затем автоматически сохранять эти данные.
- Проверка данных: Убедитесь, что определенные поля присутствуют или что у пользователя есть правильные разрешения перед сохранением или удалением записи.
- Триггеры: Выполняйте действия, когда данные изменяются (например, отправляйте уведомление, когда пользователь обновляет свой профиль).
- Интеграции: Подключайтесь к сторонним API или сервисам. Например, вы можете интегрироваться с платежными шлюзами, уведомлениями Slack или платформами email-маркетинга прямо из Cloud Code.
- Обеспечение безопасности: Добавьте дополнительный уровень безопасности, проверяя и очищая входные параметры в ваших функциях Cloud Code. Например, вы можете убедиться, что входящие данные соответствуют определенным форматам, отклонять недопустимые или вредоносные входные данные и применять правила доступа на основе ролей или разрешений пользователей перед выполнением чувствительных операций.
Ниже приведена простая функция Cloud Code, которая вычисляет длину текстовой строки, отправленной с клиента:
Развертывание через Back4app CLI:
1 - Установите CLI:
- Для Linux/MacOS:
3 - Разверните ваш облачный код:
Развертывание через панель управления:
- В панели управления вашего приложения перейдите в Облачный код > Функции.
- Скопируйте/вставьте функцию в редактор main.js.
- Нажмите Развернуть.
![Document image Document image](https://images.archbee.com/yD3zCY-NNBBIfd0uqcfR5/pGxBQFBhk4prMc8Ub-uho_image.png?format=webp)
Из EmberJS с использованием Parse SDK:
Вы также можете вызвать его через REST:
Или через GraphQL:
Эта гибкость позволяет вам интегрировать вашу пользовательскую логику в ваш EmberJS фронтенд или любой другой клиент, который поддерживает REST или GraphQL.
Back4app использует класс Parse User в качестве основы для аутентификации. По умолчанию Parse обрабатывает хеширование паролей, токены сессий и безопасное хранение. Это означает, что вам не нужно вручную настраивать сложные потоки безопасности.
В приложении Ember вы можете создать нового пользователя с помощью:
Войти в систему как существующий пользователь:
Через REST вход может выглядеть так:
После успешного входа Parse создает токен сессии который хранится в объекте пользователя. В вашем приложении Ember вы можете получить доступ к текущему вошедшему пользователю:
Parse автоматически обрабатывает сессии на основе токенов в фоновом режиме, но вы также можете вручную управлять ими или аннулировать. Это полезно, когда вам нужно выйти из системы:
Back4app и Parse могут интегрироваться с популярными провайдерами OAuth, такими как Google или Facebook, установив дополнительные пакеты или используя существующие адаптеры. Например, вы можете настроить вход через Facebook, настроив свой Facebook App ID и используя Parse.FacebookUtils.logIn(). Подробные инструкции могут различаться, поэтому обратитесь к Документации по социальному входу.
Чтобы включить подтверждение электронной почты и сброс пароля:
- Перейдите в настройки электронной почты в вашей панели управления Back4app.
- Включите подтверждение электронной почты для обеспечения проверки новых пользователей на владение их адресами электронной почты.
- Настройте адрес отправителя, шаблоны электронной почты и ваш собственный домен, если это необходимо.
Эти функции улучшают безопасность учетной записи и пользовательский опыт, проверяя владение пользователем адресами электронной почты и предоставляя безопасный метод восстановления пароля.
Parse включает класс Parse.File для обработки загрузки файлов, которые Back4app хранит безопасно:
Чтобы прикрепить файл к объекту в базе данных, вы можете сделать:
Получение URL файла очень просто:
Вы можете отобразить этот imageUrl в ваших шаблонах Ember, привязав его к тегу <img>.
Parse Server предоставляет гибкие настройки для управления безопасностью загрузки файлов. Следующий пример показывает, как вы можете установить разрешения для контроля того, кто может загружать файлы на сервер:
{ "fileUpload": { "enableForPublic": true, "enableForAnonymousUser": true, "enableForAuthenticatedUser": true } }
- enableForPublic: Если установлено в true, позволяет любому, независимо от статуса аутентификации, загружать файлы.
- enableForAnonymousUser: Управляет тем, могут ли анонимные пользователи (не зарегистрированные) загружать файлы. При включении временные или гостевые пользователи могут загружать файлы.
- enableForAuthenticatedUser: Указывает, могут ли загружать файлы только аутентифицированные пользователи. Это идеально подходит для обеспечения того, чтобы только доверенные пользователи имели доступ к этой функции.
Облачные задания в Back4app позволяют вам планировать и выполнять рутинные задачи на вашем сервере — такие как очистка старых данных или отправка ежедневного сводного отчета по электронной почте. Типичное облачное задание может выглядеть так:
- Разверните ваш облачный код с новым заданием (через CLI или панель управления).
- Перейдите в панель управления Back4app > Настройки приложения > Настройки сервера > Фоновые задания.
- Запланируйте выполнение задания ежедневно или с любым другим интервалом, который вам подходит.
![Планирование облачного задания Планирование облачного задания](https://images.archbee.com/yD3zCY-NNBBIfd0uqcfR5/5wG60YnWIST74erryTb-u_image.png?format=webp)
Облачные задания позволяют вам автоматизировать фоновое обслуживание или другие периодические процессы — без необходимости ручного вмешательства.
Вебхуки позволяют вашему приложению Back4app отправлять HTTP-запросы на внешний сервис, когда происходят определенные события. Это мощный инструмент для интеграции с системами третьих сторон, такими как платежные шлюзы (например, Stripe), инструменты email-маркетинга или аналитические платформы.
- Перейдите к конфигурации вебхуков в вашей панели управления Back4app > Дополнительно > Вебхуки, а затем нажмите на Добавить вебхук.
- Настройте триггеры для указания, какие события в ваших классах Back4app или функциях Cloud Code будут вызывать вебхук.
![Добавление вебхука Добавление вебхука](https://images.archbee.com/yD3zCY-NNBBIfd0uqcfR5/morUMdwsAbVQ1EmBfUfAA_image.png?format=webp)
Например, если вы хотите уведомлять канал Slack каждый раз, когда создается новая задача:
- Создайте приложение Slack, которое принимает входящие вебхуки.
- Скопируйте URL вебхука Slack.
- В вашей панели управления Back4app установите конечную точку на этот URL Slack для события "Новая запись в классе Todo."
- Вы также можете добавить пользовательские HTTP-заголовки или полезные нагрузки, если это необходимо.
Вы также можете определить вебхуки в Cloud Code, выполняя пользовательские HTTP-запросы в триггерах, таких как beforeSave, afterSave:
![Вебхук BeforeSave Вебхук BeforeSave](https://images.archbee.com/yD3zCY-NNBBIfd0uqcfR5/fXvy4eRzabyWmN80OMyqW_image.png?format=webp)
Приложение Back4app Admin App – это веб-интерфейс управления, предназначенный для нетехнических пользователей, чтобы выполнять операции CRUD и обрабатывать рутинные задачи с данными без написания кода. Он предоставляет ориентированный на модель, удобный для пользователя интерфейс, который упрощает администрирование базы данных, управление пользовательскими данными и операции на уровне предприятия.
Включите его, перейдя в Панель приложений > Дополнительно > Приложение администратора и нажав кнопку "Включить приложение администратора".
![Включить приложение администратора Включить приложение администратора](https://images.archbee.com/yD3zCY-NNBBIfd0uqcfR5/5BTk1ntDh9JLXurObmm_o_image.png?format=webp)
Создайте первого администратора (имя пользователя/пароль), что автоматически создаст новую роль (B4aAdminUser) и классы (B4aSetting, B4aMenuItem и B4aCustomField) в схеме вашего приложения.
![Document image Document image](https://images.archbee.com/yD3zCY-NNBBIfd0uqcfR5/u-pU1yBJJxa9KEM2psjXS_image.png?format=webp)
Выберите поддомен для доступа к интерфейсу администратора и завершите настройку.
![Document image Document image](https://images.archbee.com/yD3zCY-NNBBIfd0uqcfR5/_2b71RLDTlQW468017saY_image.png?format=webp)
Войти с использованием учетных данных администратора, которые вы создали для доступа к новой панели управления Admin App.
![Document image Document image](https://images.archbee.com/yD3zCY-NNBBIfd0uqcfR5/jOFU8C0qiFm6wiVZXS9l0_image.png?format=webp)
После активации приложение Back4app Admin App упрощает просмотр, редактирование или удаление записей из вашей базы данных — без необходимости прямого использования панели управления Parse или бэкенд-кода. С настраиваемыми контролями доступа вы можете безопасно делиться этим интерфейсом с членами команды или клиентами, которым нужен понятный способ управления данными.
Следуя этому подробному руководству, вы:
- Создана безопасная серверная часть для приложения EmberJS на Back4app.
- Настроена база данных с классами схем, типами данных и отношениями.
- Интегрированы запросы в реальном времени (Live Queries) для немедленных обновлений данных.
- Применены меры безопасности с использованием ACL и CLP для защиты и управления доступом к данным.
- Реализованы функции Cloud Code для выполнения пользовательской бизнес-логики на стороне сервера.
- Настроена аутентификация пользователей с поддержкой проверки электронной почты и сброса паролей.
- Управление загрузкой файлов и их извлечением с опциональными мерами безопасности.
- Запланированы Cloud Jobs для автоматизированных фоновых задач.
- Использованы Webhooks для интеграции с внешними сервисами.
- Изучен панель администратора Back4app для управления данными.
С надежным фронтендом EmberJS и мощной серверной частью Back4app вы теперь хорошо подготовлены для разработки функционально насыщенных, масштабируемых и безопасных приложений. Продолжайте исследовать более продвинутые функции, интегрируйте свою бизнес-логику и используйте возможности Back4app, чтобы сэкономить вам бесчисленные часы на администрировании серверов и баз данных. Удачного кодирования!
- Создайте готовое к производству приложение на EmberJS , расширив этот бэкенд для обработки более сложных моделей данных, стратегий кэширования и оптимизации производительности.
- Интегрируйте расширенные функции , такие как специализированные потоки аутентификации, контроль доступа на основе ролей или внешние API (например, платежные шлюзы).
- Посмотрите официальную документацию Back4app для более глубокого изучения вопросов безопасности, настройки производительности и анализа логов.
- Изучите другие учебные пособия по приложениям для чата в реальном времени, панелям управления IoT или услугам на основе местоположения. Вы можете комбинировать техники, изученные здесь, с API сторонних разработчиков для создания сложных, реальных приложений.
![Doc contributor](https://s3.amazonaws.com/archbee-animals/cat.png)