Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Передача приём и отображение UDP данных (https://javascript.ru/forum/dom-window/75785-peredacha-prijom-i-otobrazhenie-udp-dannykh.html)

brp80000 06.11.2018 06:24

Передача приём и отображение UDP данных
 
Возможна ли организация такой схемы. Есть сервер и клиент по wifi. Сервер выдает html страницу с JS а затем передает UDP пакеты с информацией (например скорость, температура).
Клиент принимает страницу, а затем слушает UDP пакеты и автоматически перерисовывает страницу (в виде цифры или в идеале стрелки, шкалы).

Malleys 06.11.2018 08:23

WebSocket основан на TCP. Обратите внимание, что в случае WebSocket взаимодействие между клиентом и сервером начинается с запроса HTTP. Таким образом, вы не можете создать обычное TCP-соединение в Javascript.

WebRTC основан на UDP, он может охватывать ваш вариант использования (html5rocks.com/en/tutorials/webrtc/basics/)

Хотя WebSocket вам больше бы подошёл, думаю.

SuperZen 06.11.2018 12:18

я уже сделал два похожих проекта (зонды где-то по РФ летают, засылают пакеты...) C#
client - WPF - MVVM
server - WebSocket server, который крутится в сервисе... пакеты приходят на COM порт, клеим+парсим, засылаем по WS

второй на nodejs
server: express + sequelize + socket.io
client: reactjs + socket.io + electron

сейчас будем делать третий проект на втором стэке + ReactNative
второму стэку я больше рад, )

brp80000 06.11.2018 15:27

То есть c TCP можно организовать запросы от клиента из JS к серверу получение ответа и отображение. А что если пакет потеряется начнутся тормоза?

SuperZen 06.11.2018 15:43

Сервер на чем?

вот пример для nodejs

1 создадим папку
2 выполним yarn add ws
3 создадим файл wss.js c содержимым
const WebSocket = require('ws');

const wss = new WebSocket.Server({ port: 8080 });

wss.on('connection', function connection(ws) {
  ws.on('message', function incoming(message) {
    console.log('received: %s', message);
  });

  ws.send('something');
});

4 запустим WebSocket сервер: node wss.js
5 сделаем клиент на javascript
<script>
  let ws = new WebSocket(`ws://localhost:8080`);
  ws.onerror = () => console.log('WebSocket error');
  ws.onopen = () => console.log('WebSocket connection established');
  ws.onclose = () => console.log('WebSocket connection closed');
  ws.onmessage = (message) => console.log('onmessage: ', message, message.data)
  ws.onopen = () => {
    ws.send('message', 'message via emit')
  }
</script>


6 все

Или например для пыха, можно взять что-то типа Ratchet (http://socketo.me/)

<?php
    namespace App;
    use Ratchet\Server\IoServer;
    use Ratchet\Http\HttpServer;
    use Ratchet\WebSocket\WsServer;
    require_once './SocketController.php';
    require  __DIR__ . '/vendor/autoload.php';
    // configurations
    $server = IoServer::factory(
        new HttpServer(
            new WsServer(
                new SocketController()
            )
        ),
        8080 // the port of the web socket
    );
    $server->run();


Написать свой SocketController который будет обрабатывать теже message, error и т.д.

brp80000 08.11.2018 00:26

Цитата:

Сообщение от SuperZen (Сообщение 497995)
Сервер на чем?

я использую вот эти исходники для организации сервера
https://github.com/igrr/esp32-http-server

толку от этой информации, вероятно, не много

MallSerg 08.11.2018 09:52

У ТСа копеечный микроконтроллер с вайфай и вшитым в прошивку веб сервером. ТС ищет проблемы там где их нет HTTP хватит для его задачи с головой. Я даже придумать не могу случая когда транспортный протокол станет узким местом в такой задаче.

brp80000 08.11.2018 22:54

Ну и как действовать?

brp80000 09.11.2018 07:14

Есть какой то пример скрипта стрелки или шкалы, которая будет обновляться при получении новых данных?

Malleys 09.11.2018 10:58

codepen.io/search/pens?q=meter пример скрипта стрелки или шкалы

MallSerg 09.11.2018 16:10

Цитата:

Сообщение от brp80000
Есть какой то пример скрипта стрелки или шкалы, которая будет обновляться при получении новых данных?

Что то мне подсказывает что использование веб сервера не основная твоя задача.
Пример без веб сервера http://docs.blynk.cc/#getting-started
В плей маркете целая куча приложений для управления и датчиков.
Если хочешь веб сервер просто придумай АПИ с помощью которого веб страница сможет запрашивать данные с устройства. простой AJAX без проблем справится с передачей информации.


Часовой пояс GMT +3, время: 22:08.