Есть основной сайт с iframe
В этот iframe вставляется Веб-приложение написанное на Google Script.
Веб приложение состоит из 2-х страниц: Авторизации и Главной страницы.
На странице авторизации есть кнопка "Войти" - по ее нажатию идет переход на Главную страницу.
По этому же принципу написана кнопка "Выйти" на Главной странице - она должна возвращаться на страницу Авторизации.
В режиме разработчика все работает как надо.
Стоит развернуть приложение и встроить его на сайт во фрейм - первое нажатие на кнопку (эта кнопка "Войти") работает как надо и идет переход на нужную страницу, а вот второе нажатие на любую другую кнопку на новой странице всегда приводит к белому экрану.
Что испробовал:
1. Сделал загрузку первой страницы "Главной" и нажав на кнопку "Выйти" - все работает как надо и переходит на страницу Авторизации. Там нажимая на кнопку "Войти" - опять белый экран.
2. У страниц, чтобы они загружались в том же фрейме base target="_self". Так 2-ое нажатие приводит к белому экрану. Если поставить target="_top" - все работает нормально, однако действие уходит с основного сайта и появляется надпись в верху страницы "Это приложение создано другим пользователем, а не компанией Google."
3. Естественно используется .evaluate().setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL) в обоих случаях загрузки страниц.
Пример работы приложения (пароль при авторизации любой):
https://sites.google.com/view/fkprofi/%D0%B3%D0%BB...
JS// Главная функция
function doGet(e) {
if (e.parameter.page === "index") {
var tmp = setTmp(e);
return render("index",tmp);
} else {
return loadHome()}
};
// Формирование данных для отображения по клиенту
function setTmp (e) {
var tmp = {};
tmp.operator = e.parameter.oper;
return tmp;
};
//-----------------------
// Загрузка страницы с логином и паролем
function loadHome(){
var operator = ["1", "2", "3"];
var htmlListArray = operator.map(function(r) {return '<option>' + r[0] + '</option>'; } ).join();
var tmp = {};
tmp.operator = htmlListArray;
return render("home",tmp);
};
function getUrl() {
var url = ScriptApp.getService().getUrl();
return url;
};
function include(filename) {
return HtmlService.createHtmlOutputFromFile(filename).getContent();
}
// Рендер страницы
function render(file, argsObject){
var tmp = HtmlService.createTemplateFromFile(file);
if (argsObject) {
var keys = Object.keys(argsObject);
keys.forEach(function(key){
tmp[key] = argsObject[key];
});
} //END IF
return tmp.evaluate().setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
Страница Авторизации<!DOCTYPE html>
<html>
<head>
<base target="_self">
<?!= include("page-css") ?>
</head>
<body>
<div class="container" >
<div id="loginDisplay" > <!-- Авторизация -->
<div class="container" >
<h2>Авторизация</h2>
<select id="username">
<option value="1" disabled selected>Имя оператора</option>
<?!= operator ?>
</select>
<label>Имя оператора</label>
<label>Пароль</label><br>
<input type="password" id="password" /><br>
<input type="button" class="waves-light btn green darken-3" value="Войти" onclick="LoginUser()" /><br>
<span id="errorMessage" style="color: red" ></span>
<?var url = getUrl();?><input type="hidden" value="<?= url ?>" id="url" />
</div>
</div> <!-- Конец авторизации -->
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
<script type="text/javascript" src="js/materialize.min.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
var selectBoxes = document.querySelectorAll('select');
M.FormSelect.init(selectBoxes);
});
function LoginUser() {
var operator = document.getElementById("username").value;
var operatorId = document.getElementById("password").value;
var url = document.getElementById("url").value;
var link = document.createElement('a');
link.href = url+"?oper="+operator+"&operId="+operatorId+"&page=index";
link.id = 'linkURL';
document.body.appendChild(link);
document.getElementById("linkURL").click();
};
</script>
</body>
</html>
Главная страница<!DOCTYPE html>
<html>
<head>
<base target="_self">
</head>
<body>
<div class="row">
<div class="col m7">
<h5>Оператор: <?= operator ?> </h5>
</div>
<?var url1 = getUrl();?>
<div class="col m1">
<input type="hidden" value="<?= url1 ?>" id="url1" />
<a class="waves-light btn red darken-3" href="<?= url1 ?>?page=home"/>Выйти </a> // Здесь пробовал и через onclick на функцию похожую на function LoginUser() - но все равно белый экран выходит.
</div>
</div>
</body>
</html>
Простой
