shantanoo-desai · June 2, 2022 15:08
diff --git a/manifest.json b/manifest.json
 {
    "version": 0,
    "tools": {
        "opcuaPF": {
            "label": "OPC-UA Port Forwarding",
            "path": "opcuaPF.html"
        }
    }
 }
diff --git a/opcuaPF.html b/opcuaPF.html
 <!DOCTYPE html>
 <html>
 <head>
    <title>OPC-UA Port Forwarding</title>
    <meta charset="utf-8">
    <link href="../base1/cockpit.css" type="text/css" rel="stylesheet">
    <script src="../base1/cockpit.js"></script>
 </head>
 <body>
    <div class="container-fluid">
        <h2>OPC-UA Server Port Forwarding</h2>
        <p>
          Create a Secure Shell (SSH) Tunnel to forward information from an OPC-UA Server running on <b>PACs Controller</b> to port number: <b>48400</b>
        </p>
        <p>
          Once the Tunnel is created, the data can be accessed via the IP-Address of the Machine and port 48400 i.e., <b>IP-Address:48400</b>.
        </p>
        <p>
          <b>NOTE</b>: Admin Privileges are required to run create the SSH Tunnel.
        </p>

        <table class="form-table-ct">
            <tr>
                <td><label class="control-label" for="opcua-server">OPC-UA Server</label></td>
                <td><input class="form-control" id="opcua-server" value="192.168.180.2"></td>
            </tr>
            <tr>
                <td><label class="control-label" for="opcua-port">OPC-UA Port</label></td>
                <td><input class="form-control" id="opcua-port"value="8480"></td>
            </tr>
            <tr>
                <td><label class="control-label" for="timeout">Login Timeout (in seconds)</label></td>
                <td><input class="form-control" id="timeout" value="60"></td>
            </tr>
            <tr>
                <td><label class="control-label" for="password">Linux Admin Password</label></td>
                <td><input class="form-control" id="password" type="password" name="password" required></td>
            </tr>
            <tr>
                <td><button class="pf-c-button pf-m-primary" id="createTunnel" type="button">Create Tunnel</button></td>
                <td><button class="pf-c-button pf-m-danger" id="closeTunnel" type="button">Close Tunnel</button></td>
            <tr>
            <tr>
                <td>Tunnel Status:<span id="result"></span></td>
            </tr>
        </table>
        <pre id="output"></pre>
    </div>
    <script src="opcuaPF.js"></script>
 </body>
 </html>
diff --git a/opcuaPF.js b/opcuaPF.js
 // Get HTML UI Elements
 const opcuaServer = document.getElementById("opcua-server");
 const opcuaPort = document.getElementById("opcua-port");
 const timeout = document.getElementById("timeout");
 const adminPassword = document.getElementById("password");
 const btnCreateTunnel = document.getElementById("createTunnel");
 const btnCloseTunnel = document.getElementById("closeTunnel");
 const result = document.getElementById("result");
 const output = document.getElementById("output");

 // Global Tunnel Spawning Promise
 var tunnelProcess;

 function createTunnel() {
    // SSH Local Port-Forwarding String should look like: 48400:<opcUAServerAddress>:<opcUAPort>
    let sshTunnelString = "48400:" + opcuaServer.value + ":" + opcuaPort.value;
    // Tunnel Creation: `sshpass -p <AdminPassword> ssh -g -L 48400:<opcUAServerAddress>:<opcUAPort> admin@localhost sleep <timeout>`

    // Spawn the Tunnel as a process
    // Debug: ps -ax
    tunnelProcess = cockpit.spawn(
                ['sshpass', '-p', adminPassword.value, 'ssh', '-g', '-L', sshTunnelString, 'admin@localhost', 'sleep', timeout.value],
                {"err": "message"});
    tunnelProcess
                .stream(tunnel_stream)
                .then(tunnel_success)
                .catch(tunnel_fail);

    console.log(typeof(tunnelProcess));
    if (tunnelProcess != null) {
        result.style.color = "green";
        result.innerHTML = "Tunnel Created";
    }
 }

 function tunnel_success() {
    console.log("tunnel sucessful");
 }

 function tunnel_stream(data) {
    output.append(document.createTextNode(data));
 }

 function tunnel_fail(err) {
    console.log(err.message);
    result.style.color = "red";
    result.innerHTML = "Tunnel Closed";
 }

 function closeTunnel() {
    console.log("closing tunnel from Manual Button Trigger");
    tunnelProcess.close("Tunnel Terminated");
 }

 btnCreateTunnel.addEventListener("click", createTunnel);
 btnCloseTunnel.addEventListener("click", closeTunnel);

 cockpit.transport.wait(function() {});
	{
	"version": 0,
	"tools": {
	"opcuaPF": {
	"label": "OPC-UA Port Forwarding",
	"path": "opcuaPF.html"
	}
	}
	}
	<!DOCTYPE html>
	<html>
	<head>
	<title>OPC-UA Port Forwarding</title>
	<meta charset="utf-8">
	<link href="../base1/cockpit.css" type="text/css" rel="stylesheet">
	<script src="../base1/cockpit.js"></script>
	</head>
	<body>
	<div class="container-fluid">
	<h2>OPC-UA Server Port Forwarding</h2>
	<p>
	Create a Secure Shell (SSH) Tunnel to forward information from an OPC-UA Server running on <b>PACs Controller</b> to port number: <b>48400</b>
	</p>
	<p>
	Once the Tunnel is created, the data can be accessed via the IP-Address of the Machine and port 48400 i.e., <b>IP-Address:48400</b>.
	</p>
	<p>
	<b>NOTE</b>: Admin Privileges are required to run create the SSH Tunnel.
	</p>

	<table class="form-table-ct">
	<tr>
	<td><label class="control-label" for="opcua-server">OPC-UA Server</label></td>
	<td><input class="form-control" id="opcua-server" value="192.168.180.2"></td>
	</tr>
	<tr>
	<td><label class="control-label" for="opcua-port">OPC-UA Port</label></td>
	<td><input class="form-control" id="opcua-port"value="8480"></td>
	</tr>
	<tr>
	<td><label class="control-label" for="timeout">Login Timeout (in seconds)</label></td>
	<td><input class="form-control" id="timeout" value="60"></td>
	</tr>
	<tr>
	<td><label class="control-label" for="password">Linux Admin Password</label></td>
	<td><input class="form-control" id="password" type="password" name="password" required></td>
	</tr>
	<tr>
	<td><button class="pf-c-button pf-m-primary" id="createTunnel" type="button">Create Tunnel</button></td>
	<td><button class="pf-c-button pf-m-danger" id="closeTunnel" type="button">Close Tunnel</button></td>
	<tr>
	<tr>
	<td>Tunnel Status:<span id="result"></span></td>
	</tr>
	</table>
	<pre id="output"></pre>
	</div>
	<script src="opcuaPF.js"></script>
	</body>
	</html>
	// Get HTML UI Elements
	const opcuaServer = document.getElementById("opcua-server");
	const opcuaPort = document.getElementById("opcua-port");
	const timeout = document.getElementById("timeout");
	const adminPassword = document.getElementById("password");
	const btnCreateTunnel = document.getElementById("createTunnel");
	const btnCloseTunnel = document.getElementById("closeTunnel");
	const result = document.getElementById("result");
	const output = document.getElementById("output");

	// Global Tunnel Spawning Promise
	var tunnelProcess;

	function createTunnel() {
	// SSH Local Port-Forwarding String should look like: 48400:<opcUAServerAddress>:<opcUAPort>
	let sshTunnelString = "48400:" + opcuaServer.value + ":" + opcuaPort.value;
	// Tunnel Creation: `sshpass -p <AdminPassword> ssh -g -L 48400:<opcUAServerAddress>:<opcUAPort> admin@localhost sleep <timeout>`

	// Spawn the Tunnel as a process
	// Debug: ps -ax
	tunnelProcess = cockpit.spawn(
	['sshpass', '-p', adminPassword.value, 'ssh', '-g', '-L', sshTunnelString, 'admin@localhost', 'sleep', timeout.value],
	{"err": "message"});
	tunnelProcess
	.stream(tunnel_stream)
	.then(tunnel_success)
	.catch(tunnel_fail);

	console.log(typeof(tunnelProcess));
	if (tunnelProcess != null) {
	result.style.color = "green";
	result.innerHTML = "Tunnel Created";
	}
	}

	function tunnel_success() {
	console.log("tunnel sucessful");
	}

	function tunnel_stream(data) {
	output.append(document.createTextNode(data));
	}

	function tunnel_fail(err) {
	console.log(err.message);
	result.style.color = "red";
	result.innerHTML = "Tunnel Closed";
	}

	function closeTunnel() {
	console.log("closing tunnel from Manual Button Trigger");
	tunnelProcess.close("Tunnel Terminated");
	}

	btnCreateTunnel.addEventListener("click", createTunnel);
	btnCloseTunnel.addEventListener("click", closeTunnel);

	cockpit.transport.wait(function() {});