Xterm.js 是一个用 TypeScript 编写的前端组件,它允许应用程序在浏览器中为用户提供功能齐全的终端。它被 VS Code、Hyper 和 Theia 等流行项目所使用。
特性
- 终端应用程序直接可用:Xterm.js 可与大多数终端应用程序(如
bash
、vim
和tmux
)一起使用,包括对基于 curses 的应用程序和鼠标事件的支持。 - 高性能:Xterm.js 速度非常快,甚至包含了 GPU 加速渲染器。
- 丰富的 Unicode 支持:支持 CJK、表情符号和输入法。
- 自包含:无需任何依赖即可工作。
- 无障碍:可以开启屏幕阅读器和最小对比度支持。
- 更多功能:链接、主题、插件、文档完善的 API 等。
Xterm.js 不是什么
- Xterm.js 不是一个可以下载并在计算机上使用的终端应用程序。
- Xterm.js 不是
bash
。Xterm.js 可以连接到bash
等进程,让你与它们交互(提供输入、接收输出)。
入门
首先,你需要安装该模块,我们仅通过 npm 发布,所以你需要安装 npm,然后通过运行以下命令将 xterm.js 添加为依赖项:
npm install @xterm/xterm
要在浏览器中开始使用 xterm.js,请将 xterm.js
和 xterm.css
添加到 HTML 页面的 head 中。然后创建一个 <div id="terminal"></div>
,xterm 可以附加到其上。最后,实例化 Terminal
对象,然后使用 div
的 DOM 对象调用 open
函数。
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="node_modules/@xterm/xterm/css/xterm.css" />
<script src="node_modules/@xterm/xterm/lib/xterm.js"></script>
</head>
<body>
<div id="terminal"></div>
<script>
var term = new Terminal();
term.open(document.getElementById('terminal'));
term.write('Hello from \x1B[1;3;31mxterm.js\x1B[0m $ ')
</script>
</body>
</html>
导入
加载 xterm.js 的推荐方式是通过 ES6 模块语法:
import { Terminal } from '@xterm/xterm';
插件
⚠️ 本节描述了 v3.14.0 中引入的新插件格式,旧格式的说明请参见此处
插件是基于 xterm.js API 构建的独立模块,用于扩展 Terminal
。要使用插件,首先需要在项目中安装它:
npm i -S @xterm/addon-web-links
然后导入插件,实例化它并调用 Terminal.loadAddon
:
import { Terminal } from '@xterm/xterm';
import { WebLinksAddon } from '@xterm/addon-web-links';
const terminal = new Terminal();
// 在终端上加载 WebLinksAddon,这就是让网络链接在终端中工作所需的全部内容。
terminal.loadAddon(new WebLinksAddon());
xterm.js 团队维护以下插件,但任何人都可以构建它们:
@xterm/addon-attach
:通过 WebSocket 连接到运行进程的服务器@xterm/addon-clipboard
:访问浏览器的剪贴板@xterm/addon-fit
:使终端适应容器元素@xterm/addon-image
:添加图像支持@xterm/addon-search
:添加搜索功能@xterm/addon-serialize
:将终端缓冲区序列化为 VT 序列或 HTML@xterm/addon-unicode11
:将字符宽度更新为 Unicode 11 值@xterm/addon-web-links
:添加网络链接检测和交互@xterm/addon-webgl
:使用canvas
元素的 WebGL2 上下文渲染 xterm.js
浏览器支持
由于 xterm.js 通常作为开发者工具实现,官方仅支持现代浏览器。具体来说,支持最新版本的 Chrome、Edge、Firefox 和 Safari。
Xterm.js 在 Electron 应用程序中无缝工作,甚至可能在较早版本的浏览器上运行。这些是我们努力保持工作的版本。
Node.js 支持
我们还发布了 xterm-headless
,这是一个可在 Node.js 中运行的 xterm.js 精简版本。这种用法的一个示例是跟踪进程运行的终端状态,并使用序列化插件,以便在重新连接时恢复所有状态。
API
xterm.js 的完整 API 包含在 TypeScript 声明文件 中,使用 GitHub 中的分支/标签选择器(w
)导航到正确版本的 API。
请注意,某些 API 被标记为 实验性,这些 API 的添加是为了在不承诺像正常 semver API 那样支持的情况下尝试新想法。请注意,这些 API 可能在版本之间发生巨大变化,因此如果你打算使用实验性 API,请务必阅读发行说明。
发布
Xterm.js 大约每月发布一次。
所有当前和过去的发布版本都可在本仓库的 Releases 页面 上找到,你可以在 wiki 上查看高级路线图,并通过查看 Milestones 了解我们现在正在进行的工作。
Beta 版本
我们的 CI 会为每次合并到 master 分支的变更发布 beta 版本到 npm。使用以下命令安装最新的 beta 版本:
npm install -S @xterm/xterm@beta
这些版本通常应该是稳定的,但可能会有一些 bug。我们建议主要使用 beta 版本来测试新功能并验证 bug 修复。
贡献
你可以阅读 wiki 上的指南 了解如何贡献和设置 xterm.js 以进行开发。
实际应用
Xterm.js 被多个世界级应用程序用于提供出色的终端体验。
- SourceLair:基于xterm.js的浏览器内IDE,为用户提供功能齐全的Linux终端。
- Microsoft Visual Studio Code:现代、多功能且强大的开源代码编辑器,提供基于xterm.js的集成终端。
- ttyd:一个用于在网络上共享终端的命令行工具,基于xterm.js提供功能齐全的终端模拟。
- Eclipse Che:开发者工作空间服务器、云IDE和Eclipse下一代IDE。
- Codenvy:为开发团队提供的云工作空间。
- CoderPad:程序员在线面试平台。可运行多种编程语言的代码,结果由xterm.js显示。
- WebSSH2:使用xterm.js、socket.io和ssh2的基于Web的SSH2客户端。
- Spyder Terminal:嵌入Spyder IDE的全功能系统终端。
- Cloud Commander:具有控制台和编辑器的传统Web文件管理器。
- Next Tech:交互式编码和Web开发课程的在线平台。使用xterm.js的实时容器支持终端。
- RStudio:R语言的集成开发环境(IDE)。
- Terminal for Atom:Atom文本编辑器的简单终端。
- Eclipse Orion:运行在云端的现代开源软件开发环境。在云中编码、部署和运行。
- Gravitational Teleport:通过SSH或HTTPS远程访问Linux服务器集群的现代SSH服务器。
- Hexlet:实用编程课程(JavaScript、PHP、Unix、数据库、函数式编程)。从第一行代码到第一份工作的稳步路径。
- Selenoid UI:可扩展的Golang实现的Selenium Hub——Selenoid的简单UI。我们使用XTerm通过websockets从docker容器流式传输日志。
- Portainer:Docker的简单管理UI。
- SSHy:基于HTML5的SSHv2 Web客户端,利用xterm.js、SJCL和websockets实现端到端加密。
- JupyterLab:Jupyter的可扩展计算环境,支持所有编程语言的交互式数据科学和科学计算。
- Theia:用TypeScript实现的云端和桌面IDE框架。
- Opshell:简化跨多个组织使用AWS实例的运维助手工具。
- Proxmox VE:完整的开源企业虚拟化平台。使用xterm.js作为容器终端和主机shell。
- Script Runner:在Atom中运行脚本(或shell)。
- Whack Whack Terminal:Visual Studio 2017的终端模拟器。
- VTerm:基于Electron和React的可扩展终端模拟器。
- electerm:基于electron/node-pty/xterm的终端/ssh/sftp客户端(支持mac、win、linux)。
- Kubebox:Kubernetes集群的终端控制台。
- Azure Cloud Shell:Azure Cloud Shell是Microsoft为Azure构建的托管管理机器。
- atom-xterm:在Atom工作区提供终端的Atom插件。
- rtty:通过网络从任何地方访问您的终端。
- Pisth:iOS平台的SFTP和SSH客户端。
- abstruse:基于Node.JS和Docker的持续集成平台。
- Azure Data Studio:支持在Windows、macOS和Linux上使用SQL Server、Azure SQL DB和SQL DW的数据管理工具。
- FreeMAN:面向高级用户的免费跨平台文件管理器。
- Fluent Terminal:基于UWP和Web技术的终端模拟器。
- Hyper:基于Web技术构建的终端。
- Diag:更好的方式来快速解决问题。捕获、共享和重新应用故障排除知识,让您专注于解决重要问题。
- GoTTY:基于xterm.js的简单命令行工具,将您的终端作为Web应用程序共享。
- genact:无意义活动生成器。
- cPanel & WHM:首选的托管平台。
- Nutanix:Nutanix企业云在Nutanix Calm的webssh功能中使用xterm,并计划将旧的noserial(termjs)功能迁移到xterm.js。
- SSH Web Client:使用PHP的SSH Web客户端。
- Juno:基于Atom的灵活Julia IDE。
- webssh:基于Web的ssh客户端。
- info-beamer hosted:使用xterm.js从Web仪表板管理数字标牌设备。
- Jumpserver:Jumpserver Luna项目,Jumpserver是一个堡垒机项目,Luna使用xterm.js进行Web终端模拟。
- LxdMosaic:使用xterm.js通过LXD提供对容器的终端访问。
- CodeInterview.io:支持25+种语言和多个Web框架的编码面试平台。使用xterm.js提供shell访问。
- Bastillion:Bastillion是一个开源的基于Web的SSH控制台,集中管理对系统的管理访问。
- PHP App Server:为桌面操作系统创建轻量级、可安装的近似原生应用程序。ExecTerminal(优雅地封装xterm.js终端)、TerminalManager和RunProcessSDK是独立的、可重用的ES5+兼容JavaScript组件。
- NgTerminal:NgTerminal是一个基于Angular 7+的Web终端,利用xterm.js。您可以通过在组件中添加
<ng-terminal></ng-terminal>
轻松将其添加到应用程序中。 - tty-share:极简的互联网终端共享。
- Ten Hands:运行命令行任务的一站式平台。
- WebAssembly.sh:WebAssembly WASI浏览器终端
- Gus:一个共享编码平台,您可以使用xterm.js运行Python
- Linode:Linode使用xterm.js为用户提供Linode实例的Web控制台。
- FluffOS:活跃维护的LPMUD驱动程序,支持websocket。
- x-terminal:在Atom工作区提供终端的Atom插件。
- CoCalc:预装了大量免费软件,用于聊天、协作、开发、编程、发布、研究、共享、教学,支持C++、HTML、Julia、Jupyter、LaTeX、Markdown、Python、R、SageMath、Scala等。
- Dank Domain:开源多用户中世纪游戏,支持新旧终端模拟。
- DockerStacks:本地LAMP/LEMP开发工作室
- Codecademy:在其Bash课程中使用xterm.js。
- Laravel Ssh Web Client:带有ssh web客户端的Laravel服务器库存,使用xterm.js连接服务器
- Replit:支持50多种不同语言的协作式浏览器IDE。
- TeleType:允许您方便地在线共享终端的cli工具。展示精湛的命令行技能,帮助同事,教学或故障排除。
- Intervue:面试用的结对编程工具。支持多种编程语言,结果由xterm.js显示。
- TRASA:Web、SSH、RDP和数据库服务的零信任访问。
- Commas:Commas是一个可定制的终端和命令运行器。
- Devtron:Kubernetes的软件交付工作流。
- NxShell:一个易用的新型SSH终端。
- gifcast:将asciinema录制转换为动态GIF。
- WizardWebssh:一个带有Pyqt5小部件的终端,可嵌入使用,可作为SSH客户端连接到SSH服务器。基于Python编写,使用tornado、paramiko和xterm.js。
- Wizard Assistant:Wizard Assistant配备高级自动化工具、预加载的常用和特殊省时命令,以及内置SSH终端。现在您可以轻松远程管理、排查和分析任何系统。
- ucli:适合每个人的命令行工具:family_man_woman_girl_boy:,访问www.ucli.tech。
- Tess:适合所有人的简单可定制终端。在tessapp.dev了解更多。
- HashiCorp Nomad:一个容器编排器,能够通过Web界面使用websockets和xterm.js连接到远程任务。
- TermPair:通过浏览器查看和控制终端,具有端到端加密。
- gdbgui:gdb(GNU调试器)的基于浏览器的前端。
- goormIDE:运行几乎所有编程语言,支持实时协作、实时结对编程和内置即时通讯。
- FleetDeck:远程桌面和虚拟终端。
- OpenSumi:帮助您快速构建云端或桌面IDE产品的框架。
- KubeSail:自托管公司 - 使用xterm允许用户执行进入Kubernetes pod并构建GitHub应用。
- WiTTY:基于Web的交互式终端仿真器,允许用户轻松记录、共享和重放控制台会话。
- libv86终端转发:Web的点对点SSH,使用WebRTC通过Bugout进行数据传输,使用v86进行基于Web的虚拟化。
- hack.courses:使用xterm.js提供真实终端的交互式Linux和命令行课程,适合所有人。
- Render:应用程序、网站和数据库的平台即服务,使用xterm.js为用户容器提供命令提示符,并用于流式传输构建和运行时日志。
- CloudTTY:友好的Kubernetes云Shell(Web终端)。
- Go SSH Web客户端:使用Go、WebSocket和Xterm.js的简单SSH Web客户端。
- web3os:下一代Web的去中心化操作系统。
- Cratecode:通过交互式在线课程免费学习编程。Cratecode使用xterm.js为用户提供自己的Linux环境访问。
- Super Terminal:这是一个基于http的终端,适合不喜欢重复操作并想节省时间的开发人员。
- graSSHopper:一个简单的SSH客户端,带有文件浏览器、历史记录等多种功能。
- DomTerm:平铺和标签。可分离会话(如tmux)。使用预测回显的远程连接和精美的ssh包装器。Qt、Electron、Tauri/Wry或桌面浏览器前端。可选择xterm.js引擎(更快)或原生DomTerm(功能和图形更多)- 或两者兼用。
- Cloudtutor.io:创新的在线学习平台,为用户提供交互式实验室访问。
- Helix编辑器游乐场:基于终端的helix编辑器的在线游乐场。
- Coder:自托管远程开发环境。
- Wave Terminal:一个开源的、AI原生的、为无缝工作流程而构建的终端。
- eva:Eva是一个用Go开发的SSH远程登录Web应用。
- OpenSFTP:超级漂亮的SSH和SFTP集成工作区客户端。
- balena:Balena是一个全栈解决方案,用于开发、部署、更新和故障排除IoT边缘设备。我们在balenaCloud上使用xterm.js来管理和调试设备。
- 还有更多... 您的应用程序中也使用xterm.js吗?请提交一个拉取请求将其包含在此处。我们很乐意将它列入我们的清单。注意:请将任何新的贡献仅添加到列表末尾。
许可协议
如果您为此项目贡献代码,您默认允许您的代码根据MIT许可证进行分发。您也默认验证所有代码均为您的原创作品。
版权所有 (c) 2017-2022,xterm.js作者 (MIT许可证)
版权所有 (c) 2014-2017,SourceLair私人公司 (www.sourcelair.com) (MIT许可证)
版权所有 (c) 2012-2013,Christopher Jeffrey (MIT许可证)