科技企业网站源码,如何百度收录自己的网站,济南网站建设凡科,做网站的时候遇到的问题UltraVNC作为VNC服务器
下载UltraVNC
UltraVNC官网下载地址 在每个需要被远程的PC上安装UltraVNC软件并且开启5900端口
配置UltraVNC
打开winvnc.exe 初次打开需要手动在exe文件根目录新建配置文件ultravnc.ini#xff0c;这样setting后可以保存配置
下面是一些简单配置…UltraVNC作为VNC服务器
下载UltraVNC
UltraVNC官网下载地址 在每个需要被远程的PC上安装UltraVNC软件并且开启5900端口
配置UltraVNC
打开winvnc.exe 初次打开需要手动在exe文件根目录新建配置文件ultravnc.ini这样setting后可以保存配置
下面是一些简单配置 其他不用动
代理实现使用NoVNC进行远程桌面 使用node.js使用websockify代理PC的RFB 5900端口让前端可以使用WebSocket通讯进行远程桌面并且使用NoVNC进行远程桌面 原理
在Node.js服务端的服务器上安装websockify然后客户端请求远程时执行websockify命令随机分配端口继续代理PC的5900端口客户端就可以使用这随机分配的端口进行WebSocket远程桌面传入ip和随机分配的端口给到NoVNC的页面中即可访问
安装 websockify 首先需要下载Python Python下载地址windows 下载websockify
pip install websockify独立版本的websockifyGitHub链接 下载后进入目录运行
npm install
npm link然后你就可以用 websockify 命令了。
下载noVNC
noVNC github地址
需要将noVNC下载到vnc-proxy的public目录到时候会用到vnc.html或者vnc_lite.html进行远程
核心代码
后端核心代码server.js
// server.js
const express require(express)
const path require(path)
const { spawn } require(child_process)const app express()
const HTTP_PORT 3000
const WS_START_PORT 6080const proxies {} // key targetIP:port
let nextPort WS_START_PORT// 映射noVnc静态资源到url
app.use(/, express.static(path.join(__dirname, public/novnc)))// 启动新代理
app.get(/api/start-proxy, (req, res) {const { ip, vncPort } req.queryif (!ip || !vncPort) return res.status(400).send(缺少参数 ip 或 vncPort)const target ${ip}:${vncPort}if (proxies[target]) return res.send(代理已存在ws://${req.hostname}:${proxies[target].wsPort} - ${target})const wsPort nextPort// 使用websockify代理PC5900端口后前端可以使用wsPort进行访问远程桌面const child spawn(python, [-m, websockify, --web./public/novnc, wsPort, target])child.on(exit, () delete proxies[target])child.stdout.on(data, d console.log([${target}] ${d}))child.stderr.on(data, d console.error([${target} ERROR] ${d}))proxies[target] { child, wsPort }res.send(已启动ws://${req.hostname}:${wsPort} - ${target})
})// 停止指定代理
app.get(/api/stop-proxy, (req, res) {const { ip, vncPort } req.queryif (!ip || !vncPort) return res.status(400).send(缺少参数 ip 或 vncPort)const target ${ip}:${vncPort}const proxy proxies[target]if (!proxy) return res.status(404).send(代理不存在)proxy.child.kill()delete proxies[target]res.send(已停止代理${target})
})// 查看当前代理状态
app.get(/api/list-proxy, (req, res) {const list Object.entries(proxies).map(([target, { wsPort }]) ({target,wsPort,url: ws://${req.hostname}:${wsPort}}))res.json(list)
})app.listen(HTTP_PORT, () {console.log(服务运行http://localhost:${HTTP_PORT}/vnc.html)
})
项目使用命令
npm install express
node server.js前端代码
doServer.vue组件 可以对后端进行请求实现:开启代理、停止代理、代理列表然后通过代理列表点击进行远程桌面
templatedivh2VNC 多端代理/h2divinput v-modelip placeholderVNC 设备 IPinput v-modelvncPort placeholderVNC 端口 typenumberbutton clickstartProxy启动代理/button/divh3当前代理列表/h3button clickrefreshList刷新/buttonulli v-foritem in proxyList :keyitem.targetspan{{ item.target }} → {{ item.url }}/spanbutton clickopenVnc(item.wsPort)打开/buttonbutton clickstopProxy(item.target)停止/button/li/ulp stylecolor:red{{ message }}/p/div
/templatescript
import axios from axiosexport default {data() {return {ip: 127.0.0.1,vncPort: 5900,proxyList: [],message: ,ServerIp: 192.168.1.24,ServerPort: 3000}},mounted() {this.refreshList()},methods: {async startProxy() {try {const res await axios.get(/api/start-proxy?ip${this.ip}vncPort${this.vncPort})this.message res.datathis.refreshList()} catch (err) {this.message 启动失败: (err.response?.data || err.message)}},async stopProxy(target) {const [ip, vncPort] target.split(:)try {const res await axios.get(/api/stop-proxy?ip${ip}vncPort${vncPort})this.message res.datathis.refreshList()} catch (err) {this.message 停止失败: (err.response?.data || err.message)}},async refreshList() {try {const res await axios.get(/api/list-proxy)this.proxyList res.data} catch (err) {this.message 获取代理失败: (err.response?.data || err.message)}},openVnc(wsPort) {// scaletrue自适应屏幕// host port ws的ip和端口 这些参数可以去vnc_lite或者vnc.html代码查看window.open(http://${this.ServerIp}:${this.ServerPort}/vnc_lite.html?host${this.ServerIp}port${wsPort}scaletrue, _blank)}}
}
/script
启动项目
npm install
npm run serve效果
