一个独立的、现代化的基于 WebAssembly 的 RDP (远程桌面协议) 客户端库,提供清晰简洁的 JavaScript API。
本项目提供了一个使用 Emscripten 编译为 WebAssembly 的现代化浏览器 RDP 客户端。用户可以直接从 Web 浏览器连接到 RDP 服务器,无需任何插件。
- ✅ ES6+ 特性: 使用私有字段 (
#)、空值合并运算符 (??)、Map 等现代语法 - ✅ 链式调用: 支持流式 API 调用
- ✅ 自动重连: 内置智能重连机制
- ✅ 单文件库: 所有功能集成在一个文件中
- ✅ 完整键盘: 100+ 按键支持,包括修饰键和锁定键
- ✅ 类型安全: 增强的参数验证和错误处理
📖 查看 现代化更新日志 了解详情
- 🌐 基于浏览器的 RDP 客户端
- ⚡ WebAssembly 编译,接近原生性能
- 🔒 支持安全的 RDP 连接
- 🎨 清晰简洁的 JavaScript API
- ⌨️ 完整键盘支持:
- 100+ 按键映射
- 修饰键 (Shift, Ctrl, Alt, Meta)
- 锁定键 (CapsLock, NumLock, ScrollLock)
- 输入法编辑器 (IME) 支持
- Unicode 字符输入
- 🖱️ 鼠标和指针支持
- 📋 剪贴板支持
- 💡 现代化 ES6+ 语法
- 📝 完整的 API 文档
- 🔄 自动重连机制
- 🎯 事件驱动架构
- ⛓️ 链式调用支持
<!DOCTYPE html>
<html>
<head>
<title>RDP Client</title>
</head>
<body>
<canvas id="rdp-canvas" width="800" height="600"></canvas>
<!-- 引入单个文件 -->
<script src="rdpclient.js"></script>
<script>
const canvas = document.getElementById('rdp-canvas');
// 创建客户端实例(支持链式调用)
const client = new RDPClient(canvas, {
url: 'ws://your-server:3390',
username: 'user',
password: 'pass',
width: 800,
height: 600,
autoReconnect: true, // 启用自动重连
maxReconnectAttempts: 5 // 最多重连 5 次
})
.on('connected', () => console.log('已连接'))
.on('disconnected', () => console.log('已断开'))
.on('error', (err) => console.error('错误:', err));
// 初始化并连接
async function connect() {
try {
await client.initialize('./js_client.js');
await client.connect();
} catch (error) {
console.error('连接失败:', error);
}
}
connect();
</script>
</body>
</html>// 使用所有配置选项
const client = new RDPClient(canvas, {
url: 'ws://server:3390',
username: 'admin',
password: 'secret',
domain: 'COMPANY',
width: 1920,
height: 1080,
bpp: 24,
keyboard: 'en',
autoReconnect: true,
maxReconnectAttempts: 3
});
// 监听所有事件
client
.on('connected', () => {
console.log('成功连接到服务器');
})
.on('disconnected', () => {
console.log('与服务器断开连接');
})
.on('error', (error) => {
console.error('发生错误:', error);
})
.on('resize', ({ width, height }) => {
console.log(`屏幕大小变更: ${width}x${height}`);
})
.on('clipboard', (data) => {
console.log('剪贴板数据:', data);
})
.on('log', ({ level, message }) => {
console.log(`[${level}] ${message}`);
});
// 初始化和连接
await client.initialize('./js_client.js');
await client.connect();
// 程序控制
client.isConnected(); // 检查连接状态
client.getCanvasSize(); // 获取画布大小
client.getKeyboardState(); // 获取键盘状态
client.releaseAllKeys(); // 释放所有按键
await client.disconnect(); // 断开连接本项目包含三个示例页面:
- example.html - 完整的连接示例,带美观的 UI
- keyboard-test.html - 键盘功能测试页面
- test-modern.html - 现代化特性测试页面
运行示例:
# 使用任何 HTTP 服务器
python -m http.server 8000
# 然后访问 http://localhost:8000/example.html查看 LIBRARY_API.md 获取完整的 API 文档。
new RDPClient(canvas, options)async initialize(wasmPath)- 初始化 WASM 模块async connect()- 连接到服务器async disconnect()- 断开连接on(event, handler)- 注册事件监听器(支持链式调用)off(event, handler)- 移除事件监听器(支持链式调用)isConnected()- 检查连接状态
connected- 连接成功disconnected- 连接断开error- 发生错误resize- 屏幕大小变更clipboard- 剪贴板数据log- 日志消息
rdp.wasm/
├── src/ # 源代码
│ ├── application/ # HTML/JS 应用文件
│ ├── main/ # 主入口点 (js_client, js_player)
│ ├── redjs/ # JavaScript 绑定和图形
│ ├── red_channels/ # RDP 通道实现
│ ├── red_emscripten/ # Emscripten 工具
│ ├── system/ # 系统级实现
│ ├── core/ # 核心功能
│ ├── client/ # RDP 客户端实现
│ ├── gdi/ # 图形设备接口
│ ├── mod/ # RDP 模块
│ ├── keyboard/ # 键盘支持
│ ├── translation/ # 国际化
│ ├── transport/ # 传输层
│ └── utils/ # 工具函数
├── include/ # Redemption 头文件
├── configs/ # 配置文件
├── jam/ # Boost.Jam 构建配置
├── tests/ # 测试文件
├── tools/ # 构建和实用工具脚本
├── Jamroot # 主构建配置
└── targets.jam # 构建目标
# 克隆并安装 Emscripten SDK
git clone https://github.com/emscripten-core/emsdk.git
cd emsdk
./emsdk install latest
./emsdk activate latest
source ./emsdk_env.sh推荐版本: 2.0.9 或更高
项目使用 Boost.Jam 作为构建系统,请根据你的平台安装。
# Linux/Mac
mkdir system_include/
ln -s /usr/include/boost system_include/
# Windows
mkdir system_include
# 将 Boost 安装路径的 boost 目录链接到 system_include注意:项目已包含所有必需的 Redemption 头文件(548 个 .hpp 文件),无需额外配置。
source $EMSDK_PATH/emsdk_env.sh# Release 构建 (优化)
bjam -j7 js_client
# Debug 构建
bjam -j7 debug js_clientbjam -j7 install_node_modulesbjam -j7# 复制模式 (默认)
bjam -j7 rdpclient
# 符号链接模式
bjam -j7 -s copy_application_mode=symbolic rdpclientbjam -s JS_MODULE_NAME=MyRdpModule js_clientbjam debug -s debug-symbols-source-map=on -s JS_SOURCE_MAP='prefix//' js_client使用 source maps 在 Node.js 中调试:
npm install source-map-support配置你的 RDP 代理 (rdpproxy.ini):
[globals]
enable_websocket=yes或使用 websocat 作为 WebSocket 到 TCP 的桥接:
websocat --binary ws-l:127.0.0.1:8080 tcp:127.0.0.1:3389# 导航到构建目录
cd "$(bjam cwd | sed '/^CWD/!d;s/^CWD: //')"
# 启动 HTTP 服务器
python3 -m http.server 7453 --bind 127.0.0.1
# 在浏览器中打开
xdg-open http://localhost:7453/client.html或使用提供的脚本:
./tools/open_client.sh项目还包括一个用于查看录制会话的 RDP 播放器:
# 构建播放器
bjam -j7 js_player
# 安装播放器应用
bjam -j7 rdpplayer如果修改了源文件需要重新生成 targets.jam:
bjam targets.jam
# 或
./tools/gen_targets.sh > targets.jam./tools/gen_reversed_keylayout.sh本项目从 Redemption 项目的 jsclient 子项目中提取。现已独立,不再依赖完整的 Redemption 源代码树。
必要的 Redemption 核心文件已集成到 src/ 目录中,头文件在 include/ 目录,配置系统在 configs/ 目录。
本项目继承 Redemption 项目的许可证。详见 LICENSE 和 COPYING 文件。
欢迎贡献!请确保:
- 代码遵循现有风格
- 测试通过:
bjam -j7 - 在 debug 和 release 模式下都能成功构建
如果遇到未定义符号错误,重新生成构建目标:
bjam targets.jam确保你的 RDP 服务器或代理已启用 WebSocket 支持,或使用 websocat 作为桥接。
- 验证 Emscripten 已正确激活:
source $EMSDK_PATH/emsdk_env.sh - 检查 Boost 头文件是否可访问
- 尝试清理构建:
rm -rf bin/
如有问题和疑问,请在项目仓库中提交 issue。
注意: 这是从 Redemption 中提取的 jsclient 的独立版本。完整的 Redemption 代理项目请访问 https://github.com/wallix/redemption