Seek Open Source Web Design Software for Serial Controlled Systems

[fsonnichsen]

TL;DR Summary

Seeking Open Source Web Page for Control Programs

I am hoping this forum may be a good page for this question. Not sure where else to post.

I have been asked if I can write a user GUI to control a system that we build--the system is made with the fairly common electronics board designs and PIC MPs and presently is controlled from a telnet command line using serial commands. The user would like to have the system controllable via something Open Source from Windows, Linux, Apple and IPads. I assume the easiest approach would be to use a webpage to front end the serial or USB port commands.

I am totally out of my element with webpages and browsers (last did HTML 1.0 code!) and I assume a lot of newer facilities are out there. Hopefully I am asking the right questions. Any ideas here?

Thanks
Fritz

 

[jedishrfu]

I would start with python and the Flask package. It allows you to make a simple web server that can interface your hardware api asuming you have a means to control your homework by sw calls with a web page.

 

[pbuk]

Telnet? In 2021? Wow

I have been asked if I can write a user GUI to control a system that we build

I'm a bit confused by this, perhaps there is a language barrier:

• is this a one-off system that you have built for use in the organisation you work for, or
• is this a system that you build more than one of and sell or otherwise provide to other organisations?

You see writing a web interface is one thing, deploying and maintaining it is another.

Flask is fine for your back-end server, for the front-end you are going to want to build a single page application using a modern HTML/CSS framework like Bootstrap, and unless the requirement is really simple I would recommend a modern JavaScript framework like Vue.js.

When it comes to deployment to the internet you will need to talk to your IT department about running a proxy from their public-facing server to your local machine, which will need to run something like Gunicorn to talk to it.

The biggest issue you are going to need to tackle is access management: if you can access the system from any PC or phone, how are you going to make sure only the right people get in? Again your IT department may be able to help here by integrating it with an existing intranet.

 

[fsonnichsen]

Thank you for the replies. A look at the Flask software shows it to have a high deployment rate so it would make sense for me to look at that.
To avoid confusion I can describe a little more. This will run on a standalone system-no internet connections.
The very small body of scientists using it will attach with their device (probably a dedicated one) and simply use it to press some on/off buttons and similar simple functions.
This is a very small part of our work and the command line has worked fine in fact but I was asked if I could part from my laboratory for a bit and look at making a GUI for it.
I don't foresee constant changes or maintenance (which is why serial/command lines work so well in the lab).
I understand the complications of writing both a back-end and front-end and have relayed this information to my partners. I wrote some javascript pages back in the 90s and I am sure it has changed but probably can find someone to do it.
HTML works here too-I engage a computer person on a much more complex system of mine and he wrote the whole thing in HTML--apparently the latter does not change very quickly and this has functioned well for years.
No deployment-no IT departments!

Thanks all
Fritz

 

[PeterDonis]

I assume the easiest approach would be to use a webpage to front end the serial or USB port commands.

I'm not so sure. Unless you can find a way to have your browser directly open a telnet connection to the device (which I don't think any browser supports), you are going to need a server in between, which is just another component that can go wrong.

Python supports a number of GUI frameworks directly: I have had good luck with Qt and PySide:

https://pypi.org/project/PySide2/

In fact, a number of years ago I used Python with Qt/PySide to write a GUI that interfaced directly with a robot over telnet. I also used the PySerial package to handle the serial connection:

https://pypi.org/project/pyserial/

The nice thing about doing it this way is that you can go right to the lowest level, directly opening serial connections and controlling exactly what bytes get sent and seeing exactly what bytes get received, with no frameworks or other layers in between. For your use case I suspect that will be an advantage.

 

[jedishrfu]

Theres also ZMQ where you use a messaging protocol and client server arcitecture.

ZMQ has examples of various messaging architectures to choose like one to one or one to many.

Also ZMQ can work with different programming languages and is good in microservice type applications.

Personally though, I think the Flask approach is the most straightforward from what's been described.

 

[PeterDonis]

Theres also ZMQ where you use a messaging protocol and client server arcitecture.

AFAIK ZMQ doesn't speak telnet over serial connections. It expects an underlying Ethernet-based network infrastructure.

 

[jedishrfu]

I assumed that the connection was on an internal network where ZMQ might work. It hadn’t crossed my mind that they might want to expose the device on the open internet.

 

[PeterDonis]

I assumed that the connection was on an internal network where ZMQ might work.

It's not a question of the network being internal or not. A device that only speaks telnet over a serial connection is not even on a network to begin with. It's a totally different kind of connection. Systems like ZMQ don't even understand this type of connection at all.

You could, of course, put a server in between, to translate between the telnet/serial connection and ZMQ, but that has the same drawback as putting a web server in between: as I said in post #5, it's just another component that can go wrong.

 

[jedishrfu]

My assumption here was that the device was connected to a controlling computer via usb or serial port and that you could host a web server python flask application on the controlling computer. Other computers using web browsers can access the device by connecting to the controlling computer.

Alternatively, you could host a ZMQ server application on the controlling computer and access the device via remote ZMQ client applications. The advantage here is that the ZMQ client applications can have a full fledged GUI.

 

[PeterDonis]

My assumption here was that the device was connected to a controlling computer via usb or serial port and that you could host a web server python flask application on the controlling computer.

Here is the description of the configuration from post #4:

This will run on a standalone system-no internet connections.
The very small body of scientists using it will attach with their device (probably a dedicated one) and simply use it to press some on/off buttons and similar simple functions.

This doesn't look to me like whatever computer has the USB/serial connection will be visible over a network. But I think we need more clarification about exactly what kind of setup it is.

 

[jedishrfu]

I appreciate your attempts at clarification and I understand what was described as I’ve worked in that kind of isolated environment doing tool controllers some with simple messaging and some with a web interface.

Knowing that the full environment is seldom described well by folks, I put out my ideas in the hope that the OP might find something useful in them.

My apologies if this is detracting from the discussion. No further comment is needed.