使用场景
与服务器进行socketio通信
效果展示
socketio概念
WebSocket是HTML5最新提出的规范,虽然主流浏览器都已经支持,但仍然可能有不兼容的情况,为了兼容所有浏览器,给程序员提供一致的编程体验,SocketIO将WebSocket、AJAX和其它的通信方式全部封装成了统一的通信接口,也就是说,我们在使用SocketIO时,不用担心兼容问题,底层会自动选用最佳的通信方式。因此说,WebSocket是SocketIO的一个子集。
程序设计
结构有两种
- bs Browser/Server(浏览器/服务器)
- cs Client/Server(客户机/服务器)
我们是bcs
- b–>浏览器
- c–>autojs
- s–>服务器
b–>浏览器
浏览器负责编辑脚本内容, 编辑好之后发送给服务器
c–>autojs
autojs负责执行脚本, 脚本内容由服务器下发
s–>服务器
服务器负责接收浏览器发过来的内容, 再转发给autojs
代码讲解
浏览器
一个输入框, 一个发送按钮, 点击发送按钮后, 发送数据给服务器
var socket = io();
var form = document.getElementById("form");
var input = document.getElementById("input");
form.addEventListener("submit", function (e) {
e.preventDefault();
if (input.value) {
socket.emit("scriptToServer", input.value);
input.value = "";
}
});
autojs
- 导入dex, dex中包含socketio依赖
let dexPath = "./classes_merge.dex";
runtime.loadDex(dexPath);
- 设置定时器, 目的是不让脚本停止
setInterval(function () {}, 1000)
- 创建socket
mSocket = IO.socket("http://192.168.101.4:3000");
- 设置监听Socket.EVENT_CONNECT, 用于标识客户端身份
mSocket.on("scriptToMobile", onScriptToMobile);
function onConnect() {
mSocket.emit("I am autojs", "hello, I am autojs");
}
- 设置监听scriptToMobile, 用于获取数据
mSocket.on("scriptToMobile", onScriptToMobile);
function onScriptToMobile(scriptContent) {
engines.execScript("yashu", scriptContent[0]);
}
- 连接服务器
mSocket.connect();
服务器
- 显示主页
const app = require("express")();
const http = require("http").Server(app);
const io = require("socket.io")(http);
app.get("/", (req, res) => {
res.sendFile(__dirname + "/index.html");
});
- 设置监听scriptToServer, 并且标识autojs的socket;
收到浏览器发送的数据后, 再转发给autojs
let socketAutojs;
io.on("connection", (socket) => {
console.log("connection");
socket.on("I am autojs", (msg) => {
socketAutojs = socket;
});
socket.on("scriptToServer", (msg) => {
socketAutojs && socketAutojs.emit("scriptToMobile", msg);
});
});
总结
以上就是bcs结构, 这里只是简单的例子, socket本身还有很多情况需要处理,
- 身份标识
- 断线重连
- 异常处理
- 数据类型
- 多人聊天
- 即时通信
- 消息必达
- 连接过多
- 网络异常
- 等等等
- 大家可以看socketio官网, 添加相关代码
参考网址
socketio官网
https://socket.io/
微信公众号 AutoJsPro教程
## QQ群
747748653