I receive continuously data by uart sérial port.
How can i print this data on my html web site and update it dynamically ?
I use a raspberry pi 3 with apache server.
I can use php, javascript, python... and many languages.
You could create a NodeJS server, with express for example.
Then use the serialport npm module to get data from your serial port.
Then send this data through a websocket, create a web page, and use the Websocket Javascript API to retrieve the data from your websocket.
This way, you can display real-time data from serial port on your website. I've used this 'stack' to build a connected aquaponics system in a Hackathon and it worked well !
It would even be simplier if you use socket.io, since it provides simple library and code example for both the back-end and the front-end part.
Hope it helps,
Best regards
Related
I am trying to connect a sensor to an AWS MQTT Broker to a database that will send it to a webserver so that it can be easily accessible. Right now the only way people in our lab can have access to our sensor data is through contacting me directly and having me connect to the Node Red dashboard. Would there be any way for everyone to have access to the data via WebSocket, or at least a couple of people?
I've searched for hours on end and have had no success regarding the ease of accessibility.
From what I've researched there is this a java based client called MQTT.Cool that can connect multiple brokers and have data published via WebSocket using JavaScript. However there is literally no data available except the ones provided by the company. So combining it it with my project has not been an easy task.
Also, I've thought about allowing my node red dashboard to be accessed out of my local
ip-address, but due to security reasons it has been recommended not to be done.
AWS IoT provides an SDK that you can use in your browser:
https://github.com/aws/aws-iot-device-sdk-js#browser
You can write a web application and view the contents returned by the database after logging in
If you need to browse in real-time, you can use mqtt.js to subscribe to some topics：
https://www.emqx.com/en/blog/connect-to-mqtt-broker-with-websocket
Or use MQTTX, a client tool, to connect directly to the MQTT broker and subscribe to topic
We have two applications, one called flexOS locally on "the server", and one called flexVisu remote on "the client". The first one is doing the job, collection data and such things.
Historically those two applications are able to communicate via TCP/IP sockets and a proprietary binary protocol.
Now we want to replace the client application flexVisu with a web page hosted on the IIS locally on the server. Every web browser on every device should be able to display these web page(s).
Firstly we experimented with an additional application (flexVisuWebServer) on the IIS side that basically hosted a web socket server and translated the json data from the client into binary data for the server and vice versa.
But this always requires a http connection and a wss connection to be open at the same time.
I don't know why, but I don't like the idea of using javascript on the client to handle all the data processing to display the server data.
I think that it would be much easier if I wrote an asp.Net c# application that handles the connection to "the server" via our proprietary TCP/IP protocol. That way no conversion of data between binary and json format must be done, and the web page itself can be also written in C#.
This approach much more resembles the current approach with flexVisu connecting directly to flexOS, the binary data is directly used to fill in Windows Forms controls.
What am I missing here?
Would the asp.Net application be able to connect to a tcp socket and use our own protocol?
[Edit: 2021-02-09 at 16:18 localtime]:
I managed to use our proprietary TCP/IP protocol to connect from the web server to the flexOS in the page_load of the asp.net web page.
So basically it should not be a problem to use the underlying library to read data directly from the flexOS.
OT: Should i post subsequent ASP.Net questions here too, or open some more questions?
We decided to follow this concept:
the webpage is using a websocket connection to our application flexVisuWebServer and this application uses our propietary TCP/IP protocoll to talk with flexOS.
I have a local site like no server no nothing just the html, css, javascript files and i need to send data from an app in my phone created with android studio and display it on the site.I read that you can have a webserver and send data with the android/java tcp client to it but i cant find how to do it.So how can i approach this?
This is possible using server-side programming languages.
You can receive data using Api and display it on your web pages after saving it in the database.
To start, I suggest learning Php - Mysql , it's easier to understand and easier to implement
you can send data from your android mobile to the server by using API such as REST and SOAP but you have to any of the server-side scripting languages like node PHP etc.. Please refer the tutorial point to get better ideas
https://www.tutorialspoint.com/android/android_php_mysql.htm
I am making a web-app using JavaScript. I plan to use Node.js to connect the app to an existing MySQL database.
First of all, will the Node code be written in the same .js file as my application? Or is it a separate file?
I need the data to be current at all times (even if you were to close the browser and re-open it, AND even in the event of the user not having a wifi connection), so my thought was to constantly update the local device's db and then to intermittently update the MySQL db. Is this the best strategy? If so, how exactly can Node talk to the offline db and MySQL?
First of all, will the Node code be written in the same .js file as my application? Or is it a separate file?
It is possible to keep your client side JavaScript in the same file as your server side JavaScript, but it doesn't make any sense to do so. They are separate programs. (Library files, on the other hand, are a different story).
so my thought was to constantly update the local device's db and then to intermittently update the MySQL db.
Working with a local database and syncing to a shared one is a common strategy. You do need to handle conflicting updates in a way that is sensible for your purposes though.
If so, how exactly can Node talk to the offline db and MySQL?
Node.js can't talk to the offline database, at least not directly.
You will have a web application running in the browser. It will use client side JavaScript with a client side database and some means of communicating with the server (often this is done by sending JSON over HTTP to and from a web service).
Then you will have a server side application running in Node.js. It will use server side JavaScript with a server side MySQL database and some means of communicating with the client (i.e. an HTTP server hosting a web service).
I connected an Arduino to my laptop using USB, and I can read the serial data using Processing.
Is there any way to get this data in real time into a local webbrowser? For example, a text field that shows the value from the serial port? It does not have to be connected to the internet.
The JavaScript version of Processing does not support the following code, which would have been the ideal solution.
The Processing code is:
myPort = new Serial(this, Serial.list()[0], 9600);
// read a byte from the serial port
int inByte = myPort.read();
// print it
println(inByte);
// now send this value somewhere...?
// ehm...
There is no way to directly access the local machine from the web browser. For security reasons browsers have very limited access to the machines resources.
To do this one option would be to write an extension for the browser of your choosing. Even though extensions also have a variety of limitations.
Option two would be to use local server to provide the functionality you need. Personally I recommend using node.js (it's light weight, fast and easy to implement). You can read/write serial data using https://github.com/rwaldron/johnny-five (as #kmas suggested) or https://github.com/voodootikigod/node-serialport and than you can use http://socket.io/ to create a simple service and connect to it though the browser. Socket.io uses WebSockets in modern browsers and works excepionally well for real-time connections.
I had a similar problem to solve. My Data acquisition system (DAQ) (like your arduino) relays data in HTTP, TCP, FTP, as well as serial. I had to capture it on the server and then send it to my webpage in real-time.
The hack I wrote uses nodejs at the server, and connects DAQ to the server using TCP sockets using the "net" module of nodejs and connects the server to the HTML page using socket.io.
The code and context can be found in "How to get sensor data over TCP/IP in nodejs?".
I use TCP as I wanted to transmit data over a long distance. You need to modify the socket protocol to serial.
For serial-to-TCP redirection, you may use bloom from sensorMonkey for Windows or their processing sketch for *nix/Mac OS.
if you want to send or receive serial data from Arduino to JavaScript in Processing code editor just go to Sketch -> Import Library -> Serial or just write import processing.serial.*;