(百度地图)WebSocket地图实时更新位置

###问题描述
今天在公司的平台业务有一个功能需求:要求实时显示设备的地理位置在地图上,设备可能是一台汽车,而我们使用的地图是百度地图API,这样难免会涉及到实时更新位置的问题,又由于是web,http不是一个持续型的协议,所以功能上难免有点和桌面应用不一样

###公司技术选型
首先是技术选型的问题,公司平台本身是javaWeb,所以不用说基本上都是SSM和SSH这系列的框架,公司使用javaWeb同时支持RPC 和 Restfull跨平台调用,由于我们底层还要一个视频流的控制是由C++实现的,又加上整个平台操作数据库的只有JAVA,所以不可避免的会有跨语言的业务产生。

既然我们的JavaWeb支持了这么多,直接使用servlet是不现实的,所以我们的业务必须和spring完美缝合,这样才能保证不会出现其它坑

###为什么选择WebSocket?
首先:当前的平台并非是大众平台,而且企业内部使用的信息化平台,所以无需考虑浏览器的兼容性,只要告诉客户公司,你只用这些浏览器就好了,所以这为使用websocket奠定了基础

其次:是关于服务器资源的问题,如果使用大量的Ajax轮询,必然会导致一段时间内产生大量的Http请求*(要知道其实Http请求的开销也挺大的)*

再者:对方公司希望地图的数据显示尽量同步,如果使用Ajax轮询难免会造成延迟,如果我们把Ajax轮询时间间期调短,必然会使Http请求大量增加,如果调长会导致数据延迟性较大,影响用户体验

最后:spring是能完全支持webSocket的,这样也使得使用WebSocket接入平台不会挖坑

###WebSocket接入过程

1、首先我先介绍一下springmvc接入WebSocket需要准备什么
maven依赖(我主要使用的是这个,当然也有其它工具包可以使用)
(百度地图)WebSocket地图实时更新位置_第1张图片

其次我们需要编写两个类

一个是:WebSocketConfig
另一个是:SystemWebSocketHandler

WebSocketConfig:

package com.zsl.WebSocket.oth;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.EnableWebMvc;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;
import org.springframework.web.socket.WebSocketHandler;
import org.springframework.web.socket.config.annotation.EnableWebSocket;
import org.springframework.web.socket.config.annotation.WebSocketConfigurer;
import org.springframework.web.socket.config.annotation.WebSocketHandlerRegistry;

@Configuration
@EnableWebMvc
@EnableWebSocket
public class WebSocketConfig extends WebMvcConfigurerAdapter implements WebSocketConfigurer {

    //webSocket注册
    @Override
    public void registerWebSocketHandlers(WebSocketHandlerRegistry webSocketHandlerRegistry) {
        webSocketHandlerRegistry.addHandler(systemWebSocketHandler(),"/webSocketServer");
    }

    @Bean
    public WebSocketHandler systemWebSocketHandler(){
        return new SystemWebSocketHandler();
    }

}

SystemWebSocketHandler:

package com.zsl.WebSocket.oth;

import org.springframework.web.socket.*;
import java.util.ArrayList;
import java.util.Random;

public class SystemWebSocketHandler implements WebSocketHandler {

    private static final ArrayList users = new ArrayList();;

    //链接成功
    @Override
    public void afterConnectionEstablished(WebSocketSession webSocketSession) throws Exception {
        System.out.println("ConnectionEstablished");
        users.add(webSocketSession);
        webSocketSession.sendMessage(new TextMessage("链接成功!"));

    }

    //收到消息
    @Override
    public void handleMessage(WebSocketSession webSocketSession, WebSocketMessage webSocketMessage) throws Exception {
        System.out.println("handleMessage:" + webSocketMessage.toString());
        int max=175;
        int min=10;
        Random random = new Random();
        while(true) {
            int x = random.nextInt(max) % (max - min + 1) + min;
            int y = random.nextInt(max) % (max - min + 1) + min;
            System.out.println(x + "," + y);
            TextMessage msBack = new TextMessage(x + "," + y);
            webSocketSession.sendMessage(msBack);
            Thread.sleep(1000);
        }
    }

    //异常错误
    @Override
    public void handleTransportError(WebSocketSession webSocketSession, Throwable throwable) throws Exception {
        if(webSocketSession.isOpen()){
            webSocketSession.close();
        }
        users.remove(webSocketSession);
    }

    //断开链接
    @Override
    public void afterConnectionClosed(WebSocketSession webSocketSession, CloseStatus closeStatus) throws Exception {
        users.remove(webSocketSession);
    }

    @Override
    public boolean supportsPartialMessages() {
        return false;
    }


}

从代码中可以看出所有的websocket的请求路径都是在WebSocketConfig 中配置的,这个类就是我们整合Websocket和spring的配置类,我们也在这个类里面注册相应的webSocket的请求路径和对应的处理Handler,其中我们使用的注解的方式整合

在SystemWebSocketHandler中,重写的方法就是对应与websocket的处理

##我这里使用Java后台生成随机坐标然后前台通过WebSocket响应

###百度地图页面(样例)
代码:

<%@ page language="java" contentType="text/html; charset=utf-8"
         pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

    
    
    百度地图API显示多个标注点带提示的代码    
        
    
        
        
 


            

最后效果:
(百度地图)WebSocket地图实时更新位置_第2张图片

欢迎大家指出问题

你可能感兴趣的:(websocket-java)