michael/scrypted
1
0
Fork 0
mirror of https://github.com/koush/scrypted.git synced 2026-04-09 18:10:26 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

core: refactor console on top of pty

Browse Source
This commit is contained in:
Koushik Dutta
2024-03-09 16:44:33 -08:00
parent b83b5196da
commit 90c8e90af7
6 changed files with 106 additions and 175 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
plugins/core/package.json
View File

@@ -28,7 +28,6 @@
"interfaces": [
"@scrypted/launcher-ignore",
"HttpRequestHandler",
"EngineIOHandler",
"DeviceProvider",
"SystemSettings",
"Settings"

40
plugins/core/src/main.ts
View File

@@ -12,7 +12,7 @@ import { MediaCore } from './media-core';
import { newScript, ScriptCore, ScriptCoreNativeId } from './script-core';
import { TerminalService, TerminalServiceNativeId } from './terminal-service';
import { UsersCore, UsersNativeId } from './user';
import { ReplService, ReplServiceNativeId } from './repl-service';
import { ConsoleServiceNativeId, PluginSocketService, ReplServiceNativeId } from './plugin-socket-service';
const { systemManager, deviceManager, endpointManager } = sdk;
@@ -31,7 +31,7 @@ interface RoutedHttpRequest extends HttpRequest {
params: { [key: string]: string };
}
class ScryptedCore extends ScryptedDeviceBase implements HttpRequestHandler, EngineIOHandler, DeviceProvider, Settings {
class ScryptedCore extends ScryptedDeviceBase implements HttpRequestHandler, DeviceProvider, Settings {
router: any = Router();
publicRouter: any = Router();
mediaCore: MediaCore;
@@ -39,7 +39,8 @@ class ScryptedCore extends ScryptedDeviceBase implements HttpRequestHandler, Eng
aggregateCore: AggregateCore;
automationCore: AutomationCore;
users: UsersCore;
replService: ReplService;
consoleService: PluginSocketService;
replService: PluginSocketService;
terminalService: TerminalService;
localAddresses: string[];
storageSettings = new StorageSettings(this, {
@@ -185,7 +186,9 @@ class ScryptedCore extends ScryptedDeviceBase implements HttpRequestHandler, Eng
if (nativeId === TerminalServiceNativeId)
return this.terminalService ||= new TerminalService();
if (nativeId === ReplServiceNativeId)
return this.replService ||= new ReplService();
return this.replService ||= new PluginSocketService(ReplServiceNativeId, 'repl');
if (nativeId === ConsoleServiceNativeId)
return this.consoleService ||= new PluginSocketService(ConsoleServiceNativeId, 'console');
}
async releaseDevice(id: string, nativeId: string): Promise<void> {
@@ -198,35 +201,6 @@ class ScryptedCore extends ScryptedDeviceBase implements HttpRequestHandler, Eng
return check;
}
async checkService(request: HttpRequest, ws: WebSocket, name: string): Promise<boolean> {
// only allow admin users to access these services.
if (request.aclId)
return false;
const check = this.checkEngineIoEndpoint(request, name);
if (!check)
return false;
const deviceId = request.url.substr(check.length).split('/')[0];
const plugins = await systemManager.getComponent('plugins');
const { nativeId, pluginId } = await plugins.getDeviceInfo(deviceId);
const port = await plugins.getRemoteServicePort(pluginId, name);
const socket = net.connect(port);
socket.on('close', () => ws.close());
socket.on('data', data => ws.send(data));
socket.resume();
socket.write(nativeId?.toString() || 'undefined');
ws.onclose = () => socket.destroy();
ws.onmessage = message => socket.write(message.data);
return true;
}
async onConnection(request: HttpRequest, ws: WebSocket): Promise<void> {
if (await this.checkService(request, ws, 'console')) {
return;
}
ws.close();
}
async handlePublicFinal(request: HttpRequest, response: HttpResponse) {
// need to strip off the query.
const incomingPathname = request.url.split('?')[0];

21
plugins/core/src/repl-service.ts → plugins/core/src/plugin-socket-service.ts
View File

@@ -4,29 +4,20 @@ import { once } from 'events';
import net from 'net';
export const ReplServiceNativeId = 'replservice';
export const ConsoleServiceNativeId = 'consoleservice';
export class ReplService extends ScryptedDeviceBase implements StreamService {
constructor(nativeId?: ScryptedNativeId) {
super(ReplServiceNativeId);
export class PluginSocketService extends ScryptedDeviceBase implements StreamService {
constructor(nativeId: ScryptedNativeId, public serviceName: string) {
super(nativeId);
}
/*
* The input to this stream can send buffers for normal terminal data and strings
* for control messages. Control messages are JSON-formatted.
*
* The current implemented control messages:
*
* Start: { "interactive": boolean, "cmd": string[] }
* Resize: { "dim": { "cols": number, "rows": number } }
* EOF: { "eof": true }
*/
async connectStream(input?: AsyncGenerator<Buffer | string, void>, options?: any): Promise<AsyncGenerator<Buffer, void>> {
const pluginId = options?.pluginId as string;
if (!pluginId)
throw new Error('must provide pluginId');
const plugins = await sdk.systemManager.getComponent('plugins');
const replPort: number = await plugins.getRemoteServicePort(pluginId, 'repl');
const replPort: number = await plugins.getRemoteServicePort(pluginId, this.serviceName);
const socket = net.connect(replPort);
await once(socket, 'connect');
@@ -61,6 +52,8 @@ export class ReplService extends ScryptedDeviceBase implements StreamService {
yield await queue.dequeue();
}
}
catch (e) {
}
finally {
socket.destroy();
}

114
plugins/core/ui/src/components/ConsoleCard.vue
View File

@@ -1,114 +0,0 @@
<template>
<v-card raised>
<v-toolbar dark color="blue">
Console
<v-tooltip bottom>
<template v-slot:activator="{ on }">
<v-btn @click="copy" v-on="on" text
><v-icon small> far fa-copy</v-icon>
</v-btn>
</template>
<span>Copy</span>
</v-tooltip>
<v-tooltip bottom>
<template v-slot:activator="{ on }">
<v-btn v-on="on" text @click="expanded = !expanded">
<v-icon x-small>fa-angle-double-down</v-icon>
</v-btn>
</template>
<span>Toggle Expand</span>
</v-tooltip>
<v-tooltip bottom>
<template v-slot:activator="{ on }">
<v-btn @click="clear" v-on="on" text
><v-icon small> fas fa-trash</v-icon>
</v-btn>
</template>
<span>Clear</span>
</v-tooltip>
</v-toolbar>
<div ref="terminal"></div>
</v-card>
</template>
<script>
import { Terminal } from "xterm";
import { FitAddon } from "xterm-addon-fit";
import eio from "engine.io-client";
import { sleep } from "../common/sleep";
import { getCurrentBaseUrl } from "../../../../../packages/client/src";
export default {
props: ["deviceId"],
socket: null,
buffer: [],
term: null,
watch: {
expanded(oldValue, newValue) {
if (this.expanded) this.term.resize(this.term.cols, this.term.rows * 2.5);
else this.term.resize(this.term.cols, this.term.rows / 2.5);
},
},
data() {
return {
expanded: false,
};
},
methods: {
async clear() {
this.term.clear();
this.buffer = [];
const plugins = await this.$scrypted.systemManager.getComponent(
"plugins"
);
plugins.clearConsole(this.deviceId);
},
reconnect(term) {
this.buffer = [];
const baseUrl = getCurrentBaseUrl();
const eioPath = `endpoint/@scrypted/core/engine.io/console/${this.deviceId}`;
const eioEndpoint = baseUrl ? new URL(eioPath, baseUrl).pathname : '/' + eioPath;
const options = {
path: eioEndpoint,
};
const rootLocation = `${window.location.protocol}//${window.location.host}`;
this.socket = eio(rootLocation, options);
this.socket.on("message", (data) => {
this.buffer.push(Buffer.from(data));
term.write(new Uint8Array(data));
});
this.socket.on("close", async () => {
await sleep(1000);
this.reconnect(term);
});
},
copy() {
this.$copyText(Buffer.concat(this.buffer).toString());
},
},
mounted() {
const term = new Terminal({
theme: this.$vuetify.theme.dark ? undefined : {
foreground: 'black',
background: 'white',
cursor: 'black',
},
convertEol: true,
disableStdin: true,
scrollback: 10000,
});
const fitAddon = new FitAddon();
term.loadAddon(fitAddon);
term.open(this.$refs.terminal);
fitAddon.fit();
this.term = term;
this.reconnect(term);
},
destroyed() {
this.socket?.close();
},
};
</script>

12
plugins/core/ui/src/components/Device.vue
View File

@@ -22,11 +22,11 @@
</v-flex>
<v-flex xs12 v-if="showConsole" ref="consoleEl">
<ConsoleCard :deviceId="id"></ConsoleCard>
<PtyComponent :reconnect="true" :clearButton="true" @clear="clearConsole" :copyButton="true" title="Console" :hello="(device.nativeId || 'undefined') " nativeId="consoleservice" :control="false" :options="{ pluginId: device.pluginId }"></PtyComponent>
</v-flex>
<v-flex xs12 v-if="showRepl" ref="replEl">
<PtyComponent title="REPL" :hello="device.nativeId + '\n'" nativeId="replservice" :control="false" :options="{ pluginId: device.pluginId }"></PtyComponent>
<PtyComponent :copyButton="true" title="REPL" :hello="(device.nativeId || 'undefined')" nativeId="replservice" :control="false" :options="{ pluginId: device.pluginId }"></PtyComponent>
</v-flex>
<v-flex xs12 md7>
<v-layout row wrap>
@@ -198,7 +198,6 @@ import VueSlider from "vue-slider-component";
import "vue-slider-component/theme/material.css";
import LogCard from "./builtin/LogCard.vue";
import ConsoleCard from "./ConsoleCard.vue";
import PtyComponent from "./builtin/PtyComponent.vue";
import {
getComponentWebPath,
@@ -380,7 +379,6 @@ export default {
PluginAdvancedUpdate,
VueSlider,
LogCard,
ConsoleCard,
PtyComponent,
Readme,
@@ -474,6 +472,12 @@ export default {
onChange() {
// console.log(JSON.stringify(this.device));
},
async clearConsole() {
const plugins = await this.$scrypted.systemManager.getComponent(
"plugins"
);
plugins.clearConsole(this.device.id);
},
cleanupListener() {
if (this.listener) {
this.listener.removeListener();

93
plugins/core/ui/src/components/builtin/PtyComponent.vue
View File

@@ -1,15 +1,45 @@
<template>
<v-card raised>
<v-toolbar dark color="blue">{{ title }}</v-toolbar>
<div ref="terminal" style="height: 700px"></div>
<v-toolbar dark color="blue">{{ title }}
<v-tooltip bottom>
<template v-slot:activator="{ on }">
<v-btn @click="copy" v-on="on" text
><v-icon small> far fa-copy</v-icon>
</v-btn>
</template>
<span>Copy</span>
</v-tooltip>
<v-tooltip bottom>
<template v-slot:activator="{ on }">
<v-btn v-on="on" text @click="expanded = !expanded">
<v-icon x-small>fa-angle-double-down</v-icon>
</v-btn>
</template>
<span>Toggle Expand</span>
</v-tooltip>
<v-tooltip bottom>
<template v-slot:activator="{ on }">
<v-btn @click="clear" v-on="on" text
><v-icon small>fas fa-trash</v-icon>
</v-btn>
</template>
<span>Clear</span>
</v-tooltip>
</v-toolbar>
<div ref="terminal"></div>
</v-card>
</template>
<script>
import { createAsyncQueue } from "@scrypted/common/src/async-queue";
import { Deferred } from "@scrypted/common/src/deferred";
import { sleep } from "@scrypted/common/src/sleep";
import { Terminal } from "xterm";
import { FitAddon } from "xterm-addon-fit";
import { createAsyncQueue } from "@scrypted/common/src/async-queue";
export default {
term: null,
buffer: [],
unmounted: null,
props: {
nativeId: String,
title: String,
@@ -17,8 +47,15 @@ export default {
hello: String,
options: Object,
control: Boolean,
copyButton: Boolean,
clearButton: Boolean,
reconnect: Boolean,
},
destroyed() {
this.unmounted.resolve();
},
mounted() {
this.unmounted = new Deferred();
const term = new Terminal({
theme: this.$vuetify.theme.dark
? undefined
@@ -29,19 +66,42 @@ export default {
},
convertEol: true,
});
this.term = term;
const fitAddon = new FitAddon();
term.loadAddon(fitAddon);
term.open(this.$refs.terminal);
fitAddon.fit();
this.setupShell(term);
this.connectPty(term);
},
watch: {
expanded(oldValue, newValue) {
if (this.expanded) this.term.resize(this.term.cols, this.term.rows * 2.5);
else this.term.resize(this.term.cols, this.term.rows / 2.5);
},
},
data() {
return {
expanded: false,
};
},
methods: {
async setupShell(term) {
async clear() {
this.term.clear();
this.buffer = [];
this.$emit("clear");
},
copy() {
this.$copyText(Buffer.concat(this.buffer).toString());
},
async connectPty(term) {
this.buffer = [];
const termSvcRaw = this.$scrypted.systemManager.getDeviceByName("@scrypted/core");
const termSvc = await termSvcRaw.getDevice(this.$props.nativeId);
const termSvcDirect = await this.$scrypted.connectRPCObject(termSvc);
const dataQueue = createAsyncQueue();
this.unmounted.promise.then(() => dataQueue.end());
if (this.$props.hello) {
const hello = Buffer.from(this.$props.hello, 'utf8');
@@ -100,11 +160,26 @@ export default {
}
const remoteGenerator = await termSvcDirect.connectStream(localGenerator(), this.$props.options);
for await (const message of remoteGenerator) {
if (!message) {
break;
try {
for await (const message of remoteGenerator) {
if (!message) {
break;
}
const buffer = Buffer.from(message);
if (this.$props.copyButton) {
this.buffer.push(buffer);
}
term.write(new Uint8Array(message));
}
term.write(new Uint8Array(Buffer.from(message)));
}
finally {
if (!this.$props.reconnect)
return;
await sleep(1000);
if (this.unmounted.finished)
return;
this.connectPty(term);
}
}
},