Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 13.01.2022, 13:45
Интересующийся
Отправить личное сообщение для wolfio Посмотреть профиль Найти все сообщения от wolfio
 
Регистрация: 10.02.2018
Сообщений: 21

тривиальный вопрос: html + js
Здравствуйте.
не работаю с js, поэтому прошу помощи.

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

я пытаюсь собрать простую агреггированную страницу со всеми диаг-страницами всех серверов кластера.

для этого нарисовал простенькую страницу, которая через iframe опрашивает каждый сервер.
однако, захотелось усложнить страницу, и сделать не просто колонку со всей инфой из результата страницы диагностики, а вырезать оттуда что-то через split + substr.

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

<html class="DiagPage">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		</head>
		<body >

			<script type = "text/javascript">

			function getSubColumn(columnIndex){
				var subColumn = document.getElementById('sp').innerHTML.split(';')[columnIndex];
				return subColumn;
			}
			</script>
Тест
			<table style="text-align: left; width: 1100px;" border="1" cellpadding="0" cellspacing="0" bgcolor="#cccccc" leftmargin="50" topmargin="0">
				<tbody>
					<tr align="center">
						<td nowrap height=18 width=100>Имя схемы</td>
						<td>Диагностическая информация</td>
					</tr>
					<tr>
						<td nowrap height=18 width=100 align="center" >aaa</td>
						<td>
							<iframe id = "sp" frameborder = "false" src="https://myserver:8443/diag" height=18 width=1750/>
						</td>
					</tr>
					<tr>
						<td nowrap height=18 width=100 align="center" >bbb</td>
						<td>
							<iframe id = "sp" frameborder = "false" src="https://myserver:8445/diag" height=18 width=1750/>
						</td>
					</tr>
				</tbody>
			</table>
		</body>
	</html>


upd#1

по ссылкам https://myserver:8445/diag возвращается простой html, тело которого выглядит как текстовая строка типа:
status: valid; run: 13.01.2022 12:00:00; ...

Последний раз редактировалось wolfio, 13.01.2022 в 13:48.
Ответить с цитированием
  #2 (permalink)  
Старый 13.01.2022, 14:00
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 31,789

wolfio,
на всякий случай https://learn.javascript.ru/fetch
Ответить с цитированием
  #3 (permalink)  
Старый 13.01.2022, 14:11
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,103

Всё не так просто, друже.)
Обращение по разным портам даже одного домена считается разными origin, а обращение к разным origin из javascript запрещено в целях безопасности. Разрешить это можно на каждом сервер добавив header Access-Control-Allow-Origin, однако с доступом к содержимому iframe это не поможет всё равно.
Можно и это решить, нагородив общение с iframe посредством postMessage, что потребует доработки с обоих сторон, либо воспользовавшись, как предложили выше, fetch и работая сразу со строками без фреймов.

Я для похожих задач давным давно не имея доступа к серверам просто использовал пользовательский скрипт через temprmonkey который для каждого домена проводил заранее нужные манипуляции, а верхняя страничка просто подключала их во фрейме как обычно.)
__________________
29375, 35
Ответить с цитированием
  #4 (permalink)  
Старый 13.01.2022, 14:42
Интересующийся
Отправить личное сообщение для wolfio Посмотреть профиль Найти все сообщения от wolfio
 
Регистрация: 10.02.2018
Сообщений: 21

вы можете показать как в ячейку таблицы вставить результат респонса из фетча?
я подзастрял в экспериментах. с селекторами в js все как-то путано. функцию прямо из ячейки колонки вызывать можно?
Ответить с цитированием
  #5 (permalink)  
Старый 13.01.2022, 14:48
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,103

<table id="table" ...
fetch('https://myserver:8443/diag')
  .then(body => body.text())
  .then(text => text.split(';'))
  .then(array => table.rows[0].cells[0].innerHTML = array.join('<br>'));
__________________
29375, 35
Ответить с цитированием
  #6 (permalink)  
Старый 13.01.2022, 14:56
Интересующийся
Отправить личное сообщение для wolfio Посмотреть профиль Найти все сообщения от wolfio
 
Регистрация: 10.02.2018
Сообщений: 21

Пардон, но кажется я недопонимаю вашего ответа.

Результат так должен выглядеть?

<html class="DiagPage">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		</head>
		<body >

			<script type = "text/javascript">
				function getSSData(URL){
					return fetch(URL).then(body => body.text()).then(text => text.split(';')).then(array => table.rows[0].cells[0].innerHTML = array.join('<br>'));
				}
			</script>
Тест
			<table style="text-align: left; width: 1100px;" border="1" cellpadding="0" cellspacing="0" bgcolor="#cccccc" leftmargin="50" topmargin="0">
				<tbody>
					<tr align="center">
						<td nowrap height=18 width=100>Имя схемы</td>
						<td>Диагностическая информация</td>
					</tr>
					<tr>
						<td nowrap height=18 width=100 align="center" >aaa</td>
						<td>
							<iframe id = "sp" frameborder = "false" src="https://myserver:8443/diag" height=18 width=1750/>
						</td>
					</tr>
					<tr>
						<td nowrap height=18 width=100 align="center" >bbb</td>
						<td>
							getSSData('https://myserver:8443/diag');
						</td>
					</tr>
				</tbody>
			</table>
		</body>
	</html>
Ответить с цитированием
  #7 (permalink)  
Старый 13.01.2022, 15:26
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,103

Нет, скрипт отдельно, разметка отдельно.

Но если так уж хочется, то условно так:
<html class="DiagPage">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
Тест
<table style="text-align: left; width: 1100px;" border="1" cellpadding="0" cellspacing="0" bgcolor="#cccccc" leftmargin="50" topmargin="0">
  <tbody>
  <tr align="center">
    <td nowrap height=18 width=100>Имя схемы</td>
    <td>Диагностическая информация</td>
  </tr>
  <tr>
    <td nowrap height=18 width=100 align="center" >aaa</td>
    <td data-href="https://myserver:8443/diag">&nbsp;</td>
  </tr>
  <tr>
    <td nowrap height=18 width=100 align="center" >bbb</td>
    <td data-href="https://myserver:8444/diag">&nbsp;</td>
  </tr>
  </tbody>
</table>
<script type = "text/javascript">
function getText(url) {
  return fetch(url).then(body => body.text())
}

document.querySelectorAll('td[data-href]').forEach(td => {
  getText(td.getAttribute('data-href')).then(text => {
    const html = text.split(';').join('<br>');
    td.innerHTML = html;
  });
})
</script>
</body>
</html>
__________________
29375, 35

Последний раз редактировалось Aetae, 13.01.2022 в 15:31.
Ответить с цитированием
  #8 (permalink)  
Старый 13.01.2022, 16:03
Интересующийся
Отправить личное сообщение для wolfio Посмотреть профиль Найти все сообщения от wolfio
 
Регистрация: 10.02.2018
Сообщений: 21

ошибка если как есть.



мне кажется мы ушли в космос)
а нельзя вернуться к iframe и сабстром вытащить инфу из его значения просто? если честно, я не вижу разницы между iframe и fetch, разве что новые более неизвестные ошибки появились
Ответить с цитированием
  #9 (permalink)  
Старый 13.01.2022, 16:13
Интересующийся
Отправить личное сообщение для wolfio Посмотреть профиль Найти все сообщения от wolfio
 
Регистрация: 10.02.2018
Сообщений: 21

ошибка осталась.



мне кажется мы ушли в космос)
а нельзя вернуться к iframe и сабстром вытащить инфу из его значения просто? если честно, я не вижу разницы между iframe и fetch, разве что новые более неизвестные ошибки появились

Последний раз редактировалось wolfio, 13.01.2022 в 16:20.
Ответить с цитированием
  #10 (permalink)  
Старый 13.01.2022, 16:15
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 1,673

Нельзя ничего из iframe вытащить, если он загружен с другого домена (не с того, с которого сама страница пришла)
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Вставка значения из JS в html форму oopros Общие вопросы Javascript 2 29.09.2016 13:23
Можно ли заккоментировать HTML и CSS с помощью JS? AlexKain Элементы интерфейса 6 10.06.2016 16:53
добавление html в js soltx Элементы интерфейса 6 10.03.2015 21:50
Сохранение данных html, сконфигурированных JS. wayzer Общие вопросы Javascript 1 28.08.2012 19:38
Вывод кусков HTML кода с одного файла JS wlad2 Общие вопросы Javascript 16 04.01.2011 10:52