реклама на сайте
подробности

 
 
> Частичное динамическое обновление веб-страницы
vovanxp
сообщение Jan 28 2015, 21:26
Сообщение #1


Участник
*

Группа: Участник
Сообщений: 20
Регистрация: 28-10-11
Пользователь №: 68 026



Помогите создать реализовать частичное динамическое обновление веб-страницы.

Проект на основе демки STM324xG_EVAL, LwIP_HTTP_Server_Raw, без FreeRTOS

Хочу сделать управление микроконтроллером через веб-страницу. Веб сервер работает,

Хочу сделать так чтоб на веб-страничке выводились информация так же как как выводится на ЛСД дисплей. Информация обновлялась динамически не перегружая страничку, под этим веб-дисплеем на веб-странице будут кнопки управления.

Знаю что нужно через javаscript, jQuery. Можно ли это реализовать без netconn и FreeRTOS и как реализовать.

Спасибо.
Go to the top of the page
 
+Quote Post
 
Start new topic
Ответов
Xenia
сообщение Jan 28 2015, 22:18
Сообщение #2


Гуру
******

Группа: Модератор FTP
Сообщений: 4 479
Регистрация: 20-02-08
Из: Москва
Пользователь №: 35 237



Можно проще - разделить страницу на окна (FRAMES) в каждом окне которой будет свой интернет-контекст (<FRAME SRC=...>).
И во все контексты, которые требуют периодического обновления, поставить тег вроде этого:
<meta http-equiv="refresh" content="60">
который обновляется/перезагружается через каждый 60 сек.

Самая сложная здесь проблема - так поделить страницу на части, чтобы обновляемые числа оказались в отдельном окне(ах).
Но самая простая реализиция - двухфреймовая, где внешний вид табло и шапка заголовка (может быть не только вверху, но и слева) находится в одном фрейме и никогда не обновляется (мегатег refresh у нее отсутствует), а числа находятся в другом фрейме, который периодически обновляется.
Go to the top of the page
 
+Quote Post
vovanxp
сообщение Jan 29 2015, 08:41
Сообщение #3


Участник
*

Группа: Участник
Сообщений: 20
Регистрация: 28-10-11
Пользователь №: 68 026



Цитата(Xenia @ Jan 29 2015, 02:18) *
Можно проще - разделить страницу на окна (FRAMES) в каждом окне которой будет свой интернет-контекст (<FRAME SRC=...>).
И во все контексты, которые требуют периодического обновления, поставить тег вроде этого:
<meta http-equiv="refresh" content="60">
который обновляется/перезагружается через каждый 60 сек.

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


Я понимаю что это наглость, но не могли бы вы заготовку создать, для меня это все очень новое. Пока хочу сделать как можно проще, а потом буду скрипты докручивать. Я понимаю что HTML, JAVASCRIPT... не имеет прямое отношение к ARM, но как я понимаю веб- сервер на stm имеет ограничения, у меня веб-сервер без NETCONN и SOCKETS.







Go to the top of the page
 
+Quote Post
AlexandrY
сообщение Jan 29 2015, 09:11
Сообщение #4


Ally
******

Группа: Модераторы
Сообщений: 6 232
Регистрация: 19-01-05
Пользователь №: 2 050



Цитата(vovanxp @ Jan 29 2015, 10:41) *
Я понимаю что это наглость, но не могли бы вы заготовку создать, для меня это все очень новое. Пока хочу сделать как можно проще, а потом буду скрипты докручивать. Я понимаю что HTML, JAVASCRIPT... не имеет прямое отношение к ARM, но как я понимаю веб- сервер на stm имеет ограничения, у меня веб-сервер без NETCONN и SOCKETS.


Вот пример страницы выводящей непрерывно график нагрузки за последнюю секунду микроконтроллера встроенного WEB сервера:
Код
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript" type="text/javascript" src="FLOT/excanvas.pack.js"></script>
<script language="javascript" type="text/javascript" src="FLOT/jquery.js"></script>
<script language="javascript" type="text/javascript" src="FLOT/jquery.flot.js"></script>
</head>
<body>

<div id="placeholder1" style="margin-left:20px;width:500px;height:150px"></div>

<script type="text/javascript">

var t;

var data_arr1 = [<!-#cpuuse_graph CPUUSE=last_sec>];

var options1 =
{
    legend: { show: false},
    lines: { show: true},
    colors: ["#000066"],
    grid: { color: "#990000"},
    points: { show: true},
    yaxis: { noTicks: 10},
    selection: { mode: "xy"}
};

function timedCount()
{
    t=setTimeout("timedCount()",1000);
    
    $.post('/cpuuse_graph',{CPUUSE:"last_sec"}, refresh_placeholder1);
}

function refresh_placeholder1(data)
{
    eval("data_arr1 = [" + data + "]");
    $.plot($("#placeholder1"), [ data_arr1] , options1);
}

$( timedCount());

</script>
</body>
</html>


Сделано с использованием библиотеки Google jquery
Каждую секунду вызывается функция timedCount которая посылает CGI запрос вида http://{имя вашего сервера}/cpuuse_graph?CPUUSE=last_sec
Сервер должен понимать такой запрос и высылать в ответ массив чисел через запятую.
Go to the top of the page
 
+Quote Post

Сообщений в этой теме
- vovanxp   Частичное динамическое обновление веб-страницы   Jan 28 2015, 21:26
- - scifi   Цитата(vovanxp @ Jan 29 2015, 00:26) Знаю...   Jan 28 2015, 22:03
|- - kolobok0   Цитата(vovanxp @ Jan 29 2015, 11:41) Я по...   Jan 29 2015, 10:17
- - x893   К ARM не имеет отношения. Смотрите на сайтах по ве...   Jan 28 2015, 22:30
|- - Xenia   Цитата(x893 @ Jan 29 2015, 01:30) К ARM н...   Jan 28 2015, 22:34
- - A. Fig Lee   Дело не в арме, то, что человек хочет, сейчас назы...   Jan 29 2015, 02:24
- - uriy   Без jquery это делать не удобно. XMLHttpRequest н...   Jan 29 2015, 05:14
- - uriy   Использование Google jquery требует наличие интерн...   Jan 29 2015, 09:21
|- - AlexandrY   Цитата(uriy @ Jan 29 2015, 11:21) Использ...   Jan 29 2015, 09:56
- - Xenia   Цитата(vovanxp @ Jan 29 2015, 11:41) Я по...   Jan 29 2015, 09:22
- - Mahagam   Xenia, сегодня фреймы считаются дурным тоном, срод...   Jan 29 2015, 09:52
- - vovanxp   Всем большое спасибо, теперь знаю куда двигаться.   Jan 29 2015, 10:57
- - vovanxp   Все получилось, создал простую заготовку, использо...   Feb 5 2015, 12:39
- - vovanxp   Не могу найти решение проблемки. Keil uVision5, в...   Feb 12 2015, 12:16
|- - scifi   Цитата(vovanxp @ Feb 12 2015, 15:16) ...   Feb 12 2015, 12:22
||- - vovanxp   Цитата(scifi @ Feb 12 2015, 16:22) Это на...   Feb 12 2015, 13:45
||- - scifi   Цитата(vovanxp @ Feb 12 2015, 16:45) Так ...   Feb 12 2015, 14:31
|- - kolobok0   Цитата(vovanxp @ Feb 12 2015, 15:16) Не м...   Feb 12 2015, 15:35
|- - vovanxp   Цитата(kolobok0 @ Feb 12 2015, 19:35) раз...   Feb 12 2015, 19:23
- - uriy   У меня тоже бывали проблемы с кодировкой. Перешел ...   Feb 13 2015, 04:55
|- - vovanxp   Цитата(uriy @ Feb 13 2015, 07:55) У меня ...   Feb 13 2015, 05:14
|- - kolobok0   Цитата(vovanxp @ Feb 13 2015, 08:14) Тогд...   Feb 15 2015, 10:22
- - vovanxp   Давайте я лучше всю инфу напишу. keil настройках u...   Feb 17 2015, 08:27
- - kolobok0   Цитата(vovanxp @ Feb 17 2015, 11:27) Дава...   Feb 17 2015, 20:29
- - scifi   Цитата(kolobok0 @ Feb 17 2015, 23:29) Есл...   Feb 18 2015, 06:47
- - kolobok0   ОФФ/2: Цитата(scifi @ Feb 18 2015, 09:47...   Feb 19 2015, 00:13
- - scifi   Цитата(kolobok0 @ Feb 19 2015, 03:13) Не ...   Feb 19 2015, 07:27


Reply to this topicStart new topic
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0

 


RSS Текстовая версия Сейчас: 30th July 2025 - 10:12
Рейтинг@Mail.ru


Страница сгенерированна за 0.01428 секунд с 7
ELECTRONIX ©2004-2016