每次单击 HTML 和 javascript 上的按钮时,使用 TCP 向客户端发送一个值,其中每个按钮发送不同的值
Send a value to client using TCP each time click on a button on HTML and javascript, where each button sends a different value
我已经投入到我自己的项目中,以便我可以了解网络和使用网络的应用程序。但是,我目前停留在某一点上,还没有找到合适的答案。我通过 TCP 连接到远程设备。它正在监听,每次我按 A、B 或 C 时,我都想发送一个不同的整数值。我能够发送一个值,但只能发送一次,而且我也不知道如何更改它(它只发送我已经发送的值为其设置,例如 32).
比如我想A发131,B发1118,C发12819,数字是随机的,为了举例说明。
<ul id="menu">
<li class="parent"><a href="#">Encode Mode<span class="expand">»</span></a>
<ul class="child">
<li><a href="#" nowrap>A</a></li>
<li><a href="#" nowrap>B</a></li>
<li><a href="#" nowrap>C</a></li>
</ul>
</li>
</ul>
var net = require('net');
var setval = 32;
var buf = new Buffer(1024);
buf.writeInt32LE(setval, 0); //max value to send 2147483647
let client = new net.Socket();
client.connect(PORT, IP , () => {
console.log("Connected");
client.write(buf); //This will send the byte buffer over TCP
});
在您的 html-file 中,您可以使用三个不同的 ID 创建三个不同的按钮
<button id="btn1"></button>
<button id="btn2"></button>
<button id="btn3"></button>
然后在你的 js 文件 中为你的按钮创建三个不同的 eventListeners
document.getElementById("btn1").addEventListener('click', function() {
const data = {value: 131};
const options = {
method: 'POST',
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data)
};
await fetch('/startMyFunction', options);
})
其他两个具有不同值的按钮也是如此
在您的服务器端 js 文件中,您必须创建这样的函数
myFunction(val) {
var buf = new Buffer(1024);
buf.writeInt32LE(val, 0); //max value to send 2147483647
// Assumes the connection is established
client.write(buf); //This will send the byte buffer over TCP
});
}
你还必须监听路径,例如
app.post('/startMyFunction', (req, res) => {
// read the parameter out of the request body
const val = req.body.value
// Call the function with this parameter
myFunction(val);
});
代码片段(改编自)我的存储库,您可以在那里看到完整的代码
https://github.com/CreaTorAlexander/corona-motivator
我已经投入到我自己的项目中,以便我可以了解网络和使用网络的应用程序。但是,我目前停留在某一点上,还没有找到合适的答案。我通过 TCP 连接到远程设备。它正在监听,每次我按 A、B 或 C 时,我都想发送一个不同的整数值。我能够发送一个值,但只能发送一次,而且我也不知道如何更改它(它只发送我已经发送的值为其设置,例如 32).
比如我想A发131,B发1118,C发12819,数字是随机的,为了举例说明。
<ul id="menu">
<li class="parent"><a href="#">Encode Mode<span class="expand">»</span></a>
<ul class="child">
<li><a href="#" nowrap>A</a></li>
<li><a href="#" nowrap>B</a></li>
<li><a href="#" nowrap>C</a></li>
</ul>
</li>
</ul>
var net = require('net');
var setval = 32;
var buf = new Buffer(1024);
buf.writeInt32LE(setval, 0); //max value to send 2147483647
let client = new net.Socket();
client.connect(PORT, IP , () => {
console.log("Connected");
client.write(buf); //This will send the byte buffer over TCP
});
在您的 html-file 中,您可以使用三个不同的 ID 创建三个不同的按钮
<button id="btn1"></button>
<button id="btn2"></button>
<button id="btn3"></button>
然后在你的 js 文件 中为你的按钮创建三个不同的 eventListeners
document.getElementById("btn1").addEventListener('click', function() {
const data = {value: 131};
const options = {
method: 'POST',
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data)
};
await fetch('/startMyFunction', options);
})
其他两个具有不同值的按钮也是如此
在您的服务器端 js 文件中,您必须创建这样的函数
myFunction(val) {
var buf = new Buffer(1024);
buf.writeInt32LE(val, 0); //max value to send 2147483647
// Assumes the connection is established
client.write(buf); //This will send the byte buffer over TCP
});
}
你还必须监听路径,例如
app.post('/startMyFunction', (req, res) => {
// read the parameter out of the request body
const val = req.body.value
// Call the function with this parameter
myFunction(val);
});
代码片段(改编自)我的存储库,您可以在那里看到完整的代码 https://github.com/CreaTorAlexander/corona-motivator