Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

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

Веб-интерфейс системы WNAM состоит из следующих разделов:

  • интерфейс администратора (включая общие роли наблюдателя и оператора)
  • интерфейс владельца площадки (вид привязан к назначенным площадкам оказания услуги)
  • интерфейс рекламодателя и рекламного агента
  • интерфейс абонента

Интерфейсы первых трех типов служат для управления системой - настройки праметров, получения отчетной и справочной информации

Интерфейс четвертого типа (абонентов) служит для взаимодействия с пользователем, подключившимся к сети Wi-Fi, и служит для:

  • перехвата веб-сессии, поступившей с портала (хотспота) сервера доступа или беспроводного контроллера
  • отображение страницы СМС идентификации (по звонку, через госуслуги, через ваучер)
  • отображения страницы приветствия и согласия с условиями (перенаправление), переход на авторизацию через социальную сеть, или на опрос
Страницы, отображаемые абонентам, выдаются веб-сервером tomcat, работающем на сервере WNAM (аналогично административному интерфейсу). Все страницы имеют корневую ссылку (путь) /cp/ или /adv/.
В обычном режиме работы страницы абонентов настраиваются из административного интерфейса WNAM в разделе Загружаемые страницы портала
При необходимости, администратор на заданной площадке может включить режим работы с рекламой, в таком случае вместо обычных страниц авторизации и перенаправления будут отображаться рекламные блоки, соответствующие активным и совпавшим по параметрам рекламным кампаниям.
Страницы любого типа представляют собой блоки HTML-кода, хранящиеся в базе данных mongodb системы WNAM, а не в виде файлов на файловой системе. Текст страниц можно отредактировать в произвольном редакторе и загрузить в систему, а также непосредственно из инструментов работы со страницами. Там же можно загружать дополнительные файлы (CSS, JS, изображения).
Все типы страниц перед отправкой абоненту проходят динамическую обработку, которая заключается в замене заданных конструкций в теле страницы текущими значениями. К таким конструкциям относятся параметры:

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

 

ПараметрОписание и значение
$(phone)Номер телефона абонента. Если пока не известен (на первом этапе СМС авторизации, то пустая строка)
$(mac)МАС-адрес устройства абонента
$(dst)Ссылка, на которую требуется перенаправить абонента
$(dst-orig)Оригинальная ссылка, к которой обратился абонент
$(form)Имя шаблона страницы (формы)
$(error)Сообщение об ошибке, если имеется
$(size)Длина ожидаемого СМС кода (4 или 6)
$(size-format)Формат ожидаемого СМС кода (1234 или 123456)
$(soc_esia)Ссылка на портал авторизации Госуслуг (ЕСИА)
$(voucher-format)Формат номера ваучера
$(voucher-length)Длина номера ваучера
$(minibrowser)Признак (true/false), что страница открыта в мини-браузере устройства
$(smscode)Код СМС авторизации (для шаблонов методов отправки кода абонентом)

$(soc_fb), $(soc_ok)

$(soc_vk), $(soc_in)

Ссылки на страницы авторизации через социальные сети, включая ключи доступа и ссылки возвратного перенаправления

 


Типы страниц

WNAM поддерживает несколько различных типов авторизации (СМС, звонок (приём и передача), ваучеры, гостиничные сисстемы). Каждому из них соответствует определенная логика обработки формы, поступающей от абонента, следовательно тип страницы. Внутри каждой из страниц, помимо элементов оформления, находится HTML-форма, отправка которой в WNAM производится по методу POST с передачей набора параметров.

Ниже приведены некоторые варианты форм:

СМС авторизация

<form id="smsPhase1" class="form-signin" data-toggle="validator" role="form" name="sms" action="/cp/sms" method="post">
     <input type="hidden" name="phone" value="$(phone)" id="hiddenPhone"/>
</form>

Вход через ваучер

<form id="voucherPhase" class="form-signin" data-toggle="validator" role="form" name="voucher" action="/cp/voucher" method="post">
    <input id="code" type="text" name="code" class="form-control" placeholder="${template_codeplaceholder_text}"
    size="$(voucher-length)" data-error="${template_codeerror_text}: $(voucher-format)" required>
</form>


Страница приветствия (перенаправление), получение доступа в сеть:

<form id="redirectForm" class="form-signin" data-toggle="validator" role="form" name="redirect" action="/cp/login" method="post">
    <input type="hidden" name="dst" id=dstRef value="$(dst)"/>
</form>

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

Внимание! Все остальные параметры (МАС-адрес абонента, первоначальная ссылка, идентификатор плозадки и т.п.) начиная с версии WNAM 1.3 передаются не в параметрах формы, а хранятся на сервере WNAM во временной таблице (кэш CI). Длительность хранения записи в кэше по умолчанию 300 секунд, это время отводится абоненту для прохождения цикла авторизации и получения доступа.

Отображение логотипа WNAM

Штатные страницы всех типов внизу содержат блок текста, в котором присутствует логотип, название, popup-блок и ссылка на сайт системы управления беспроводным доступом WNAM. По условиям лицензионного соглашения пользователя WNAM вы не имеете права модифицировать и удалять этот блок, если только у вас не была приобретена соответствующая лицензия (брендирование). В случае нарушения данного запрета может последовать юридическое преследование лицензиата, вплоть до отзыва лицензии.

Возможности по вводу номера телефона абонента


Возможности по вводу номера телефона абонента

Для корректировки параметров ввода номера телефона на странице СМС-авторизации (и авторизации по звонку), возможна модификация исходного кода соответствующей страницы в экспертном режиме. за обработку введенного номера отвечает библиотека libphonenumber, обработчик действия которой расположен внизу страницы:

var mobileNumber = $('#mobile-number');
mobileNumber.intlTelInput({
autoFormat: !is_firefox_android,
nationalMode: false,
onlyCountries: ['ru', 'by', 'kz'],
preferredCountries: ['ru'],
utilsScript: '/lib/libphonenumber/build/utils.js'
});

Вы можете:

  • Указать перечень допустимых стран (флажков) в окне ввода номера, изменив набор колов стран в параметре onlyCountries
  • Разрешить выбор любой страны (флага) убрав всю строку с параметром onlyCountries
  • Установить флаг (страну) по умолчанию в параметре preferredCountries



Страницы основного интерфейса абонента

Основной интерфейс использует следующие шаблоны страниц:

Название страницыНазначение и пояснения
smsОсновная страница авторизации через СМС (отправка СМС абоненту)
sms_recvСтраница авторизации через СМС (ожидаем СМС от абонента). Вторая фаза обновляет страницу каждые 5 секунд, проверка дошла ли СМС.
call_recvАвторизация через запрос звонка от абонента
voucherАвторизация через ваучер
soc_net_redirПеренаправление на вход через социальную сеть
quizПеренаправление на опрос
quiz_finishСтраница, демонстрируемая после успешного прохождения опроса
overlimitСтраница, демонстрируемая при превышении какого-либо ограничения
bs_finalСтраница последней стадии входа в сеть через контроллер Bluesocket
redirectСтраница с перенаправлением (авторизация прошла успешно, войти в Интернет)
redirect_videoСтраница с показом видеоролика при входе в сеть (перенаправление)

Страницы типа sms. sms_recv, call_recv имеют две фазы:

  • ввод телефонного номера
  • ввод кода из СМС, запрос совершения звонка либо отправки СМС с последующей проверкой

Каждая из фаз имеет соответствующую секцию в HTML-коде страницы, выбор той, которую показывать или скрывать, определяется наличием подставленного номера телефона вместо конструкции $(phone).

Дистрибутивные шаблоны страниц доступны по ссылке http://www.netams.com/files/wnam/portalpages/, также находятся на вашем сервере WNAM по адресу /var/lib/tomcat8/webapps/ROOT/WEB-INF/cp/

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

Страницы, используемые в расширенном механизме работы с рекламой

Механизм работы с рекламой использует:

  • одну обязательную страницу advertisement_image.html, которая применяется при отображении рекламных блоков, состоящих исключительно из загруженного изображения. Если вы планируете использовать такую рекламу, вы должны загрузить шаблон такой страницы в общем административном разделе "загружаемые страницы портала". 
  • произвольные страницы, отображаемые вместо штатных страниц авторизации и перенаправления, в зависимости от настроек рекламных кампаний

Дистрибутивные страницы шаблонов, которые вы можете использовать в своей работе, вы можете загрузить здесь: http://www.netams.com/files/wnam/advpages/

Разработаны следующие образцы:

Название страницыНазначение и пояснения
advertisement_example.htmlСтраница с рекламой, функционально равная странице redirect
advertisement_example_sms.htmlСтраница СМС-авторизации, функционально равная странице sms
advertisement_example_sms_recv.htmlСтраница СМС-авторизации, функционально равная странице sms_recv
advertisement_example_video.htmlСтраница с видеороликом, функционально равная странице redirect
advertisement_image.htmlСтраница с рекламой, функционально равная странице redirect, и предусматривает демонстрацию изображения на весь экран устройства, возможно с возможностью отслеживания поворота

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

В дополнение к динамически заменяемым в страницах рекламы параметрам, перечисленным выше, используются:

ПараметрОписание и значение
$(banner)Ссылка на изображение, показываемое на весь экран в странице advertisement_image.html
$(companyId)Идентификатор рекламной кампании
$(blockId)Идентификатор рекламного блока
$(pageId)Идентификатор страницы (файла) рекламного блока

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

Для этого применяется конструкция вида:

<button type="submit" class="btn btn-primary" onclick="getAdv(true);">

...

function getAdv(clicked) {
var c = "$(companyId)";
if (c.substring(0,2) == "$(") return;
var c = "";
if (clicked == true) { c = "&clicked=yes"; }
var url = "/adv/advblockpages/display?companyId=$(companyId)"+c;
$.get(url);
}
getAdv(false);

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

...