Оформление
Пользовательская страница входа - FineReport Справка | Разработка отчетов | Использование отчетов | Учебные пособия
Настройте страницу входа в систему
1. Обзор
1.1 Версия
| Версия сервера FineBI | Функциональные изменения |
|---|---|
| 6.0 | - |
1.2 Ожидаемые результаты
Когда пользователь входит в систему Data Decision System и не хочет использовать экран входа по умолчанию, он может изменить экран входа по умолчанию, настроив его, как показано на следующем рисунке:
1.3 Идеи решений
Экран входа в систему, на котором указаны имя пользователя и пароль, отправляется в BI-систему, а BI-служба обращается к адресу аутентификации с этими двумя параметрами для проверки подлинности.
2. Настройка пользовательского экрана входа в систему
2.1 Новый HTML-файл
Создайте новый HTML-файл для настройки страницы входа в BI-проект и сохраните его в каталоге %BI_HOME%\webapps\webroot. Содержимое файла должно быть следующим:
Примечание: Измените IP и номер порта URL в html-файле (т.е. в приведенном ниже коде) в соответствии с реальной ситуацией.
Нажмите, чтобы загрузить и распаковать в HTML-файл: login.zip
<html> <head> <meta charset="utf-8"> <meta&
nbsp;http-equiv="X-UA-Compatible" content="IE=edge"> <meta name=""
viewport" content="width=device-width, initial-scale=1"> <title>ДЕМО пользовательского логина
</title> <!
-- Пользовательский стиль, используйте по мере необходимости --> <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/
bootstrap.min.css" rel="stylesheet"> <script src="https://cdn.bootcss.
com/html5shiv/3.7.3/html5shiv.min.js"></script> <script src="https://cdn.bootcss.
.com/respond.js/1.4.2/respond.min.js"></script> <style> &
nbsp; .container { display: flex
; justify-content: center; &
nbsp; } .login-box {  
; ширина: 300px;
margin-top: 100px; } .
login-box h2 { font-size: 26px; &
nbsp; text-align: center;  
; margin-bottom: 25px; } .
nbsp; .login-item { margin-bottom:&
nbsp;20px; } </style> </head> <body> &
lt;div class="container"> <form class="login-box" action="&&&
quot; method="post" onsubmit="return false;">  
; <h2>FineBI Business Intelligence</h2> <div class="login-item">   ; <label for="inputUsername" class=""
sr-only">Имя пользователя</label> <input type=&& quot;text" id="inputUsername" class="form-control" placeholder="Username"
required="" autofocus=""> </div>  
; <div class="login-item">
<label for="inputPassword" class="sr-only">Пароль</label>   ; <input type="password" id="inputPassword"&
nbsp; class="form-control" placeholder="password" required=""> &
nbsp; </div> <button class="btn btn-lg btn-
primary btn-block" type="submit" id="submitBtn">Войти в систему</button> &
nbsp;</form> </div> <!
-- Поскольку он встроен в проект, вы можете использовать fineui напрямую --> <script src="http://localhost:37799/webroot/decision/file?path=/com/fr/web/
ui/fineui.min.js&type=plain&parser=plain"> </script> <script> document.
getElementById("submitBtn").addEventListener("click", function () { &
nbsp; doSubmit(); }); function doSubmit() { & nbsp; var username = document.getElementById("inputUsername").value.
trim(); var password = document.getElementById("inputPassword&
quot;).value.trim(); if (username === "") { &
nbsp; window.alert("Пожалуйста, введите имя пользователя"); &
nbsp; return false; } &
nbsp; if (password === "") { &
nbsp; window.alert("Пожалуйста, введите пароль");
return false; } /**
* Отправляет пост-запрос через интерфейс авторизации, содержащий такую информацию, как имя пользователя и пароль */
$.ajax({
url: "http://localhost:37799/webroot/decision/login", &
nbsp; contentType: "application/json",
type: "POST", dataType: "json"
;, data: JSON.stringify({  
; имя пользователя: имя пользователя,  
nbsp; пароль: пароль,  
; validity: -1, &
nbsp; origin: getUrlQuery("origin") &
nbsp; }), success: function (res
) { // Сохраняется ли возможность остаться на сайте после успешного входа и
токен if (res.data) { & nbsp; var
data = res.data; & nbsp; var day = data.data nbsp; var day = data.validity === -2 ?
(14 * 24) : -1;   ; BI.Cache.addCookie("fine_remember_login", data.validity, "/",
день); BI.
Cache.addCookie("fine_auth_token", data.accessToken, "/", day); BI.
nbsp; // затем переходим на соответствующую страницу   ; var response =&
nbsp;data.originUrlResponse;
if (BI.toUpperCase(response.method) === "GET") { & nbsp; window.location.
href = response.originUrl; &
nbsp; } else {   ; doActionByForm(response.originUrl, response.parameters, {
method: response.method}); &
nbsp; } }
else {  
;// Выдаем сообщение об ошибке alert(res.originUrl)
nbsp;alert(res.errorMsg); } }
nbsp; }, &
nbsp; error: function () {
alert("Таймаут или другая ошибка сервера"); } &
nbsp; }); } // Запрашиваем параметры url &
nbsp;function getUrlQuery (name) { var reg = new 
;RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg); if& nbsp;(r !
== null) return r[2]; return """; &
nbsp;} // Переход через форму function doActionByForm (url, data,&
nbsp;options) { options = options ||&
nbsp;{}; var config = { &
nbsp; method: options.method, &
nbsp; url: url, &
nbsp; data: data, &
nbsp; target: options.target &
nbsp;}; var $form = $("<form
method=\"" + config.method + "\" />"); &
nbsp; $form.attr("action", config.url);  
; $form.attr("method", config.method || "post"); $form.attr("target", config.target || "_self"); ; $form.attr("target", config.target || "_self")
for (var key in config.data) { & nbsp; $form.append("<input type=\"hidden\" name=\" + key + "\" value=\" +
config.data[key] + "\" />"); &
nbsp;} $(document.body).append($form); &
nbsp; $form[0].submit();  
; $form.destroy(); } </script> </body> </html>Примечание: Пользователи также могут настроить свой логин, используя пост-переход, нажмите, чтобы загрузить и распаковать HTML-файл:register.zip.
2.2 Настройка страницы входа в систему
Администратор входит в систему Data Decision System, нажимает "Management System > Appearance Configuration > Login Page", выбирает метод входа "Set Login Web Page" и вводит путь к настроенной странице входа: "login.md", как показано на следующем рисунке:
Примечание: Если файл страницы входа находится в одном проекте, вы можете использовать относительный путь для URL веб-страницы, а если вы используете его на разных доменах в разных проектах, пожалуйста, используйтеhttp://ip:port/工程名/形式.
2.3 Предварительный просмотр
Пожалуйста, "Предварительный просмотр" перед "Сохранением", чтобы страница входа не была настроена неправильно, что не позволит вам войти в систему. Как показано на рисунке ниже:
Примечание: Если при входе на страницу предварительного просмотра вы получаете сообщение об ошибке 404, это означает, что в приведенном выше HTML-файле есть ошибка, поэтому внимательно проверьте его и измените до тех пор, пока он не станет правильным.
2.4 Сохранение конфигурации
После того как эффект предварительного просмотра будет корректным, пользователь может нажать кнопку "Сохранить" в правом верхнем углу, выйти из текущей учетной записи и снова войти в Data Decision System, эффект пользовательской страницы будет таким, как показано в ожидаемом эффекте в разделе 1.2 данной статьи.
3. Доступ к приборной панели с включенной аутентификацией по шаблону
Используйте пользовательский экран входа, включите шаблонную аутентификацию, получите доступ к единой приборной панели, перейдите на пользовательский экран входа в систему, успешно выполнив вход, вы сможете просматривать приборную панель.
Пример:
Установите настраиваемый экран входа в систему с включенной аутентификацией по имени пользователя и паролю, ссылка для предварительного просмотра приборной панели выглядит так: http: //localhost:37799/webroot/decision/v5/design/report/6c92aa9694204baa838cadf0e0a9d551/view, другой пользователь получает доступ к URL панели, эффект показан на рисунке ниже:
4. условия
Когда система устанавливает пользовательскую страницу входа, она несовместима с элементами конфигурации, связанными с "Администрирование системы > Вход".
Например, после включения функции "Обязательное изменение начального пароля" пользовательская страница входа не может перейти на экран изменения пароля, что приводит к невозможности входа.
