我遇到了这个令人敬畏的库xterm.js,它也是Visual Studio Code终端的基础.我有一个非常普遍的问题.

我想通过基于Web的终端(在网络外,可能在aws服务器上)访问本地网络上的机器(ssh到机器).我能够在本地网络中成功完成此操作,但我无法通过Internet - >本地网络得出结论.

举个例子 - An aws server running the application on ip 54.123.11.98 which has a GUI with a button to open terminal. I want to open terminal of a local machine which is in a local network somewhere behind some public ip on local ip 192.168.1.7.

上面的例子可以使用某种解决方案来实现,我可以使用xterm.js,这样我就不必去构建基于Web的终端了吗？在以这种方式暴露终端时,我应该记住哪些主要的安全问题？

我在考虑在AWS和本地网络ip之间使用固定的中间服务器,并使用某种反向ssh隧道进程来做这个但我不确定这是否是正确的方法还是可以有更简单/更好的方式为达到这个.

我知道数字海洋,谷歌云,他们都这样做但他们必须连接到具有公共IP的计算机,而我在本地网络中有一台机器.我真的不想配置路由器来进行任何类型的设置.

我有一个简单的程序,请说如下:

#include <stdio.h>

int main()
{
    char buf[100];
    while (fgets(buf, sizeof(buf), stdin) != NULL) {
        printf("You typed: %s", buf);
    }
}

我用Emscripten编译了它:

emcc -o hello.html hello.cpp

这给了我一个非常基本的Emscripten生成的网页,其中包含一个简单的程序输出窗口.但是,该fgets()调用会导致浏览器弹出窗口,大概来自prompt().我可以输入内容,结果最终会显示在输出窗口中.这不是一个理想的互动体验.

我想要的是更传统的"控制台"界面,用户可以在终端窗口中交互式输入以向交互式程序提供输入.

我怀疑解决方案可能存在于JQueryTerminal,Hyper或Xterm.js之类的内容中,但我目前还不清楚如何将其中任何一个实际连接到Emscripten编译的程序.

如何为我的Emscripten代码提供"控制台"界面？

是）我有的：

• 运行Blessed的Node.js脚本和http / websocket服务器。
• 运行Xterm.js和websocket客户端的浏览器。

我想做的事：

• 渲染祝福到websockets上的xterm窗口。

服务器代码：

"use strict";

process.title = 'neosim-server';

var blessed = require('neo-blessed');
var contrib = require('blessed-contrib');
var webSocketServer = require('websocket').server;
var http = require('http');

const webSocketsServerPort = 8080;
var clients = [ ];

/**
 * HTTP server
 */
var server = http.createServer(function(request, response) {
    // Not important for us. We're writing WebSocket server,
    // not HTTP server
});
server.listen(webSocketsServerPort, function() {
    console.log((new Date()) + " Server is listening on port "
        + webSocketsServerPort + "."); …

我是 Angular 的新手。我正在尝试使用 xterm.js ( https://xtermjs.org/ )，但显示效果不佳。这是渲染： 渲染

我创建了一个 xterm 组件。xterm.component.ts 文件代码是：

import { Component, OnInit } from '@angular/core';
import { Terminal } from "xterm";

@Component({
  selector: 'app-xterm',
  templateUrl: './xterm.component.html',
  styleUrls: ['./xterm.component.css'],
})
export class XtermComponent implements OnInit {
  public term: Terminal;
  container: HTMLElement;

  constructor() { }

  ngOnInit() {
    this.term = new Terminal();
    this.container = document.getElementById('terminal');
    this.term.open(this.container);
    this.term.writeln('Welcome to xterm.js');
  }
}

我的 xterm.component.html 只包含这个：

<div id="terminal"></div>

我真的不知道该怎么做更多......提前致谢伙计们

我正在开发一个小型xterm.js应用程序（刚刚开始），我想知道当用户按下Enter时如何从当前行获取文本。这是程序：

var term = new Terminal();
term.open(document.getElementById('terminal'));
term.prompt = () => {
  term.write('\r\n$ ');
};
term.writeln('This is a shell emulator.');
term.prompt();

term.on('key', function(key, ev) {
  const printable = !ev.altKey && !ev.altGraphKey && !ev.ctrlKey && !ev.metaKey;

  if (ev.keyCode === 13) {
    term.prompt();
    console.log(curr_line);
    var curr_line = ""
  } else if (ev.keyCode === 8) {
    // Do not delete the prompt
    if (term.x > 2) {
      curr_line = curr_line.slice(0, -1);
      term.write('\b \b');
    }
  } else if (printable) {
    curr_line += …

我试图在 xterm.js 中输出带有换行符的字符串，但它以奇怪的格式显示输出。我需要像在实际终端中一样打印输出。

从“xterm”导入{终端}；

    let terminal = new Terminal();
    terminal.loadAddon(new FitAddon());
    let data = "kumar\nkanhaiya"
    this.setState({showOutput: true},() => {
        terminal.open(document.getElementById('xterm'));
        terminal.writeUtf8(data)
    })

    <div id="xterm"></div>

我已附上图像以供参考我面临的问题。

换行符应该使文本的其他部分从头开始，就像在实际终端中一样。但它在左侧留下了一些空间。

https://i.stack.imgur.com/IOcpW.png

tl;dr 我创建了一个 React 包装器来将日志消息数组渲染到终端中，但调整大小会产生奇怪的输出（参见屏幕截图）。（NPM 上有一个 React-Wrapper，但它不适用于我的用例 - 导致屏幕闪烁）

我正在为 Guppy 开发一项功能，其中我为终端输出添加Xterm.js 。该 PR 可以在这里找到。

由于超链接扫描/解析，我添加了 xterm，并且它正在工作。

但我一直坚持调整大小才能工作。如果我在应用程序中启动 devServer 并等待一些文本，它将以正确的字母宽度显示。如果减小尺寸，我会得到字母宽度不正确的输出。就像下面的截图一样：

在未调整大小的状态下它看起来总是正确的，但调整大小后它会得到错误的显示 - 因此放大和缩小屏幕宽度时会发生这种情况。

输出应类似于以下屏幕截图（可能带有一些换行）：

我认为这是由Fit 插件或我使用调整大小观察器处理调整大小的方式引起的，但我不确定。

xterm 字母的跨度样式的宽度NaNpx如下图所示： 这是由我正在使用的媒体查询引起的吗？我还没有看到这一点，也许我必须暂时禁用所有媒体查询，看看这是否导致了这种行为。

到目前为止我已经尝试过：

• 包裹this.xterm.fit()成一个setTimeout(func, 0)但没有效果
• 修改了我正在使用的一些样式，但我还没有找到原因。

代码

我使用的代码可以在Github 分支 feature-terminal-links上找到，但在这里我想提取我添加的部分以使 Xterm 与 React 一起使用：

1. 我创建了一个样式组件XtermContainer作为 div，这样我就可以添加 Xterm 样式和自己的样式。以下代码位于内部render，并将成为我们的 xterm.js 容器（innerRef稍后将使用ComponentDidMount该容器初始化 Xterm）：

<XtermContainer
    width={width}
    height={height}
    innerRef={node => (this.node = node)}
/>

2. componentDidMount使用上面的容器初始化 xterm …

我正在设计一个网络，其中包括使用 Xterm.js 的终端，并且希望将字符串传输到服务器。我可以在上面输入一些字符串，但不能使用“退格”、“删除”、“主页”功能。

我尝试自己完成这些功能，但是还有很多功能需要完成。

例如退格键

term.on('key', (key, ev) => {
    const code = key.charCodeAt(0);
    if(code == 127){   //Backspace
        term.write("\b \b");
    }
});

我可以删除最后一个字符，但不能删除字符串内部...这些功能是我自己完成的吗？有没有更方便的模块？

谢谢！

我尝试在 Reactjs 中使用 Xtermjs。但当我按照指南进行操作时。结果如下：

它应该显示没有顶部文本区域和文本“W”。

我的代码如下：

import React from 'react';
import { Terminal } from 'xterm';
import { FitAddon } from 'xterm-addon-fit'; 

class XTerminal extends React.Component {
    componentDidMount() {
        const {id} = this.props;
        const terminalContainer = document.getElementById(id);
        const terminal = new Terminal({cursorBlink: true});
        const fitAddon = new FitAddon();
        terminal.loadAddon(fitAddon);
        terminal.open(terminalContainer);
        terminal.write('Hello from \x1B[1;3;31mxterm.js\x1B[0m $ ');
        fitAddon.fit();
    }

    render() {
        return(
            <div id={this.props.id}></div>
        )
    }
}

export default XTerminal;

我在stackoverflow中搜索了类似的问题，但没有答案。我无法对这个问题发表评论。所以我写下这个问题。有人可以帮忙吗？谢谢 ：）

我给自己挖了一个很深的兔子洞，试图找出标题说的是什么。如果你对这个问题感到困惑，我会给出更详细的解释：你见过 VSCode 终端吗？还是终点站？好吧，我想做那些应用程序所做的事情。我有一个电子应用程序，为了方便用户，我想在其中包含某种命令提示符。我查看了 xterm.js，但只能找到 SSH 之类的示例，而不是到系统上托管的控制台的直接链接。我要问的是如何将 xterm.js（在电子中）连接到实际工作的命令提示符？我见过能够与 cmd.exe 交互的程序，例如 Windows Terminal。我将用它作为例子。

图片取自进程黑客

在附图中您可以看到三个过程。WindowsTerminal.exe、OpenConsole.exe 和 cmd.exe。在深入研究 Windows 终端的源代码后，我可以看到 OpenConsole.exe 随您创建的每个 cmd 实例一起启动。所以我假设这是与 cmd.exe 交互的程序。现在我知道 Windows Terminal 是使用 UWP 制作的，但你可以看到VSCode发生类似的事情（我打开了一堆终端来演示）

这是另一篇有类似问题的帖子，但没有答案。我希望这个能获得一些关注。

所以如果你能回答的话，谢谢。如果您有点偏离主题，请记住我的问题：如何将 xterm.js（在电子中）连接到实际工作的命令提示符？

抱歉，如果您无法理解我的措辞，我对此不太擅长：P