websocket项目电子签字使用场景

场景描述：进入页面时，如果设置强制签字，发送签字webSocket连接，同时页面有个重新签字按钮，这个按钮会多次调用

第一步：先建立一个websocket的js文件，名叫signSocket.js内容如下：

/* websocket */
var socket;  
var connectStatus = false;

function Connect(){  
    try{  
        if(socket){
            socket.close();
            socket = null;
        }
        socket=new WebSocket('ws://127.0.0.1:40000');              
    }catch(e){  
        console.error("WebSocket 连接失败" ,e) 
        return;  
    }  
    socket.onopen = sOpen;  
    socket.onerror = sError;
    socket.onmessage= sMessage;
    socket.onclose= sClose;
}  
function sOpen(){
    console.info("WebSocket sOpen" ,"打开连接成功")
    connectStatus = true;
}
function sError(e){
    console.error("WebSocket sError" ,e) 
//    error("签字程序连接失败,请刷新页面再试");
    var iframe = $(document.getElementsByTagName("iframe"));
    if(iframe && iframe.length > 0){
        iframe[0].contentWindow.layer.closeAll();
//        iframe[0].contentWindow.error("签字程序连接失败,请刷新页面再试"); 
        if(iframe[0].contentWindow.signatureError){
            iframe[0].contentWindow.signatureError();
        }
    }
     socket.close();
}
function sMessage(msg){  
    console.info("WebSocket sMessage" ,msg) 
    if(isExitsFunction('ifSignatureSuccess')){
        ifSignatureSuccess(msg.data);
    }
}
function sClose(e){
    console.info("WebSocket sClose" ,e) 
    connectStatus = false;
}  

function Send(recordId, url){
    Connect();
    var intCount = 0;
    var interval = setInterval(function(){
        console.info("sockect 等待连接...")
        if(intCount++ > 20){
             clearInterval(interval);
        }
        if(connectStatus && socket){
            if(!recordId){
                socket.send("finish");
            }else{
                socket.send("open," + url + "," + recordId);
            }
            clearInterval(interval);
        }
    },100);
} 

function Close(){
    socket.close();
}
/* websocket end */

第二步：页面引用，与发送请求

<script type='text/javascript' src='${ctxStatic}/js/signSockect.js?v=2018031914'></script>

function SignatureIdByOs(id){
        console.info("当前os版本" + gs.ClientOs());
        if(gs.ClientOs().indexOf("Win") > -1){
            SignatureId(id);
        }else {
            SignatureIdApp(id);
        }
    }

    function SignatureId(id) {
//               signatureStart();
        console.info(id,'${host}${ftx}/api/disclosure?vaccid=S_' + localCode + "_" + id);
        Send(id, '${host}${ftx}/api/disclosure?vaccid=S_' + localCode + "_" + id);
    }

第三步：进入方法，返回数据给页面

@RequestMapping("/disclosure")
public String disclosure(HttpServletRequest request, String vaccid, Model model) {
   logger.info("签字获取告知书vaccid" + vaccid);
   String disContext = "";
   ...

   Map<String, String[]> args = request.getParameterMap();
   model.addAttribute("pid", "");
   model.addAttribute("childcode", "");
   model.addAttribute("currentPrice", "");
   model.addAttribute("paymentType", "");
   model.addAttribute("rid", "");
   model.addAttribute("createBy", "");
   
   if(args.get("pid") != null) model.addAttribute("pid", args.get("pid")[0]);
   if(args.get("childcode") != null) model.addAttribute("childcode", args.get("childcode")[0]);
   if(args.get("currentPrice") != null) model.addAttribute("currentPrice", args.get("currentPrice")[0]);
   if(args.get("paymentType") != null) model.addAttribute("paymentType", args.get("paymentType")[0]);
   if(args.get("rid") != null) model.addAttribute("rid", args.get("rid")[0]);
   if(args.get("createBy") != null) model.addAttribute("createBy", args.get("createBy")[0]);
   return "modules/child_vaccinaterecord/signatureShow";
}