Quickstarters
Feature Overview
How to Build a Backend for jQuery?
39 мин
введение в этом учебном пособии вы узнаете как создать бэкенд для jquery с использованием back4app мы интегрируем основные функции back4app — управление базами данных, cloud code, rest и graphql api, аутентификацию пользователей и запросы в реальном времени — чтобы создать безопасный и масштабируемый бэкенд этот бэкенд будет взаимодействовать с вашим фронтендом на основе jquery через ajax вызовы и другие общие методы jquery интуитивно понятная среда back4app сокращает время, необходимое для настройки серверов или баз данных следуя нескольким простым шагам, вы получите практический опыт работы с acl, разрешениями на уровне классов, моделированием данных, загрузкой файлов и многим другим к концу этого учебного пособия у вас будет прочная основа для полностью функционального приложения на основе jquery, подключенного к бэкенду back4app вы будете готовы добавить пользовательскую логику, интегрировать внешние api и защитить свои данные с помощью детального контроля предварительные требования чтобы завершить этот учебник, вам потребуется аккаунт back4app и новый проект back4app начало работы с back4app https //www back4app com/docs/get started/new parse app если у вас нет аккаунта, вы можете создать его бесплатно следуйте приведенному выше руководству, чтобы подготовить ваш проект базовая среда jquery вы можете скачать jquery с официального сайта https //jquery com/download/ установленный node js (версия 14 или выше) (необязательно) хотя node js не является строго необходимым для jquery в браузере, вам может понадобиться его для запуска локальных тестовых серверов или установки пакетов npm, если вы хотите проводить локальное тестирование установка node js https //nodejs org/en/download/ знание основ javascript и jquery официальная документация jquery https //api jquery com/ убедитесь, что у вас есть все эти предварительные требования перед началом, чтобы вы могли легко следовать за процессом создания вашего фронтенда на основе jquery и подключения его к back4app шаг 1 – настройка проекта back4app создание нового проекта чтобы начать ваш проект на jquery, создайте новый проект back4app войдите в свою учетную запись back4app нажмите кнопку “новое приложение” на панели управления back4app дайте вашему приложению имя (например, “jquery backend tutorial”) когда проект будет создан, вы увидите его на панели управления back4app это будет основа ваших конфигураций бэкенда для jquery подключите parse sdk back4app использует платформу parse для работы с данными и функциями в реальном времени если вы хотите использовать parse sdk напрямую с jquery, вы можете загрузить его как скрипт в вашем html получите ваши ключи parse в панели управления back4app откройте «настройки приложения» или «безопасность и ключи», чтобы найти идентификатор приложения ключ javascript url сервера parse (обычно https //parseapi back4app com ) включите parse sdk в ваш html файл в среде jquery , вы можете сначала загрузить jquery, затем parse и взаимодействовать с объектами parse в ваших скриптах это соединение гарантирует, что все вызовы данных к вашему бэкенду back4app проходят через платформу parse шаг 2 – настройка базы данных сохранение и запрос данных после интеграции parse sdk вы можете сохранять и извлекать данные из базы данных back4app вот простой пример создания и извлечения объектов "todo" с использованием jquery и parse вы также можете вызывать rest api с помощью curl curl x post \ h "x parse application id your application id" \ h "x parse rest api key your rest api key" \ h "content type application/json" \ d '{"title" "buy groceries", "iscompleted" false}' \ https //parseapi back4app com/classes/todo или используйте graphql mutation { createtodo(input { fields { title "clean the house" iscompleted false } }) { todo { objectid title iscompleted } } } проектирование схемы и типы данных в панели управления back4app перейдите в “база данных ” создайте новый класс (например, “список дел”) и добавьте столбцы, такие как заголовок (string) и завершено (boolean) вы также можете позволить parse автоматически создавать столбцы в первый раз, когда вы сохраняете объект использование ai агента back4app имеет ai агента для моделирования данных откройте ai агента в панели управления или меню вашего приложения опишите вашу модель данных (например, “создайте приложение todo с схемой класса ”) позвольте ai агенту сгенерировать схему реляционные данные если у вас есть категория класс, связанный со многими задачами , вы можете использовать указатели или связи живые запросы для обновлений в реальном времени в вашем приложении jquery включите живые запросы в вашей панели управления back4app в разделе настройки сервера инициализируйте подписку на живой запрос эта подписка уведомляет вас в реальном времени, когда создается, обновляется или удаляется объект “todo” шаг 3 – применение безопасности с помощью acl и clp механизм безопасности back4app acl (списки управления доступом) и clp (разрешения на уровне класса) позволяют вам контролировать, кто может читать и записывать данные на уровне объектов или классов списки управления доступом (acl) acl устанавливается на отдельные объекты для ограничения доступа разрешения на уровне класса (clp) clp контролируют разрешения по умолчанию для всего класса в вашей панели управления back4app , откройте раздел база данных выберите ваш класс (например, “todo”) перейдите на вкладку разрешения на уровне класса для настройки публичного, аутентифицированного или ролевого доступа сочетайте acl для безопасности на уровне объектов с clp для более широких ограничений для получения дополнительной информации смотрите руководство по безопасности приложений https //www back4app com/docs/security/parse security шаг 4 – написание и развертывание облачных функций облачный код выполняет пользовательский javascript на стороне сервера, позволяя вам добавлять бизнес логику, проверки данных или вызовы внешних api как это работает вы помещаете свой код в main js (или в аналогичный файл), развертываете его на back4app и позволяете серверу parse обрабатывать выполнение вы также можете использовать модули npm для более сложной логики // main js const axios = require('axios'); parse cloud define('fetchexternaldata', async (request) => { const url = request params url; if (!url) { throw new error('url parameter is required'); } const response = await axios get(url); return response data; }); parse cloud beforesave('todo', (request) => { const todo = request object; if (!todo get('title')) { throw new error('todo must have a title'); } }); развертывание вашей функции через back4app cli b4a deploy через панель управления в панели управления вашего приложения перейдите в cloud code > functions скопируйте/вставьте функцию в main js нажмите deploy вызов вашей функции из jquery вы можете вызвать облачную функцию так шаг 5 – настройка аутентификации пользователей аутентификация пользователей в back4app back4app использует класс parse user для аутентификации хеширование паролей, токены сессий и безопасное хранение обрабатываются автоматически настройка аутентификации пользователей управление сессиями вы можете получить текущего пользователя const currentuser = parse user current(); if (currentuser) { console log('logged in user ', currentuser getusername()); } else { console log('no user is logged in'); } выход parse user logout(); интеграция социального входа back4app поддерживает google, facebook, apple и других поставщиков oauth для получения дополнительной информации смотрите документацию по социальному входу https //www back4app com/docs/platform/sign in with apple шаг 6 – обработка хранения файлов загрузка и получение файлов используйте parse file для обработки загрузок вы можете сохранить файл в классе, присвоив его полю const photo = parse object extend('photo'); const photo = new photo(); photo set('imagefile', parsefile); photo save(); получение url файла const imagefile = photo get('imagefile'); const imageurl = imagefile url(); безопасность файлов вы можете управлять тем, кто может загружать файлы, изменяя настройки загрузки файлов в parse server { "fileupload" { "enableforpublic" true, "enableforanonymoususer" true, "enableforauthenticateduser" true } } шаг 7 – планирование задач с помощью облачных заданий облачные задания вы можете выполнять рутинные задачи, такие как удаление старых данных // main js parse cloud job('cleanupoldtodos', async (request) => { const todo = parse object extend('todo'); const query = new parse query(todo); const now = new date(); const thirty days = 30 24 60 60 1000; const cutoff = new date(now thirty days); query lessthan('createdat', cutoff); try { const oldtodos = await query find({ usemasterkey true }); await parse object destroyall(oldtodos, { usemasterkey true }); return `deleted ${oldtodos length} old todos `; } catch (err) { throw new error('error during cleanup ' + err message); } }); в панели управления перейдите в настройки приложения > настройки сервера > фоновая работа для планирования шаг 8 – интеграция вебхуков webhooks позволяют вашему приложению отправлять http запросы на внешний сервис, когда происходят определенные события перейдите в дополнительно > webhooks в вашей панели управления back4app добавьте новый webhook с вашим внешним конечным пунктом настройте триггеры для событий, таких как “новая запись в классе todo ” вы можете интегрировать slack или платежный шлюз, такой как stripe, отправляя данные событий через вебхуки шаг 9 – изучение панели администратора back4app приложение back4app admin app предлагает нетехнический, веб интерфейс для операций crud включение приложения администратора перейдите в панель управления приложением > дополнительно > админ приложение и нажмите «включить админ приложение» создайте первого администратора , который автоматически создаст новую роль (b4aadminuser) и классы в вашей схеме выберите поддомен для доступа к админ приложению войдите с использованием ваших новых учетных данных администратора после активации это приложение для администраторов позволяет вам управлять данными или предоставлять доступ членам команды без программирования заключение в этом руководстве вы узнали, как создать бэкенд для jquery с помощью back4app вы создали новый проект back4app в качестве основы для вашего бэкенда настроили базу данных, включая проектирование схемы и связи данных использовали acl и clp для тонкой настройки безопасности развернули cloud code для пользовательской серверной логики настроили аутентификацию пользователей, хранение файлов и обновления в реальном времени запланировали фоновые задачи и интегрировали вебхуки для внешних сервисов изучили панель администратора back4app для более простого управления данными теперь вы готовы расширить эту базовую настройку jquery + back4app в полноценное производственное решение продолжайте интегрировать расширенные функции, такие как социальный вход или более детализированные правила безопасности наслаждайтесь созданием своих масштабируемых, ориентированных на данные приложений! следующие шаги подготовьтесь к производству добавьте расширенные разрешения на основе ролей, стратегии кэширования и оптимизацию производительности интегрируйте сторонние api для платежей, обмена сообщениями или аналитики изучите документацию back4app углубитесь в расширенную безопасность, журналы или аналитику создавайте реальные приложения используйте простоту jquery в сочетании с мощными бэкенд сервисами back4app