Custom Authentication (JSON Web Tokens) во FlutterFlow
Подробный разбор процесса настройки кастомной аутентификации во FlutterFlow с использованием JSON Web Tokens (JWT) для интеграции с любым внешним бэкендом.
Суть за 30 секунд
Видео демонстрирует, как настроить FlutterFlow для работы с собственным API через JWT. Основной фокус на безопасном обмене токенами, управлении состоянием авторизации и реализации механизмов входа без использования Firebase или Supabase.
📍 Навигация (Timeline)
- 00:00 — Введение: Как работает JWT (Frontend/Backend процесс).
- 00:51 — Настройка FF: Включение Custom Authentication в настройках проекта.
- 01:27 — Сессии: Настройка персистентности и выбор Data Types для пользователя.
- 02:13 — API Login: Создание запроса для входа и передачи учетных данных.
- 03:59 — JSON Path: Извлечение токена из ответа бэкенда.
- 05:45 — Auth State: Сохранение JWT в глобальное состояние приложения.
- 06:16 — Навигация: Переход на защищенные страницы после успеха.
- 07:33 — Protected API: Передача JWT в заголовках (Headers) последующих запросов.
- 09:10 — Logout: Реализация выхода и очистка токенов из памяти.
- 11:20 — Token Expiry: Обработка истечения срока действия и логика обновления.
- 12:55 — Итоги: Проверка безопасности и стабильности потока.
🧠 Ключевые концепции
- JWT, API Integration, Custom Authentication, Auth State, JSON Path
🛠 Практические фишки
- Используйте Data Types для маппинга профиля пользователя из JWT payload.
- Включайте Persist Authentication, чтобы токен не пропадал при закрытии приложения.
- Настраивайте глобальный заголовок
Authorization: Bearer [token]для всех защищенных API-вызовов.
📌 Резюме
Использование JWT позволяет строить независимые от вендоров системы аутентификации, сохраняя при этом удобство визуальной разработки во FlutterFlow.
📺 Практика (Видео)
- Создание админ-ролей во FlutterFlow (правильный подход)
- FlutterFlow Tricks- Create User Accounts for Others
- Supabase Magic Link Authentication in FlutterFlow
- 6 мощных кастомных компонентов для FlutterFlow
- Создание социального приложения на FlutterFlow и Supabase
- n8n- Полный обзор и туториал по автоматизации
- Advanced Workflow- Как избавиться от ограничений FlutterFlow
- FlutterFlow- API-запросы к Supabase
- Название видео
- Создание мобильного дневника на FlutterFlow с локальной базой данных
- Master Forgot and Reset Password in FlutterFlow and Supabase (2025)