commit
097a0e495c
File diff suppressed because one or more lines are too long
@ -1,154 +1,154 @@
|
|||||||
// import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
|
|
||||||
// import RFB from '@novnc/novnc/lib/rfb.js';
|
import RFB from '@novnc/novnc/lib/rfb.js';
|
||||||
|
|
||||||
// const $ = window.$;
|
const $ = window.$;
|
||||||
// // const showIframeContent = window.location.search.indexOf('vnc=1') != -1;
|
// const showIframeContent = window.location.search.indexOf('vnc=1') != -1;
|
||||||
// class VNCDisplay extends Component {
|
class VNCDisplay extends Component {
|
||||||
// componentDidMount() {
|
componentDidMount() {
|
||||||
// console.log(RFB)
|
console.log(RFB)
|
||||||
|
|
||||||
// let rfb;
|
let rfb;
|
||||||
// let desktopName;
|
let desktopName;
|
||||||
// // When this function is called we have
|
// When this function is called we have
|
||||||
// // successfully connected to a server
|
// successfully connected to a server
|
||||||
// function connectedToServer(e) {
|
function connectedToServer(e) {
|
||||||
// status("Connected to " + desktopName);
|
status("Connected to " + desktopName);
|
||||||
// }
|
}
|
||||||
// // This function is called when we are disconnected
|
// This function is called when we are disconnected
|
||||||
// function disconnectedFromServer(e) {
|
function disconnectedFromServer(e) {
|
||||||
// if (e.detail.clean) {
|
if (e.detail.clean) {
|
||||||
// status("Disconnected");
|
status("Disconnected");
|
||||||
// } else {
|
} else {
|
||||||
// status("Something went wrong, connection is closed");
|
status("Something went wrong, connection is closed");
|
||||||
// }
|
}
|
||||||
// }
|
}
|
||||||
// // When this function is called, the server requires
|
// When this function is called, the server requires
|
||||||
// // credentials to authenticate
|
// credentials to authenticate
|
||||||
// function credentialsAreRequired(e) {
|
function credentialsAreRequired(e) {
|
||||||
// const password = prompt("Password Required:");
|
const password = prompt("Password Required:");
|
||||||
// rfb.sendCredentials({ password: password });
|
rfb.sendCredentials({ password: password });
|
||||||
// }
|
}
|
||||||
// // When this function is called we have received
|
// When this function is called we have received
|
||||||
// // a desktop name from the server
|
// a desktop name from the server
|
||||||
// function updateDesktopName(e) {
|
function updateDesktopName(e) {
|
||||||
// desktopName = e.detail.name;
|
desktopName = e.detail.name;
|
||||||
// }
|
}
|
||||||
// // Since most operating systems will catch Ctrl+Alt+Del
|
// Since most operating systems will catch Ctrl+Alt+Del
|
||||||
// // before they get a chance to be intercepted by the browser,
|
// before they get a chance to be intercepted by the browser,
|
||||||
// // we provide a way to emulate this key sequence.
|
// we provide a way to emulate this key sequence.
|
||||||
// function sendCtrlAltDel() {
|
function sendCtrlAltDel() {
|
||||||
// rfb.sendCtrlAltDel();
|
rfb.sendCtrlAltDel();
|
||||||
// return false;
|
return false;
|
||||||
// }
|
}
|
||||||
// // Show a status text in the top bar
|
// Show a status text in the top bar
|
||||||
// function status(text) {
|
function status(text) {
|
||||||
// document.getElementById('status').textContent = text;
|
document.getElementById('status').textContent = text;
|
||||||
// }
|
}
|
||||||
// // This function extracts the value of one variable from the
|
// This function extracts the value of one variable from the
|
||||||
// // query string. If the variable isn't defined in the URL
|
// query string. If the variable isn't defined in the URL
|
||||||
// // it returns the default value instead.
|
// it returns the default value instead.
|
||||||
// function readQueryVariable(name, defaultValue) {
|
function readQueryVariable(name, defaultValue) {
|
||||||
// // A URL with a query parameter can look like this:
|
// A URL with a query parameter can look like this:
|
||||||
// // https://www.example.com?myqueryparam=myvalue
|
// https://www.example.com?myqueryparam=myvalue
|
||||||
// //
|
//
|
||||||
// // Note that we use location.href instead of location.search
|
// Note that we use location.href instead of location.search
|
||||||
// // because Firefox < 53 has a bug w.r.t location.search
|
// because Firefox < 53 has a bug w.r.t location.search
|
||||||
// const re = new RegExp('.*[?&]' + name + '=([^&#]*)'),
|
const re = new RegExp('.*[?&]' + name + '=([^&#]*)'),
|
||||||
// match = document.location.href.match(re);
|
match = document.location.href.match(re);
|
||||||
// if (typeof defaultValue === 'undefined') { defaultValue = null; }
|
if (typeof defaultValue === 'undefined') { defaultValue = null; }
|
||||||
// if (match) {
|
if (match) {
|
||||||
// // We have to decode the URL since want the cleartext value
|
// We have to decode the URL since want the cleartext value
|
||||||
// return decodeURIComponent(match[1]);
|
return decodeURIComponent(match[1]);
|
||||||
// }
|
}
|
||||||
// return defaultValue;
|
return defaultValue;
|
||||||
// }
|
}
|
||||||
// document.getElementById('sendCtrlAltDelButton')
|
document.getElementById('sendCtrlAltDelButton')
|
||||||
// .onclick = sendCtrlAltDel;
|
.onclick = sendCtrlAltDel;
|
||||||
// // Read parameters specified in the URL query string
|
// Read parameters specified in the URL query string
|
||||||
// // By default, use the host and port of server that served this file
|
// By default, use the host and port of server that served this file
|
||||||
|
|
||||||
// // const host = readQueryVariable('host', window.location.hostname);
|
// const host = readQueryVariable('host', window.location.hostname);
|
||||||
// // let port = readQueryVariable('port', window.location.port);
|
// let port = readQueryVariable('port', window.location.port);
|
||||||
// // const password = readQueryVariable('password', '');
|
// const password = readQueryVariable('password', '');
|
||||||
|
|
||||||
// const { vnc_url } = this.props;
|
const { vnc_url } = this.props;
|
||||||
// // http://117.50.12.63:43149/vnc_lite.html?password=headless
|
// http://117.50.12.63:43149/vnc_lite.html?password=headless
|
||||||
// let _ar1 = vnc_url.split('/');
|
let _ar1 = vnc_url.split('/');
|
||||||
// let ipAndPort = _ar1[2].split(':')
|
let ipAndPort = _ar1[2].split(':')
|
||||||
// let passwordAr = _ar1[3].split('password=')
|
let passwordAr = _ar1[3].split('password=')
|
||||||
// const host = ipAndPort[0]
|
const host = ipAndPort[0]
|
||||||
// let port = ipAndPort[1]
|
let port = ipAndPort[1]
|
||||||
// const password = passwordAr[1].split('&')[0]
|
const password = passwordAr[1].split('&')[0]
|
||||||
|
|
||||||
// const path = readQueryVariable('path', 'websockify');
|
const path = readQueryVariable('path', 'websockify');
|
||||||
// // | | | | | |
|
// | | | | | |
|
||||||
// // | | | Connect | | |
|
// | | | Connect | | |
|
||||||
// // v v v v v v
|
// v v v v v v
|
||||||
// status("Connecting");
|
status("Connecting");
|
||||||
// // Build the websocket URL used to connect
|
// Build the websocket URL used to connect
|
||||||
// let url;
|
let url;
|
||||||
// if (vnc_url.indexOf("https:") != -1) {
|
if (vnc_url.indexOf("https:") != -1) {
|
||||||
// url = 'wss';
|
url = 'wss';
|
||||||
// } else {
|
} else {
|
||||||
// url = 'ws';
|
url = 'ws';
|
||||||
// }
|
}
|
||||||
// url += '://' + host;
|
url += '://' + host;
|
||||||
// if(port) {
|
if(port) {
|
||||||
// url += ':' + port;
|
url += ':' + port;
|
||||||
// }
|
}
|
||||||
// url += '/' + path;
|
url += '/' + path;
|
||||||
// // Creating a new RFB object will start a new connection
|
// Creating a new RFB object will start a new connection
|
||||||
// rfb = new RFB(document.getElementById('screen'), url,
|
rfb = new RFB(document.getElementById('screen'), url,
|
||||||
// { credentials: { password: password } });
|
{ credentials: { password: password } });
|
||||||
// // Add listeners to important events from the RFB module
|
// Add listeners to important events from the RFB module
|
||||||
// rfb.addEventListener("connect", connectedToServer);
|
rfb.addEventListener("connect", connectedToServer);
|
||||||
// rfb.addEventListener("disconnect", disconnectedFromServer);
|
rfb.addEventListener("disconnect", disconnectedFromServer);
|
||||||
// rfb.addEventListener("credentialsrequired", credentialsAreRequired);
|
rfb.addEventListener("credentialsrequired", credentialsAreRequired);
|
||||||
// rfb.addEventListener("desktopname", updateDesktopName);
|
rfb.addEventListener("desktopname", updateDesktopName);
|
||||||
// // Set parameters that can be changed on an active connection
|
// Set parameters that can be changed on an active connection
|
||||||
// rfb.viewOnly = readQueryVariable('view_only', false);
|
rfb.viewOnly = readQueryVariable('view_only', false);
|
||||||
// rfb.scaleViewport = readQueryVariable('scale', false);
|
rfb.scaleViewport = readQueryVariable('scale', false);
|
||||||
// }
|
}
|
||||||
|
|
||||||
// render() {
|
render() {
|
||||||
// const { challenge, vnc_url } = this.props
|
const { challenge, vnc_url } = this.props
|
||||||
|
|
||||||
|
|
||||||
// return (
|
return (
|
||||||
// <div className="">
|
<div className="">
|
||||||
// <style>{`
|
<style>{`
|
||||||
// #top_bar {
|
#top_bar {
|
||||||
// background-color: #6e84a3;
|
background-color: #6e84a3;
|
||||||
// color: white;
|
color: white;
|
||||||
// font: bold 12px Helvetica;
|
font: bold 12px Helvetica;
|
||||||
// padding: 6px 5px 4px 5px;
|
padding: 6px 5px 4px 5px;
|
||||||
// border-bottom: 1px outset;
|
border-bottom: 1px outset;
|
||||||
// }
|
}
|
||||||
// #status {
|
#status {
|
||||||
// text-align: center;
|
text-align: center;
|
||||||
// }
|
}
|
||||||
// #sendCtrlAltDelButton {
|
#sendCtrlAltDelButton {
|
||||||
// position: fixed;
|
position: fixed;
|
||||||
// top: 0px;
|
top: 0px;
|
||||||
// right: 0px;
|
right: 0px;
|
||||||
// border: 1px outset;
|
border: 1px outset;
|
||||||
// padding: 5px 5px 4px 5px;
|
padding: 5px 5px 4px 5px;
|
||||||
// cursor: pointer;
|
cursor: pointer;
|
||||||
// }
|
}
|
||||||
// #screen {
|
#screen {
|
||||||
// flex: 1; /* fill remaining space */
|
flex: 1; /* fill remaining space */
|
||||||
// overflow: hidden;
|
overflow: hidden;
|
||||||
// }
|
}
|
||||||
// `}</style>
|
`}</style>
|
||||||
// <div id="top_bar">
|
<div id="top_bar">
|
||||||
// <div id="status">Loading</div>
|
<div id="status">Loading</div>
|
||||||
// <div id="sendCtrlAltDelButton">Send CtrlAltDel</div>
|
<div id="sendCtrlAltDelButton">Send CtrlAltDel</div>
|
||||||
// </div>
|
</div>
|
||||||
// <div id="screen"></div>
|
<div id="screen"></div>
|
||||||
// </div>
|
</div>
|
||||||
// );
|
);
|
||||||
// }
|
}
|
||||||
// }
|
}
|
||||||
|
|
||||||
// export default VNCDisplay;
|
export default VNCDisplay;
|
||||||
|
|||||||
Loading…
Reference in new issue