Виджет авторизации: различия между версиями
Нет описания правки |
|||
| Строка 17: | Строка 17: | ||
== '''Настройка виджета''' == | == '''Настройка виджета''' == | ||
[[File:IG.png|thumb|Пример отображения переноса виджета в личный кабинет|150px]] | |||
{{Note|Виджет авторизации настраивается самим пользователем при входе |warn}} | {{Note|Виджет авторизации настраивается самим пользователем при входе |warn}} | ||
=== '''Получение виджета''' === | === '''Получение виджета''' === | ||
Пользователь получает виджет в виде архива.<br> | Пользователь получает виджет в виде архива.<br> | ||
Этот архив интегрируется в личный кабинет. Его добавление происходит в разделе "Контент" во вкладке "Виджеты". Встраивание происходит с помощью перетаскивания архива из репозитория где он хранится в окно личного кабинета.<br> | Этот архив интегрируется в личный кабинет. Его добавление происходит в разделе "Контент" во вкладке "Виджеты". Встраивание происходит с помощью перетаскивания архива из репозитория где он хранится в окно личного кабинета.<br> | ||
| Строка 25: | Строка 25: | ||
=== '''Создание трансляции''' === | === '''Создание трансляции''' === | ||
[[File:Разрешение.png|thumb|right| | [[File:Разрешение.png|thumb|right|Настройка разрешения |150px]] | ||
# Первоначально нужно перейти в главную панель навигации | # Первоначально нужно перейти в главную панель навигации | ||
# В разделе «Трансляции» выбрать пункт «Создать»<br> | # В разделе «Трансляции» выбрать пункт «Создать»<br> | ||
# В появившемся окне задаем параметры страницы. Для этого в верхней части экрана нажимаем "шестерёнку" и в появившемся меню указываем параметры «Ширина» и «Высота». Нажимаем сохранить. По умолчанию используется горизонтальная ориентация 1920Х1080. | # В появившемся окне задаем параметры страницы. Для этого в верхней части экрана нажимаем "шестерёнку" и в появившемся меню указываем параметры «Ширина» и «Высота». Нажимаем сохранить. По умолчанию используется горизонтальная ориентация 1920Х1080. | ||
# Выбираем зону трансляции нажав на специальный иконку и растягиваем ее на все поле. | # Выбираем зону трансляции нажав на специальный иконку и растягиваем ее на все поле. | ||
[[File:Подготовка экрана.png|thumb|right|Подготовка трансляции | | [[File:Подготовка экрана.png|thumb|right|Подготовка трансляции |150px]] | ||
=== '''Добавление виджета''' === | === '''Добавление виджета''' === | ||
Версия от 08:46, 18 августа 2023
Описание ситуации
Пользователям периодически необходимо загрузить контент со своего сайта. Для получения контента им чаще всего нужно пройти процесс авторизацию. Чтобы не проходит аутентификации в ручном режиме и полностью автоматизировать процесс был создан виджет авторизации.
Логика работы виджета
- Подготовить трансляцию
- Пользователь заходит на страницу авторизации и копирует URL страницы
- В этой же странице разворачивает окно "Логин" на полный экран, нажав "F11".
- Тоже самое делает с окном "Пароль"
- Сохраняет скриншоты на своём устройстве
- Заходит в личный кабинет SmartPlayer
- Создаёт папку для скриншотов внутри личного кабинета и переносит их в нее
- Запускает виджет по инструкции и заносит в него нужные данные
- Авторизуется с помощью виджета и может продолжать демонстрировать контент
Важно: Если пользователь использует в качестве устройства ноутбук и после нажатия "F 11" может не произойти никаких действий. Это связано с тем что в операционной системе у него "по умолчанию" стоит включено - "использование панели Function". В таком случае, чтобы развернуть страницу браузера необходимо нажать клавиши "Fn + F 11".
Настройка виджета
Получение виджета
Пользователь получает виджет в виде архива.
Этот архив интегрируется в личный кабинет. Его добавление происходит в разделе "Контент" во вкладке "Виджеты". Встраивание происходит с помощью перетаскивания архива из репозитория где он хранится в окно личного кабинета.
После этого виджет будет хранится внутри вашего личного кабинета
Создание трансляции
- Первоначально нужно перейти в главную панель навигации
- В разделе «Трансляции» выбрать пункт «Создать»
- В появившемся окне задаем параметры страницы. Для этого в верхней части экрана нажимаем "шестерёнку" и в появившемся меню указываем параметры «Ширина» и «Высота». Нажимаем сохранить. По умолчанию используется горизонтальная ориентация 1920Х1080.
- Выбираем зону трансляции нажав на специальный иконку и растягиваем ее на все поле.
Добавление виджета
Кликаем на рабочем поле обращаем внимание на появившееся меню под названием "контент", в правой части экрана нам представлены несколько папок с отсортированным контентом и главная папка со всем загруженным в систему контентом.
Выбираем нужный виджет и перетаскиваем его в рабочее поле. Во вкладке «Настройка контента» в правой части экрана, указываем продолжительность 10400сек
Подготовка подложки
В браузере открываем страницу авторизации Google, включаем полноэкранный режим (по умолчанию F11) и делаем полный скриншот. Далее вводим логин и переходим на страницу с вводом пароля, аналогично делаем скриншот экрана. Создаем отдельную папку во вкладке «Контент» и добавляем туда сделанные скриншоты.
Работа с виджетом
Настройка виджета
В качестве примера будет использоваться страница авторизации в Google.
Указываем адрес страницы (URL) сервиса авторизации Google. Скролим в самый низ страницы настроек и выбираем папку, где хранятся скриншоты. Нажимаем «Сохранить» и «Применить настройки»
После у нас отобразились наши скриншоты и поля, которые необходимо подставить.
Первым делом заполняем данные на полях логина и пароля. По умолчанию поля находятся в верхнем левом углу
В дальнейшем эти данные будут подставлены в соответствующие поля.
Выбираем скриншот с логином и в нём совмещаем контуры окна логин подставляем поле логин. Очень важно правильно совместить контуры окна логина скриншота с окном "логина" виджета. Кнопку «далее» совмещаем с прямоугольником «next».
Переходим на следующий скриншот. В поле «пароль», подставляем поле «пароль».
На кнопку «далее» на скриншоте с паролем подставляем «Authorize».
Нажимаем кнопку «Сохранить».
Далее даем название нашей трансляции, сохраняем ее и запускаем на устройстве.
Внешний вид виджета
Виджет состоит из четырёх блоков:
- Логин - прямоугольная область с данными. В эту строку вставляется электронная почта. Совмещаем с областью "логина" на скриншоте
- Пароль - прямоугольная область с данными. В данную строку прописывают пароль. Совмещаем с областью "пароля" на скриншоте.
- Authorize - прямоугольная область, которая производит нажатие кнопки (кликер). Совмещаем с кнопкой "авторизация" на скриншоте.
- Next - прямоугольная область, которая производит нажатие кнопки (кликер). Совмещаем с кнопкой "далее" на скриншоте
Итоговый результат
Использование виджета позволит сохранить пользователю конфиденциальность своих данных и при этом он сможет использовать систему автологинизации.
