Use a hidden iframe to open console on Firefox

(cherry picked from commit 83d72787f4)
This commit is contained in:
grossmj 2023-01-31 18:56:07 +08:00
parent fa8fd3c4a2
commit 642082e9fb

View File

@ -1,4 +1,5 @@
import { Component, Input } from '@angular/core'; import { Component, Input } from '@angular/core';
import { DeviceDetectorService } from 'ngx-device-detector';
import { Node } from '../../../../../cartography/models/node'; import { Node } from '../../../../../cartography/models/node';
import{ Controller } from '../../../../../models/controller'; import{ Controller } from '../../../../../models/controller';
import { NodeService } from '../../../../../services/node.service'; import { NodeService } from '../../../../../services/node.service';
@ -12,7 +13,7 @@ export class ConsoleDeviceActionBrowserComponent {
@Input() controller:Controller ; @Input() controller:Controller ;
@Input() node: Node; @Input() node: Node;
constructor(private toasterService: ToasterService, private nodeService: NodeService) {} constructor(private toasterService: ToasterService, private nodeService: NodeService, private deviceService: DeviceDetectorService) {}
openConsole() { openConsole() {
this.nodeService.getNode(this.controller, this.node).subscribe((node: Node) => { this.nodeService.getNode(this.controller, this.node).subscribe((node: Node) => {
@ -21,6 +22,31 @@ export class ConsoleDeviceActionBrowserComponent {
}); });
} }
createHiddenIframe(target: Element, uri: string) {
const iframe = document.createElement("iframe");
iframe.src = uri;
iframe.id = "hiddenIframe";
iframe.style.display = "none";
target.appendChild(iframe);
return iframe;
}
openUriUsingFirefox(uri: string) {
var iframe = (document.querySelector("#hiddenIframe") as HTMLIFrameElement);
if (!iframe) {
iframe = this.createHiddenIframe(document.body, "about:blank");
}
try {
iframe.contentWindow.location.href = uri;
} catch (e) {
if (e.name === "NS_ERROR_UNKNOWN_PROTOCOL") {
this.toasterService.error('Protocol handler does not exist');
}
}
}
startConsole() { startConsole() {
if (this.node.status !== 'started') { if (this.node.status !== 'started') {
this.toasterService.error('This node must be started before a console can be opened'); this.toasterService.error('This node must be started before a console can be opened');
@ -33,20 +59,30 @@ export class ConsoleDeviceActionBrowserComponent {
this.node.console_host = this.controller.host; this.node.console_host = this.controller.host;
} }
if ( const device = this.deviceService.getDeviceInfo();
this.node.console_type === 'telnet' ||
this.node.console_type === 'vnc' || try {
this.node.console_type === 'spice' var uri;
) { if (this.node.console_type === 'telnet') {
try { uri = `gns3+telnet://${this.node.console_host}:${this.node.console}?name=${this.node.name}&project_id=${this.node.project_id}&node_id=${this.node.node_id}`;
location.assign( } else if (this.node.console_type === 'vnc') {
`gns3+${this.node.console_type}://${this.node.console_host}:${this.node.console}?name=${this.node.name}&project_id=${this.node.project_id}&node_id=${this.node.node_id}` uri = `gns3+vnc://${this.node.console_host}:${this.node.console}?name=${this.node.name}&project_id=${this.node.project_id}&node_id=${this.node.node_id}`;
); } else if (this.node.console_type.startsWith('spice')) {
} catch (e) { uri = `gns3+spice://${this.node.console_host}:${this.node.console}?name=${this.node.name}&project_id=${this.node.project_id}&node_id=${this.node.node_id}`
this.toasterService.error(e); } else {
this.toasterService.error('Supported console types are: telnet, vnc, spice and spice+agent.');
} }
} else {
this.toasterService.error('Supported console types: telnet, vnc, spice.'); if (device.browser === "Firefox") {
// Use a hidden iframe otherwise Firefox will disconnect
// from the GNS3 controller websocket if we use location.assign()
this.openUriUsingFirefox(uri);
} else {
location.assign(uri);
}
} catch (e) {
this.toasterService.error(e);
} }
} }
} }