# 远程文件编辑器 一个为 ComputerCraft: Tweaked (CC:Tweaked) 设计的远程文件编辑器,支持实时文件管理和代码编辑。 Demo: http://cc-web-edit.liulikeji.cn 你可以直接使用 Demo,这是开放的,但你也可以部署自己的服务器 ## 🌟 特性 ### 核心功能 - **远程文件管理**:实时浏览、编辑和管理 CC:Tweaked 计算机中的文件 - **Monaco 编辑器**:基于 VS Code 的 Monaco 编辑器,提供专业的代码编辑体验 - **低延迟通信**:基于 HTTP 长轮询 + 请求挂起机制,模拟 WebSocket 的低延迟传输 ### 文件操作 - ✅ 文件/文件夹创建、重命名、删除 - ✅ 文本文件在线编辑和保存 - ✅ 文件上传(支持多文件,最大 1MB) - ✅ 文件下载到本地 - ✅ 二进制文件识别(非文本文件显示为 `[binary]`) ### CC:Tweaked 集成 - **自动命令生成**:根据 URL 参数自动生成连接命令 - **一键复制**:点击即可复制连接命令到剪贴板 - **房间管理**:支持创建和加入房间 - **实时通信**:高效的请求挂起机制确保接近实时的响应 ## 🚀 快速开始 ### 项目结构 ``` 项目根目录/ ├── PyServer/ # Python 后端服务器 │ ├── main.py # 主服务器文件 │ └── static/ # 静态文件目录(需手动创建) │ └── Client/ │ └── cc/ │ └── main.lua # CC:Tweaked 客户端脚本 ├── Frontend1/ # Vue 前端项目 │ ├── src/ │ │ ├── App.vue # 主组件 │ │ └── mock-server.ts # HTTP 客户端 │ └── package.json └── Client/ # 客户端文件 └── main.lua # CC:Tweaked 客户端脚本 ``` ### 部署步骤 1. **部署后端服务器** ```bash # 进入后端目录 cd PyServer # 创建静态文件目录 mkdir -p static/Client/cc # 复制客户端脚本到静态目录 cp ../Client/main.lua static/Client/cc/main.lua # 安装依赖 pip install -r requirements.txt # 启动服务器(需要管理员权限绑定80端口) python main.py ``` 服务器将启动: - HTTP 服务:端口 80(文件服务、API 和静态资源) 2. **构建前端项目** ```bash # 进入前端目录 cd Frontend1 # 安装依赖 npm install # 构建生产版本 npm run build # 将构建产物复制到后端静态目录 cp -r dist/* ../PyServer/static/ ``` 3. **访问编辑器** 打开浏览器访问 `http://你的服务器地址` 即可使用编辑器。 ### CC:Tweaked 客户端连接 1. **获取连接命令** - 访问编辑器页面会自动创建房间 - 在页面底部点击命令文本即可复制连接命令 2. **在游戏中运行** ```lua # 粘贴复制的命令到CC:Tweaked计算机 # 命令格式类似:wget run http://服务器地址/Client/cc/main.lua http://服务器地址 房间ID ``` 3. **刷新文件列表** - 在 CC 客户端连接成功后 - 返回编辑器页面点击刷新按钮即可看到文件列表 ## 🔧 功能说明 ### 当前支持的功能 - 📁 文件系统浏览和操作 - 📝 文本文件在线编辑 - ⬆️ 文件上传(≤1MB) - ⬇️ 文件下载到本地 - 🔄 实时文件同步 ### 限制说明 - **二进制文件**:非文本文件会显示为 `[binary]`,无法在线编辑 - **单客户端**:目前主要支持一个网页端和一个 CC 客户端的配对使用 - **文件大小**:上传文件限制为 1MB - **低延迟**:HTTP 长轮询机制提供接近实时的响应体验 ### 计划功能 - 🚧 远程控制台(后续开发) - 🚧 改进的多客户端支持 ## ⚙️ API 接口 ### HTTP API 接口 - `POST /api/room` - 创建房间 - `POST /api/frontend/send` - 前端发送消息到客户端 - `POST /api/frontend/receive` - 前端接收来自客户端的消息(长轮询) - `POST /api/client/send` - 客户端发送消息到前端 - `POST /api/client/receive` - 客户端接收来自前端的消息(长轮询) ### 通信机制 **长轮询 + 请求挂起**: - 客户端请求挂起最长达 295 秒,直到有消息到达 - 当有新消息时立即响应,实现低延迟传输 - 服务器端控制请求超时,避免不必要的轮询 ### 消息类型 - `file_operation` - 文件操作请求 - `file_operation_response` - 文件操作响应 ### 文件操作类型 - `fetch_files` - 获取文件列表 - `create_or_save_file` - 创建/保存文件 - `new_file` - 创建新文件 - `new_folder` - 创建新文件夹 - `rename` - 重命名文件/文件夹 - `delete_file` - 删除文件/文件夹 ## 🎯 使用流程 1. **访问编辑器**:打开服务器地址,自动创建房间 2. **复制命令**:点击编辑器主页的 CC:Tweaked 命令文本,复制到剪贴板 3. **CC 端连接**:在游戏中粘贴并运行命令 4. **刷新列表**:在编辑器中刷新文件列表 5. **开始编辑**:浏览和编辑 CC 计算机中的文件 ## 🔒 注意事项 1. **权限要求**:服务器需要绑定 80 端口 2. **网络访问**:确保 CC:Tweaked 计算机可以访问你的服务器 3. **文件安全**:操作会直接影响游戏内计算机的文件系统 ## 🐛 常见问题 **Q: 无法访问编辑器页面** A: 检查服务器是否正常启动,80 端口是否被占用 **Q: CC 端连接失败** A: 检查网络连通性,确保游戏内计算机可以访问服务器 **Q: 文件列表为空** A: 确保 CC 客户端已成功连接,然后刷新文件列表 **Q: 文件上传失败** A: 检查文件大小是否超过 1MB 限制 **Q: 消息传输延迟** A: 服务器使用长轮询机制,响应通常在毫秒级别 ## 📄 技术说明 - **后端**:Python + HTTP Server + 长轮询机制 - **前端**:Vue 3 + TypeScript + Monaco Editor - **通信**:HTTP 长轮询 + 请求挂起实现低延迟通信 - **客户端**:CC:Tweaked + HTTP ## 🤝 开发说明 该项目使用创新的 HTTP 长轮询 + 请求挂起机制来模拟 WebSocket 的低延迟传输特性,为远程代码编辑提供了近乎实时的响应体验。 远程控制台功能计划在后续版本中开发。 ## 贡献 你可以制作适配不同平台的客户端然后共享其代码 欢迎提交 issues