Управление состоянием: URL + json 'stringify' / 'parse'

[armidoll]

Доброго времени суток!

1. Есть spa/модуль/страница/что_угодно
2. Состоянием управляем через URL, например:

site.com/page#section01&&state={param01:0001, ... , paramN:1000}

3. Всё, что после 'state=' результат, например:

encodeURIComponent( JSON.stringify( stateMap ) )

( где stateMap обычный объект - карта состояния ).
Восстановление состояния происходит с использованием в т.ч. JSON.parse( stateStr ) ( где stateStr - часть URL после 'state=' из п.2)

1. Какие могут быть недостатки у такого подхода?
2. Есть ли подход, который считается лучше? Почему?

[Malleys]

1. Не работает в Opera Mini
2. Не стоит хранить в URI личные данные.
Если туда впихнуть в JSON объект, ссылка может получиться длинной.
В таком случае можно исползват массив с только значениями объекта.

Например есть объект:

  {
    "page": "planner",
    "start": "@20",
    "end": "@35",
    "lang": "ru"
  }

ОБЪЕКТ
У вас получится

#state={"page":"planner","start":"@20","end":"@35","lang":"ru"}

МАССИВ
Но можно решить что у вас ключи идут в таком порядке: "page" "start" "end" "lang"
Тогда получится (исползуя в качестве разделителей "/")

#state=planner/@20/@35/ru

В hash можно запихнуть только массив

#planner/@20/@35/ru

У вас было

site.com/page#section01&&state={param01:0001, ... , paramN:1000}

Можно переделать например в

site.com/page#section01/0001/ ... /1000

P. S. Я сам часто использую такой подход (используя событие hashchange или history.pushState/history.replaceState), поскольку именно нравится то, что
1) работает навигация
2) возможно добавить ссылку в закладки или скопировать и отправить кому-то и увидят тоже самое
3) если ссылки на странице сформулированы в виде <a href="#something">(в случае със hashchange) то при переходе по ней не происходит перезагрузки

[armidoll]

Спасибо за мнение.

Дополняю:
Хотелось бы, чтобы набор ключей - параметров и их порядок в карте состояния могли быть произвольными. Есть, к примеру, дефолтные состояние параметров, которые не сохраняются, а пишутся только в случае их изменения ( мне показалось, это какая-никакая экономия )

Есть пример:
http://www.gwd.ru/projects/

Мне показалось в этом случае излишним добавлять в URI 'area' и 'cost', даже тогда, когда они не меняются. Возможно, чего-то не понимаю.

Ссылка действительно нередко получается длинной, я кроме как пользоваться сторонним сервисом сокращения ссылок пока не нашел решения ( не нравится, что становимся зависимым от него ).

[Malleys]

Хотелось бы, чтобы набор ключей - параметров и их порядок в карте состояния могли быть произвольными.

Думаю, первое значение может определять какая карта состояния используется...

Например
#product/17/
после парсинга ["product", "17"]
17-ый продукт

#search/115,300/6000,15000/
после парсинга например ["search", [115, 300], [6000, 15000]]
ищем стоимость 115...300 площадь 6000...15000

И соответственно в зависимости от первого значения знаем как разбирать остальные данные

Например в реальных проектах такой подход используетя

1. Google переводчик
https://translate.google.ee/?hl=bg&t...n/ru/my%20word
обратите внимание когда печатаете состояние сразу меняетя и в URI

2.Google mail
https://mail.google.com/mail/u/0/?ta...5083682d92e3b0
https://mail.google.com/mail/u/0/?ta...58ce1e9ff5c684
обратите внимание у них первый показывает какая папка и так далее

3. Расписания общественного транспорта г. Таллинна
Здесь таким образом зависит, какой вид показывать:
- если расписание, то какой вид транспорта, направление, показывать ли карту,
- если поиск маршрута, то начальная и конечная остановка
- и т.д и т.д

https://transport.tallinn.ee/#bus/2/a-b/13604-1/map/ru
https://transport.tallinn.ee/#plan/2...4-1,13705-1/ru

И заметьте ссылки не такие и длинные в общем получаются...

[armidoll]

Ок. Спасибо, сподвигли на мысль кодировать/декодировать части карты состояния.