DWR實現后台推送消息到web頁面

DWR簡介

DWR（Direct Web Remoting）可用於實現javascript直接調用java函數和后台直接調用頁面javascript代碼，后者可用作服務端推送消息到Web前端。

（服務器推送技術又稱為Comet技術，是繼AJAX后又一熱門技術）

 

以下鏈接可作簡單了解

官網

http://directwebremoting.org/dwr/

JavaDoc

http://www.directwebremoting.org/dwr/javadoc/

入門講解（前端）

http://directwebremoting.org/dwr/introduction/getting-started.html

入門講解（后台）

http://directwebremoting.org/dwr/documentation/server/javaapi.html

下載地址

http://directwebremoting.org/dwr/downloads/index.html

 

---

 

需求場景

移動端用戶向后台上傳實時坐標后，后台需通知WEB頁面在地圖上實時更新用戶位置。

 

實現過程

1、導入jar包（若用maven則添加依賴關系）

　　地址: http://directwebremoting.org/dwr/downloads/index.html

 

2、web.xml中添加servlet

<servlet>
    <servlet-name>dwr-invoker</servlet-name>
    <servlet-class>
        org.directwebremoting.servlet.DwrServlet
    </servlet-class>
    <init-param>
        <param-name>pollAndCometEnabled</param-name>
        <param-value>true</param-value>
    </init-param>
</servlet>
<servlet-mapping>
    <servlet-name>dwr-invoker</servlet-name>
    <url-pattern>/dwr/*</url-pattern>
</servlet-mapping>

 

3、編寫前端

1）頁面引入dwr相關js（無需導入js文件）

<script type='text/javascript' src='dwr/engine.js'></script> 
<script type='text/javascript' src='dwr/util.js'></script>

2）頁面初始化時初始dwr參數

$(function(){
    initDwr(); 
});
//初始化dwr
function initDwr(){ 
    dwr.engine.setActiveReverseAjax(true);  //在web.xml配置無效只好在此配置
}

3）編寫供后台調用的函數

//更新用戶位置
function updateUserLocation(userid, longitude, latitude){
    mapMarkerList[userid].setPosition(new AMap.LngLat(longitude,latitude)); //更新地圖Marker的位置
}

 

5、后台

1）編寫DwrUtil工具類

public class DwrUtil {
    /**
     * 調用頁面javascript函數
     * @param functionName
     * @param args
     */
    public void invokeJavascriptFunction (String _funcName, List _args){
        final String funcName = _funcName;
        final List args = _args;
        Browser.withAllSessions(new Runnable(){ 
            private ScriptBuffer script = new ScriptBuffer(); 
            public void run(){ 
                //拼接javascript
                script = script.appendScript(funcName+"(");
                for(int i=0; i<args.size(); i++){
                    if(i != 0){
                        script = script.appendScript(",");
                    }
                    script = script.appendData(args.get(i));
                }
                script.appendScript(")"); 
                //System.out.println(script.toString());   
                 
                Collection<ScriptSession> sessions = Browser.getTargetSessions(); 
                for (ScriptSession scriptSession : sessions){ 
                    scriptSession.addScript(script); 
                } 
            } 
        });
    }
}

2）業務邏輯中調用javascript代碼實現推送功能

@RequestMapping(value = "api/apiBaseController/testUploadLocation.do")
@ResponseBody
public AjaxJson testUploadLocation(HttpServletRequest request) {
    // 參數獲取
    String userid = request.getParameter("userid");
    String longitude = request.getParameter("longitude");
    String latitude = request.getParameter("latitude");
    //推送到web端
    DwrUtil t =  new DwrUtil();
    List args = new ArrayList();
    args.add(userid);
    args.add(longitude);
    args.add(latitude);
    t.invokeJavascriptFunction("updateUserLocation",args);
         
    AjaxJson ajaxjson = new AjaxJson();
    ajaxjson.setStatusmsg("上傳成功");
    ajaxjson.setUsermsg("上傳成功");
    return ajaxjson;
}