node.js - 如何将坐标从 node.js 服务器发送到 Leaflet.js 客户端
问题描述
我正在尝试将坐标从 node.js 和 socket.io 服务器(index.js
)发送到client.html
. 在 HTML 客户端中,Leaflet 将读取坐标。问题是,在 client.html 中无法读取坐标变量或 NaN
我尝试了一个简单的直接变量初始化,并按照 Socket.IO 页面中的教程进行操作
服务器(index.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())});
});
});
客户端 (client.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 (Number) 自 ping 数据包以来经过的毫秒数(即:延迟)。
这就是为什么msg.lat
andmsg.lon
没有定义并且无法解析的原因。
将事件名称更改为其他名称,例如fromserver
and 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'});
});
推荐阅读
- html - Vue.JS 和数字/标题
- mongodb - 尝试在 macOS 上安装 MongoDB 时“未找到类似名称的公式”
- salesforce - Account Docusign 中的收件人自定义按钮
- python - ANOVA 组间和组内自由度
- python - Nginx/PHP-FPM/Laravel 无法处理单个 IP 的并发请求
- python - 如何在 Gekko-python 中获取决策变量的值
- arrays - 如何将二维数组从 Swift 传递到 Objective-C?
- css - 如何使用 React JS 动态应用 CSS 样式?
- python - Python:IF 内的函数。问题
- node.js - 如何使用 Nodejs 而不是 bash 创建全局可用的 shell 脚本?