Custom States или параметры URL: лучший способ навигации по вашему Bubble приложению
Перевод статьи https://www.amliesolutions.com/bubble/basic-features/custom-states-vs-url-parameters-for-navigation-in-bubble/
При создании одностраничного приложения вам нужно будет решить, использовать ли для навигации custom states или параметры URL.
Удивительно видеть множество руководств и руководств по Bubble, в которых по умолчанию для навигации по страницам используются кастом стейты для скрытия и отображения групп. Хотя во многих случаях стейты будут работать нормально, у них есть свои ограничения, и их не следует использовать просто потому, что это более привычный выбор. Параметры URL такие же быстрые и предлагают несколько интересных дополнительных функций.
В этой статье сравним два метода и то, как выбрать правильный в конкретном сценарии.
Что у них общего
Давайте сначала посмотрим, что у них общего. Оба:
- позволяют мгновенно скрывать и отображать элементы на странице в зависимости от условий
- выполняются на стороне клиента и не зависят от базы данных или каких-либо действий сервера
- могут использоваться в любом условном выражении, в том числе для запуска рабочих процессов
Внешне они похожи, но отличаются тем, как ведут себя в браузере.
Что такое параметры URL?
Параметры URL, хоть и кажутся технически сложными, легко настроить, и если вы ими не пользовались, вы найдете их невероятно ценным инструментом в своем наборе инструментов Bubble.
По сути, все, что они делают - это добавляют какую-то информацию - обычно строку текста к URL в вашем браузере. URL страницы и ее параметры разделяются знаком ?, а дополнительные параметры - со знаком &. Мы говорим о параметрах URL, используя несколько простых терминов:
Строки запроса - это набор всех параметров, которые есть в вашем URL. Независимо от того, хранятся ли у вас один или несколько параметров, все вместе они называются строкой запроса.
Параметр URL состоит из key и value. Key - это строка, которую Bubble использует для поиска нужного параметра, а value - это данные, которые вы сохранили. Вот небольшой пример:
В приведенном выше примере у нас есть домен с именем myapp и страница с именем page. Вы увидите строки запроса после амперсанда. Это типичная навигационная установка с тремя клавишами, каждая из которых содержит уникальное значение. Обратите внимание, что последнее значение ссылается на unique ID определённой записи в базе данных.
Таким образом, параметры URL ничего не делают иначе, чем кастом стейты. Вы просто сохраняете переменную для ссылки откуда-то еще. Также, как и стейты, параметры URL не являются частными - они видны всем прямо в строке URL вашего браузера и никогда не должны использоваться для хранения конфиденциальной информации.
Чем параметры URL-адреса отличаются от Custom States
Основное различие между ними заключается в том, что стейт на 100% зависит от вас как разработчика: его нужно либо установить с помощью действия, либо иметь предварительно определенное значение при загрузке страницы.
Поскольку пользователи могут манипулировать текстом в строке URL, они могут добавлять или изменять параметры по своему усмотрению. Это дает вам несколько возможностей, которые стейты не могут предложить, и несколько подводных камней.
Давайте рассмотрим несколько сценариев, в которых это может быть полезно:
Использование кнопки возврата
Одним из наиболее очевидных способов использования параметров URL для навигации является тот факт, что они распознаются браузером как переход на новую страницу, даже если страницу не нужно перезагружать. Другими словами, ваши пользователи могут использовать кнопку браузера «Назад», чтобы вернуться туда, где они были до изменения. Это особенно полезно для мобильных приложений, где ваши пользователи, естественно, ожидают, что кнопка «Назад» будет работать.
Создание закладок для определенных частей вашего приложения
Если параметр URL может направить вас в определённую часть вашего приложения и загрузить правильную запись из базы данных без какой-либо навигации, ваши пользователи, естественно, начнут переходить непосредственно к этому URL (либо добавляя его в закладки, либо просто браузер предлагая его наиболее посещаемый URL). В качестве примера предположим, что вы создаете инструмент для управления проектами. Если ваши пользователи продолжают переходить к одному и тому же проекту снова и снова, их браузер начнет предлагать этот URL или пользователь добавит его в закладки, чтобы сэкономить время.
Скопировать / вставить ссылку на определенную часть вашего приложения
Как и в предыдущем пункте, логика состоит в том, что пользователи все чаще обмениваются информацией между различными веб-приложениями. Важной деталью этой логики является копирование/вставка ссылок, которые ведут в определенную часть вашего приложения. Если мы снова воспользуемся инструментом управления проектами в качестве примера, ваши пользователи могут захотеть скопировать/вставить ссылки непосредственно на определенные проекты, задачи и даже комментарии пользователей.
Обмен информацией между reusable elements
В отличие от states, параметры URL доступны из любого места в вашем приложении. Другими словами, вы можете использовать их для мгновенной передачи информации между reusable elements. В противном случае для этого потребовалась бы сложная система настраиваемых состояний, обновляющая друг друга или необходимость прибегать к базе данных.
Подводные камни использования параметров URL
Есть несколько ловушек, о которых следует подумать, прежде чем настраивать всю свою навигацию как параметры URL.
Когда вы хотите ограничить доступ
Вы не всегда хотите, чтобы ваши пользователи могли перемещаться, изменяя URL. Типичные примеры - пропустить шаги в процессе адаптации или получить доступ к ограниченной части приложения. Используйте действия, чтобы перенаправить их, или условия, чтобы скрыть группы на основе других критериев. Но имейте в виду, что небольшой процент пользователей все же пытается манипулировать параметрами URL, что создает угрозу безопасности.
Когда вы не хотите, чтобы кнопка "Назад" работала
Вы не всегда хотите позволять своим пользователям возвращаться с того места, откуда они пришли. Если пользователь входит в ваше приложение, а затем щелкает обратно, возвращение его в эту форму, вероятно, не то, что вам нужно. Используя кастом стейт или скрывая/отображая группы с действием, пользователь не может вернуться.
Часто задаваемые вопросы
Custom States быстрее, чем параметры URL для навигации?
Нет, оба варианта работают мгновенно, и нет никакой выгоды от выбора одного по сравнению с другим.
Custom States более безопасны, чем параметры URL?
Оба варианта требуют, чтобы вы установили различные меры безопасности, чтобы избежать неправильного использования и случайного раскрытия информации или частей вашего приложения непреднамеренно. Хотя параметры URL будут отображать любую информацию в строке URL, с технической точки зрения ни один из них не более безопасен, чем другой.
Может ли пользователь управлять параметром URL?
Да, параметрами URL может управлять любой пользователь в любом приложении (не только в Bubble), поскольку он доступен прямо в строке URL браузера.
Как я могу изменить параметр URL в Bubble?
Параметры URL можно легко добавить, удалить или изменить с помощью действия «Go to page action» и установки флажка «Send more parameters to the page». Это позволит вам добавить key и value, на которые можно ссылаться в другом месте приложения.