Варианты подключения виджета и получения параметров?

Question

[sashavol]

Добрый день!

Возможно кто сталкивался с похожими задачами, хочу попросить совета опытных разработчиков (а может и воспользоваться вашими услугами).

Сейчас мы делаем виджеты на сайт и некоторые проблемы начали проявляться. На данный момент мы рисуем виджет на сайте и в принципе проблем никаких нет, но, у виджета появляются параметры (цвет, положение и др.) все параметры мы планируем хранить в личном кабинете и вопрос встал, как их передать каждому клиенту персональные настройки.
Поясню: сейчас виджет подключается одной строчкой кода js с токеном клиента, без iframe

Так вот, какие есть варианты для передачи параметров каждому клиенту? Есть вариант создавать iframe где хранить параметры и оттуда таскать уникальные параметры для каждого клиента. Очень важно чтобы подключение осталось таким же, одной строчкой тега script с токеном клиента. Существуют какие-нибудь решения? :)

Answer 1

[_ _]

Сделайте шаблон скрипта, заменив параметры плейсхолдерами. По запросу отдавайте не статику, а рендерите этот шаблон, подставляя вместо плейсхолдеров настройки для конкретного клиента. Кешируйте для каждого клиента его скрипт.

Answer 2

[Алексей Уколов]

Предположу, что по токену вы сможете получить параметры клиента.
Тогда, я бы сделал такую схему:

1. Клиент подключает основной виджет.
   
2. В этом виджете делается запрос с токеном на ваш сервер, в ответ на который приходит json с параметрами.
   
3. Эти параметры используются в основном виджете и он рисует себя на странице.
   

Нужно, конечно, учесть нюансы вроде неполучения ответа на второй запрос (рисовать виджет с дефолтными параметрами по таймауту, например), но в целом схема несложная.

Альтернативный вариант - генерировать код виджета для каждого клиента отдельно на лету, вставляя значения параметров прямо в нужные места, но он кривоват и лишит вас кеширования.

Comments

[sashavol]

Да хороший вариант, у нас api отдает сейчас так, но заметил, что у всех виджетов встраиваемых в сайты нету таких запросов для получение параметров клиента, сервисы типа обратных звоноков, комментариев (callbaska.ru, cackle.me). У нас схожий виджет.

[Алексей Уколов]

В принципе, Александр Марченко прав - можно записывать на диск файл для конкретного клиента и не генерировать его каждый раз. А если вы ещё и токен будете передавать не как get-параметр, а как часть URL, то вы и заголовки кеширования сможете нормальные поставить. Такое решение упростит ваш код и сделает его более надёжным (не будет зависимости от дополнительного запроса настроек).

Answer 3

[Кирилл]

Я тоже пробовал создать виджет, подключаемый одной строчкой, ломал голову и подсматривал решения других сервисов. Вот, что было бы хорошим, по моему мнению, вариантом:
1) Строка кода на сайте с ID виджета подключает к странице скрипт, который...
2) Создаёт iframe, внутри которого будет рендериться сам виджет, также внутри iframe подключается скрипт, который рендерит виджет согласно конфигу и CSS для элементов, которые будут одинаковыми у всех клиентов.
3) Этот скрипт внутри iframe подтягивает ID виджета либо как глобальную переменную, которую объявил скрипт из пункта 1, либо другим способом и запрашивает у сервера полный конфиг виджета в виде JSON и далее создаёт внутренние элементы виджета внутри iframe. Чтобы каждый раз не тягать конфиг, но и не иметь проблем с кэшированием, можно сохранять в LocalStorage весь объект с конфигом и c версией конфига в виде числа, генерирующегося при записи конфига и при очередной загрузке страницы просто запрашивать у сервера конфиг с параметром, содержащим версию того конфига, что в ls и если сервер ответит, что он не изменился, брать из ls. Если изменился - он отправит новый конфиг, который будет записан вместо старого