基于scoket.io的移动端位置上传到服务器，在web端显示

最近由于项目需要，要将android定位的结果实时上传到服务器，并在服务器展示出来，使用scoket.io完成了整个流程。

• 首先是Adnroid端

引入scoket.io

    compile ('io.socket:socket.io-client:0.8.3') {
        exclude group: 'org.json', module: 'json'
    }

实例化和上传

private Socket mSocket;

        try {
            //1.初始化socket.io，设置链接
            mSocket = IO.socket("http://192.168.1.177:3000");
        } catch (URISyntaxException e) {
        }

        mSocket.emit("locate",  X + "," + Y);

• 服务端使用node.js将收到的信息转发出去

var app = require('express')();  
var http = require('http').Server(app);  
var io = require('socket.io')(http);  
  
app.get('/', function(req, res){  
    res.send('<h1>Welcome Realtime Server</h1>');  
});  

io.on('connection', function(socket){  
    console.log('a user connected'); 
    //监听用户发布聊天内容  
    socket.on('message', function(obj){  
        //向所有客户端广播发布的消息  
        io.emit('message', obj);  
    });  
	 //监听用户发布聊天内容  
    socket.on('locate', function(obj){  
        //向所有客户端广播发布的消息  
        io.emit('locate', obj);  
        console.log(obj);  
    });  
    
});  


http.listen(3000, function(){  
    console.log('listening on *:3000');  
});

• 前段使用scoket.io实时接收

引入scoket.io库

  <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.1.0/socket.io.dev.js"></script>

实时接收消息

var socket
    = io.connect('ws://localhost:3000');
socket.on('connect', function () {
    //连接成功
    console.log("success");
});
socket.on('disconnect', function (data) {
    //连接断开
    console.log("disconnect");
});
socket.on('locate', function (data) {
    console.log(data);
    var location=data.split(",");
    addLocation(location[0],location[1]);//自定义接收的操作
});
socket.send('helloworld!');

最终实现了，移动端实时发送定位结果，PC浏览器页面实时接收到位置信息，在局域网内测试延迟<1S。

下面给大家看一下移动端和PC端画面