怎样用微信与电脑连接服务器,怎么使用WebSocket进行微信小程序远程控制电脑屏幕?...
今天小编给大家分享的是怎么使用WebSocket进行微信小程序远程控制电脑屏幕?对这个感兴趣的小伙伴们就和小编一起学习下吧,以下就是具体的内容。
开发过程
1、WebSocket服务器搭建
本次WebSocket服务器是基于Node.js来完成部署的,所有我们首先需要搭建一个Node.js环境
检测是否安装成功可以通过命令行工具运行以下命令
node -v
- WebSocket模块安装
Node.js安装成功后,其默认就安装好了Node.js包管理工具npm,通过使用npm命令,我们就可以来安装/卸载/更新Node.js包了。我们来安装WebSocket模块,运行以下命令:
npm install ws
- 启动WebSocket服务器
WebSocket模块安装完毕后,接下来我们通过简单的几行代码来启动WebSocket服务器,下面代码保存为app.js,存放于当前目录
//app.js
var conns = {};
var wss = require(\'ws\').Server;
var server = new wss({
host: "127.0.0.1",
port: 9999
});
server.on(\'connection\', function(ws) {
ws.on(\'message\', function(message) {
console.log(message);
var msg = JSON.parse(message); //记录客户端信息
if (msg.id) {
conns[msg.id] = msg[\'info\'];
conns[msg.id][\'conn\'] = ws;
console.log(conns[msg.id][\'name\'] + \' - 已连接\');
} //服务器向特定的客户端发送消息
if (msg.fromId && msg.toId && msg.data) {
var temp = {
\'name\': conns[msg.fromId][\'name\'],
\'msg\': msg.data
}
conns[msg.toId][\'conn\'].send(JSON.stringify(temp));
}
});
});console.log(\'WebSocket server runing...\');
在命令行工具运行以下命令来启动WebSocket服务器
node app.js
WebSocket服务器已经启动完毕,接下来我们来看客户端(我的电脑&微信小程序)是如何跟服务器端建立起连接的,以及客户端和服务器端之间的数据是如何交互的...
2、客户端【我的电脑】和服务器端建立连接
客户端【我的电脑】通过下面简单的代码来和服务器端建立WebSocket连接
//创建WebSocket连接
var ws = new WebSocket("ws://127.0.0.1:9999/");//监听WebSocket连接打开
ws.onopen = function() {
console.log("Opened");
var obj = {
id: 1,
info: {
name: \'我的电脑\'
}
}; //向服务器端发送客户端信息
ws.send(JSON.stringify(obj));
};//监听从服务器发送过来的消息
ws.onmessage = function(res) {
var temp = JSON.parse(res.data); //收到不同的消息做不同的处理
if (temp.msg == $(\'.metro li\').length) {
$(\'.close\').click();
} else {
$(\'.metro li:eq(\' + temp.msg + \')\').click();
}
console.log(\'收到[\' + temp.name + \']发来的消息:\' + temp.msg);
};//监听WebSocket关闭
ws.onclose = function() {
console.log("Closed");
};//监听WebSocket错误
ws.onerror = function(err) {
console.log("Error: ");
console.log(err);
};
运行客户端【我的电脑】,我们可以看到WebSocket连接创建成功,已连接
3、客户端【微信小程序】和服务器端建立连接
客户端【微信小程序】通过下面简单的代码来和服务器端建立WebSocket连接
var that = this;//创建WebSocket连接
wx.connectSocket({
url: \'ws://127.0.0.1:9999/\'});//监听WebSocket连接打开
wx.onSocketOpen(function(res) {
console.log("Opened");
var obj = {
id: 2,
info: {
name: \'微信小程序\'
}
}; //向服务器端发送客户端信息
wx.sendSocketMessage({
data: JSON.stringify(obj)
}); //绑定页面按钮点击事件
that.remoteCtrl = function(e) { //向服务器端发送对应的按钮数据
wx.sendSocketMessage({
data: JSON.stringify({
fromId: 2,
toId: 1,
data: e.currentTarget.id
})
});
};
});//监听从服务器发送过来的消息
wx.onSocketMessage(function(res) {
var temp = JSON.parse(res.data);
console.log(\'收到[\' + temp.name + \']发来的消息:\' + temp.msg);
});//监听WebSocket关闭
wx.onSocketClose(function(res) {
console.log("Closed");
});//监听WebSocket错误
wx.onSocketError(function(res) {
console.log("Error: ");
console.log(err);
});
运行客户端【微信小程序】,我们可以看到WebSocket连接创建成功,已连接
4、客户端【我的电脑】和【微信小程序】之间的通信
通过上面的第2、3步,我们已经将客户端和服务器之间的连接建立起来,下面我们就可以让【我的电脑】和【微信小程序】这两个客户端之间进行相互通信了,达到【微信小程序】远程控制【我的电脑】的目的了,如下图所示
总结
从以上简易的DEMO可以延伸出很多远程控制的应用场景,此外基于WebSocket的特性,还可以做聊天室、在线游戏、实时弹幕等功能。就如文章开头所讲,WebSocket虽不是新技术,但它结合微信小程序这个新产品,未来将诞生出更多线上线下的应用场景,值得我们关注。
以上就是怎么使用WebSocket进行微信小程序远程控制电脑屏幕的全部内容了,大家都学会了吗?
怎样用微信与电脑连接服务器,怎么使用WebSocket进行微信小程序远程控制电脑屏幕?...相关推荐
- 控制电脑_用小程序远程控制电脑
远程控制软件,大家已经见过很多了,比如说我们之前介绍过的 Remote Utilities.AnyDesk 等等,但是我今天介绍的这款与其他的有点与众不同. 今天登场的是一款名叫 HiPC 移动助手的 ...
- 锁屏后微信显示无法连接服务器,手机锁屏后微信收不到信息是怎么回事
以小米10,MIUI12系统,微信7.0.19版本为例,手机锁屏后微信收不到消息提醒的原因是: 1.可能是手机微信上的"新消息提醒"功能被关闭了. 2.也有可能是手机的通知功能将微 ...
- 【PC工具】HiPC手机远程控制电脑软件,微信小程序远程控制电脑
今天分享软件叫HiPC,可以实现用手机远程控制电脑设备的软件,手机端使用微信小程序控制.如果不小心将办公文件忘在家里电脑上了,可以用这个软件解决.办公室电脑如果可以不关的话,在家里也可以找办公室电脑的 ...
- 苹果手微信显示无法连接服务器,iPhone手机无法运行微信的4种解决技巧
微信是大家常用的一种社交工具,因此,当微信突然无法在iPhone上面正常运行时,就会给大家带来一些困扰,造成许多不便.那么,该如何解决这个问题?接下来就告诉您答案. 当您发现您的微信突然无法打开或者正 ...
- 微信公众号连接服务器显示404,新人请问微信测试公众号,跳转页面一直报错404...
18-11-07 14:00:37.148 ERROR [localhost-startStop-1] Error happend during start serivce! java.lang.Ru ...
- 【电脑连接wifi不能访问网页但是微信和QQ可以登录如何解决】
电脑连接wifi不能访问网页但是微信和QQ可以登录如何解决 选择WIFI,修改DNS配置 1.选择控制面板,找到连接的WLAN,右键选择"Internet协议版本4(TCP/IPV4)&qu ...
- 手机无显示如何和电脑连接服务器,手机远程连接无网电脑连接服务器
手机远程连接无网电脑连接服务器 内容精选 换一换 本节操作以Windows Server 2012操作系统的云服务器为例介绍实现多用户登录的操作步骤.Windows server2012服务器默认能够 ...
- 微信小程序开发一定要服务器么,该怎么选择小程序服务器?
因为微信用户群体广,微信小程序自从上线以来就受到用户的青睐,很多商家看准商机开始部署自己的微信小程序平台,且占据了很大的市场份额,尤其是微信小游戏和微信购物类商城很少火爆.但是很多人们对微信小程序开发 ...
- java计算机毕业设计基于安卓Android/微信小程序的电脑组装机配置商城APP
项目介绍 网络的广泛应用给生活带来了十分的便利.所以把组装机配置商城管理与现在网络相结合,利用java技术建设组装机配置商城app,实现组装机配置的信息化.则对于进一步提高组装机配置商城管理发展,丰富 ...
- fiddler对微信小程序的电脑端进行抓包,更新HTTP Debugger Pro抓包
fiddler对微信小程序的电脑端进行抓包 1.打开Fiddler,Tools-Options,如下图所示勾选 2.设置完成之后,重启Fiddler 3.抓取内容 1.打开Fiddler,Tools- ...
最新文章
- Microsoft Visual C++ Compiler for Python
- 独家 | CIKM AnalytiCup 2017冠军团队获胜经验分享(附PPT视频)
- groovy --不注意的小错误(java.lang.String.positive() is applicable)
- python标准库sys_Python标准库之Sys模块使用详解
- CVPR2019 | 弱监督图像分类建模
- 微软Azure IoT
- “球鞋一面墙,堪比一套房” 央视评炒鞋乱象:呼吁“鞋穿不炒”
- sql max同一行_SQL 打印矩阵(三)
- word批量打印助手_如何批量打印数十份甚至上百份Word文档
- 6-Hadoop之旅-Hive(二)
- linux tricks 之数据对齐。
- 螺钉 螺母 硬币三种物体的识别
- java实现图片去除底色,图片变成透明背景
- 还在用老办法扫描?纸质文档变电子文档,手机这个功能一键搞定!
- 使用毫秒单位来进行计算程序执行时间
- 软件产品上线的基础知识
- xp故障恢复控制台修复系统_自我修复系统
- 微信朋友圈怎么设置对单人开放?
- 宠物经济:吃、用、病、葬都是生意
- 华为会议终端TE10 SIP配置范例
热门文章
- 时间序列分析 23 DTW (时序相似度度量算法) 上
- 全波傅里叶算法计c语言,全周波傅里叶算法
- coreldraw的线条怎么变成圆头_CDR的一些技巧
- Linux内存管理(二):ARMv8 地址转换
- 乳酸的全球与中国市场2022-2028年:技术、参与者、趋势、市场规模及占有率研究报告
- web platform installer php,Microsoft Web Platform Installer
- eclipse、myeclipse大代码格式化 (自动对齐) 功能,太长的行会被强制换行
- 使用GPG加密通讯,设置git提交验证密钥
- python处理搜狗新闻数据_140万条
- JAVA爬取网站查询网络IP所在地