通过TCP连接串口服务器收发数据
以下是示例代码
<div class="layui-row layui-col-space5 layui-border">
<div class="layui-col-md4">
<div class="layui-form">
<div class="layui-form-item">
<label class="layui-form-label">串口号</label>
<div class="layui-input-block">
<select name="COMLI" id="COMLI" lay-verify="required">
<option value=""></option>
<option value="1">COM1</option>
<option value="2">COM2</option>
<option value="3">COM3</option>
<option value="4">COM4</option>
<option value="5">COM5</option>
<option value="6">COM6</option>
<option value="7">COM7</option>
<option value="8">COM8</option>
<option value="9">COM9</option>
<option value="10">COM10</option>
<option value="11">COM11</option>
<option value="12">COM12</option>
<option value="13">COM13</option>
<option value="14">COM14</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">波特率</label>
<div class="layui-input-block">
<select id="sbtl" lay-verify="required">
<option value="300">300</option>
<option value="600">600</option>
<option value="1200">1200</option>
<option value="2400">2400</option>
<option value="4800">4800</option>
<option value="9600">9600</option>
<option value="19200">19200</option>
<option value="38400">38400</option>
<option value="57600">57600</option>
<option value="115200" selected>115200</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">数据位</label>
<div class="layui-input-block">
<select id="ssjw" lay-verify="required">
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8" selected>8</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">校验位</label>
<div class="layui-input-block">
<select id="sjyw" lay-verify="required">
<option value="N" selected>None</option>
<option value="O">Odd</option>
<option value="E">Even</option>
<option value="M">Mark</option>
<option value="S">Space</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">停止位</label>
<div class="layui-input-block">
<select id="stzw" lay-verify="required">
<option value="1" selected>1</option><option value="2">2</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">数据格式</label>
<div class="layui-input-block">
<select id="ssjt" lay-verify="required">
<option value="HEX" selected>HEX</option>
<option value="utf-8">utf-8</option>
<option value="Unicode">Unicode</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">RTS</label>
<div class="layui-input-block">
<input type="checkbox" id="cboRTS" lay-skin="switch" lay-text="启用|不使用">
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn" id="btnCommOC">打开串口</button><br /><br />
<button class="layui-btn" id="btnWKXX">获取网卡信息</button>
</div>
</div>
</div>
</div>
<div class="layui-col-md8">
<textarea id="t_sdata" placeholder="请输入发送到串口内容" class="layui-textarea"></textarea>
<br /><button class="layui-btn" id="btnSendComm">发送数据</button>
<br /><br />
<div class="layui-form layui-form-pane">
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">收到的数据</label>
<div class="layui-input-block">
<textarea style="min-height:300px;" id="t_dataIn" placeholder="从串口接收到的数据" class="layui-textarea"></textarea>
</div>
</div></div>
</div>
</div>
<script src="/files/TCTRL.min.js"></script>
<script>
var $ = layui.jquery;
//加载系统已有端口
var tcomm = new TComm("COM1", "9600,N,8,1");
var comm_sn = "9060a7236f9a5ed7c764983a826076ebf6dfa1f115611d3934c58749de06036233bd174ef8756ec99f8b526d113733c2839427307b72ad00c6e9c18b0fa62918439522399f65257d";
tcomm.Register(comm_sn, function (dat) {
if (dat.STAT == 11) {
console.log('注册成功');
} else { }
});
//获取串口列表
tcomm.getComList(function (dat) {
if (dat.COMS.length > 0) {
$(dat.COMS).each(function (i) {
$("<option value='" + dat.COMS[i].PName.substr(3) + "'>" + dat.COMS[i].PName + "(" + dat.COMS[i].FName + ")" + "</option>").insertBefore($("#COMLI option:first"))
});
document.getElementById("COMLI").selectedIndex = 0;
layui.form.render('select');
}
});
//打开关闭串口
$("#btnCommOC").click(function () {
var btn = $(this);
if (btn.text() == "关闭串口") {
tcomm.Close();
btn.text("打开串口");
} else {
var comSet = $("#sbtl").val() + "," + $("#sjyw").val() + "," + $("#ssjw").val() + "," + $("#stzw").val();
var dataType = $("#ssjt").val();//收发数据格式(hex,utf-8,unicode)
var comNo = $("#t_tcp").val() || $("#COMLI").val();
if (comNo == "")
{
layui.layer.msg("请选择要打开的串口!");
return;
}
tcomm = new TComm(comNo
, comSet
, dataType
, 5 //读超时设置
, $("#cboRTS").is(":checked") ? 1 : 0);
tcomm.ct = "ms";
tcomm.OnDataIn = function (dat) { //接收串口返回数据
if ($("#t_dataIn").val().length > 1000)
$("#t_dataIn").val("");
if (dat.MSTAT != "") {
$("#t_dataIn").val($("#t_dataIn").val() + "\r\n串口状态:" + dat.MSTAT);
}
if (dat.data == "") return;
$("#t_dataIn").val($("#t_dataIn").val() + "\n" + dat.data);
}
tcomm.Register(comm_sn, function (dat) {
if (dat.STAT == -99) {
layui.layer.confirm("您还没有安装串口插件\n\n现在下载安装吗?",function(){
location = "/files/TCtrls.exe";
});
} else if (dat.STAT == 11) {
tcomm.init(function (ret) {
if (ret.STAT == 1) {
btn.text("关闭串口");
} else {
layui.layer.msg("打开串口失败!");
}
});
} else {
layui.layer.msg("注册失败,请与您的服务商联系!");
}
});
}
});
$("#btnSendComm").click(function () {
var sData = $("#t_sdata").val();
var dataType = $("#ssjt").val(); //收发数据格式(hex,utf-8,unicode)
tcomm.Send(sData);
});
//获取网卡信息
$("#btnWKXX").click(function () {
TGlobal.getMacInfo(function (dat) {
if (dat.STAT == -99) {
layui.layer.confirm("您还没有安装串口插件\n\n现在下载安装吗?",function(){
location = "/files/TCtrls.exe";
});
}else
$("#t_dataIn").val(JSON.stringify(dat));
});
});
</script>