Phoebus Web Browser widget - not loading web pages with websocket connection

ControlSystemStudio / phoebus

A framework and set of tools to monitor and operate large scale control systems, such as the ones in the accelerator community.

Eclipse Public License 1.0

90 stars 90 forks source link

Hi,

I'm having trouble rendering a webpage with websockets in Phoebus Web Browser Widget.

Running Phoebus on Windows, master at 2022-05-10 17:51, OpenJDK 18.0.1.1+2-6.

I tried the following simple Node.js server with html:

Client

<!doctype html>
<html>
<head></head>
<body>
    <p>Hello</p>
</body>
</html>

Node.js server

var http = require('http'),
    fs = require('fs'),
    index = fs.readFileSync(__dirname + '/index.html');

// Send index.html to all requests
var app = http.createServer(function (req, res) {
    console.log('http request')
    res.writeHead(200, { 'Content-Type': 'text/html' });
    res.end(index);
});

app.listen(3000);

This works fine in Chrome/Firefox and Phoebus Web Browser widget.

If I now update server to

var http = require('http'),
    fs = require('fs'),
    index = fs.readFileSync(__dirname + '/index.html');

// Send index.html to all requests
var app = http.createServer(function (req, res) {
    console.log('http request')
    res.writeHead(200, { 'Content-Type': 'text/html' });
    res.end(index);
});

// Socket.io server listens to our app
var io = require('socket.io')(app);

// Emit welcome message on connection
io.on('connection', function (socket) {
    console.log('Client connected', socket.id);
});

app.listen(3000);

This works fine in Chrome/Firefox but doesn't render in Phoebus Web Browser widget. Console print of 'http request' doesn't print anything when rendering in Phoebus Web Browser.

Any help/input would be appreciated.

When I try the "Web Browser" page from the display builder examples, that works OK with the default web page from https://controlsystemstudio.org/, or https://status.sns.ornl.gov. As for web sockets, it also runs the examples from the display builder web runtime (see https://github.com/ornl-epics/dbwr on how to build/install/run that) or the Web EDM app (https://github.com/JeffersonLab/wedm)

This suggests that the phoebus web browser widget, which is basically just the JavaFX Web View https://openjfx.io/javadoc/18/javafx.web/javafx/scene/web/WebView.html, can fundamentally display plain web pages as well as web sites that run javascript to display data fetched via web sockets.

I'm not sure what the problem is with your self-written node.js-based web server, but for starters I assume when you write "Client" you mean "static web page to be served", the one you read into the server via readFileSync(__dirname + '/index.html');? The "Client" would be Chrome, Firefox, curl, lynx, ... reading from something like http://localhost:3000, right?

In any case, you might have to ask in node.js forums, or contact the Java FX webview developers, see https://openjfx.io/

ControlSystemStudio / phoebus

Phoebus Web Browser widget - not loading web pages with websocket connection #2312