实现一个网页终端

先简单说一下原理吧,在网页上和服务器上建立一个ws连接,然后网页获取用户输入传给服务端,服务端解析用户输入,在服务端shell执行命令并将执行输出通过ws传给网页渲染到页面上。

以上原理说起来简单,但是完全自己实现是不太现实的。下面我把实现用到的库和插件以及使用方式简单说一下。


xterm.js

xterm.js 是一个用来实现网页上终端UI的库。

简单的使用示例:

1
2
3
4
5
6
<div id="terminal"></div>
<script>
var terminalIns = new Terminal();
terminalIns.open(document.getElementById('terminal'));
terminalIns.write('Hello from \x1B[1;3;31mxterm.js\x1B[0m $ ')
</script>

node-pty

node-pty 是在node.js上用户执行shell命令,并获取标准输出的仓库,可以配合xterm.js通过ws来实现远程终端。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
var os = require('os');
var pty = require('node-pty');

var shell = os.platform() === 'win32' ? 'powershell.exe' : 'bash';

var ptyProcess = pty.spawn(shell, [], {
name: 'xterm-color',
cols: 80,
rows: 30,
cwd: process.env.HOME,
env: process.env
});

ptyProcess.on('data', function(data) {
process.stdout.write(data);
});

ptyProcess.write('ls\r');
ptyProcess.resize(100, 40);
ptyProcess.write('ls\r');

sockjs

sockjs 这个没啥好说的,实现WebSocket的库。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
const http = require('http');
const sockjs = require('sockjs');

const echo = sockjs.createServer({ prefix:'/echo' });
echo.on('connection', function(conn) {
conn.on('data', function(message) {
conn.write(message);
});
conn.on('close', function() {});
});

const server = http.createServer();
echo.attach(server);
server.listen(9999, '0.0.0.0');

实现流程

  1. 在服务端通过sockjs起一个ws的服务
  2. 并实例化node-pty通过sockjs的ws服务来接受客户端的命令执行并将反馈通过ws输出到客户端
  3. 在网页端通过xterm.js初始化一个网页终端UI
  4. 将网页端的xterm.js实例与服务端的node-pty建立连接,这里需要用到xterm.js的一个插件xterm-addon-attach这个插件接受一个WebSocket实例作为参数与服务端建立连接

考试题

  1. docker命令以下哪些为高危操作 A A docker rm容器id B docker inspect容器ID C docker mv容器ID D docker rm -f镜像ID

  2. 查看容器属性的方法 C A docker info B docker log C docker inspect D docker describe

  3. 有关docker正确的是 ABCD A docker info 可以查看到集群内容器的数量 B docker ps容器ID (参数-a:显示所有容器,包括未运行的; -n: 列出最近创建的n个容器) C docker pause暂停容器中所有的进程 D docker run创建一个新的容器并且启动它

  4. 构建Docker镜像应该遵循哪些原则? ABCD A 尽量选取满足需求但较小的基础系统镜像, 建议选择debian:wheezy镜像, 仅有43MB大小 B 请理编译生成文件、 安装包的缓存等临时文件 C 安装各个软件时候要指定准确的版本号, 并避免引入不需要的依赖 D 从安全的角度考虑, 应用尽量使用系统的库和依赖

  5. 以下哪个是核心Kubernetes对象?D A Pods B Services C Volumes D 以上所有

  6. 1.8 版本的 Kubernetes 引入了什么?A A Taints and Tolerations B Cluster level Logging C Secrets D Federated Clusters

  7. Kubernetes集群数据存储在以下哪个位置?C A KUBE-API服务器 B Kubelet C ETCD D 以上都不是

  8. Paas平台添加单体应用默认需要必填哪些表单项 D A 分支名称 B 环境类型 C 语言类型 D 以上所有

  9. Paas平台应用流状态有哪些 D A 代码质量检查 B 构建镜像 C 正式发布 D 以上所有

  10. Paas平台测试/发布单的提交人是指?A A 创建发起测试/发布单的人员 B 操作审核测试/发布单的人员 C 项目的负责人 D 以上都不是

本文结束感谢您的阅读

本文标题:实现一个网页终端

文章作者:陈宇(cosyer)

发布时间:2020年12月08日 - 20:12

最后更新:2020年12月10日 - 20:12

原始链接:http://mydearest.cn/2020/%E5%AE%9E%E7%8E%B0%E4%B8%80%E4%B8%AA%E7%BD%91%E9%A1%B5%E7%BB%88%E7%AB%AF.html

许可协议: 署名-非商业性使用-禁止演绎 4.0 国际 转载请保留原文链接及作者。

坚持原创技术分享,您的支持将鼓励我继续创作!