我正在尝试从节点.js和 socket.io 服务器(index.js
)发送坐标到client.html
。在HTML客户端中,坐标将由传单读取。问题是,无法在客户端中读取坐标变量或 NaN.html
我已经尝试了一个简单的直接变量启动,并按照 Socket.IO 页面中的教程进行操作
服务器(索引.js)
var e = require('express')();
var http = require('http').Server(e);
var sio = require('socket.io')(http);
http.listen(3000);
e.get('/', function(req, res) {
res.sendFile(__dirname + '/public/client.html');
});
sio.on('connection', function(socket) {
socket.on('ping', function(msg) {
socket.emit('pong', {lat:parseFloat(35+Math.random()),lon:parseFloat(-106+Math.random())});
});
});
客户端(客户端.html)
var socket = io.connect('http://localhost:3000');
socket.on('pong', function(msg) {
console.log("Nilai msg : "+msg);
L.marker([parseFloat(msg.lat),parseFloat(msg.lon)]).addTo(map).bindPopup("("+msg.lat+","+msg.lon+")").openPopup();
var map = L.map('map', {
center: [35.10418, -106.62987],
zoom: 9
});
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png').addTo(map);
map.on("click", function(){
socket.emit('ping', {msg: 'Hello'});
});
我希望地图将显示具有相应坐标的标记,但实际输出是Error: Invalid LatLng object: (NaN, NaN)
在 socket.io 中,ping
和 pong
是保留事件,不应在应用中使用。您的浏览器在 pong
事件中收到的内容不是您所期望的:
ms(数字)自 ping 数据包以来经过的毫秒数(即:延迟)。
这就是为什么msg.lat
和msg.lon
没有定义并且无法解析的原因。
将事件名称更改为其他名称,例如fromserver
和frombrowser
,您应该很高兴:
服务器端:
io.on('connection', function(socket){
socket.on('frombrowser', function(msg){
var o = {lat:parseFloat(35+Math.random()),lon:parseFloat(-106+Math.random())};
socket.emit('fromserver', o);
});
});
客户端:
socket.on('fromserver', function(msg) {
console.log(msg);
console.log([parseFloat(msg.lat), parseFloat(msg.lon)]);
});
map.on("click", function(){
socket.emit('frombrowser', {msg: 'Hello'});
});