Web IM 远程及时聊天通信程序

 
 
 
 
  
  
  
  
<%@ page language="java" pageEncoding="UTF-8" %> 
  
  
  
  
<%  
  
  
  
  
String path = request.getContextPath();  
  
  
  
  
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";  
  
  
  
  
%> 
  
  
  
  
   
  
  
  
  
 
  
  
  
  
 
  
  
  
  
   
  
  
  
  
    "> 
  
  
  
  
      
  
  
  
  
     
  
  
  
  
     
  
  
  
  
     
  
  
  
  
          
  
  
  
  
     
  
  
  
  
     
  
  
  
  
     
  
  
  
  
     
  
  
  
  
     
  
  
  
  
     
  
  
  
  
        window.contextPath = "<%=path%>";  
  
  
  
  
        window["serverDomin"] = "192.168.8.22";  
  
  
  
  
     
  
  
  
  
     
  
  
  
  
     
  
  
  
  
     
  
  
  
  
     
  
  
  
  
     
  
  
  
  
     
  
  
  
  
     
  
  
  
  
     
  
  
  
  
        $(function () {  
  
  
  
  
              
  
  
  
  
            $("#login").click(function () {  
  
  
  
  
                var userName = $(":text[name='userName']").val();  
  
  
  
  
                var receiver = $("*[name='to']").val();  
  
  
  
  
                // 建立一个聊天窗口应用，并设置发送者和消息接收者  
  
  
  
  
                $.WebIM({  
  
  
  
  
                    sender: userName,  
  
  
  
  
                    receiver: receiver  
  
  
  
  
                });  
  
  
  
  
                // 登陆到openfire服务器  
  
  
  
  
                 remote.jsjac.chat.login(document.userForm);  
  
  
  
  
                 $("label").text(userName);  
  
  
  
  
                 $("form").hide();  
  
  
  
  
                 $("#newConn").show();  
  
  
  
  
            });  
  
  
  
  
              
  
  
  
  
            $("#logout").click(function () {  
  
  
  
  
                 // 退出openfire登陆，断开链接  
  
  
  
  
                 remote.jsjac.chat.logout();  
  
  
  
  
                 $("form").show();  
  
  
  
  
                 $("#newConn").hide();  
  
  
  
  
                 $("#chat").hide(800);  
  
  
  
  
            });  
  
  
  
  
              
  
  
  
  
            $("#newSession").click(function () {  
  
  
  
  
                var receiver = $("#sendTo").val();  
  
  
  
  
                // 建立一个新聊天窗口，并设置消息接收者（发送给谁？）  
  
  
  
  
                $.WebIM.newWebIM({  
  
  
  
  
                    receiver: receiver  
  
  
  
  
                });  
  
  
  
  
            });  
  
  
  
  
        });  
  
  
  
  
     
  
  
  
  
   
  
  
  
  
    
  
  
  
  
   
  
  
  
  
     
  
  
  
  
     
  
  
  
  
        userName： 
  
  
  
  
        password： 
  
  
  
  
          
  
  
  
  
        register:  
  
  
  
  
        sendTo：  
  
  
  
  
           
  
  
  
  
     
  
  
  
  
     
  
  
  
  
     
  
  
  
  
           User： 
  
  
  
  
           sendTo：  
  
  
  
  
              
  
  
  
  
            
  
  
  
  
    

下面这段代码尤为重要，它是设置你链接openfire的地址。这个地址一段错误你将无法进行通信！

 
 
 
 
  
  
  
  
  
  
  
  
  
    window.contextPath = "<%=path%>";  
  
  
  
  
    window["serverDomin"] = "192.168.8.22";  
  
  
  
  
  
 
 
 

$.WebIM方法是主函数，用它可以覆盖local.chat中的基本配置，它可以完成聊天窗口的创建。$.WebIM.newWebIM方法是新创建一个窗口，只是消息的接收者是一个新用户。

 
 
 
 
  
  
  
  
$.WebIM({  
  
  
  
  
    sender: userName,  
  
  
  
  
    receiver: receiver  
  
  
  
  
});  
  
  
  
  
   
  
  
  
  
$.WebIM.newWebIM({  
  
  
  
  
    receiver: receiver  
  
  
  
  
}); 
 
 
 

remote.jsjac.chat.login(document.userForm);方法是用户登录到Openfire服务器

参数如下：

 
 
 
 
  
  
  
  
httpbase: window.contextPath + "/JHB/", //请求后台http-bind服务器url  
  
  
  
  
domain: window["serverDomin"], //"192.168.5.231", // 192.168.5.231 当前有效域名  
  
  
  
  
username: "", // 登录用户名  
  
  
  
  
pass: "", // 密码  
  
  
  
  
timerval: 2000, // 设置请求超时  
  
  
  
  
resource: "WebIM", // 链接资源标识  
  
  
  
  
register: true // 是否注册 
 
 
 

remote.jsjac.chat.logout();是退出、断开openfire的链接

#p#

2、本地聊天应用核心代码 local.chat-2.0.js

 
 
 
 
  
  
  
  
/***  
  
  
  
  
 * jquery local chat  
  
  
  
  
 * @version v2.0   
  
  
  
  
 * @createDate -- 2012-5-28  
  
  
  
  
 * @author hoojo  
  
  
  
  
 * @email hoojo_@126.com  
  
  
  
  
 * @blog http://hoojo.cnblogs.com & http://blog.csdn.net/IBM_hoojo  
  
  
  
  
 * @requires jQuery v1.2.3 or later, send.message.editor-1.0.js  
  
  
  
  
 * Copyright (c) 2012 M. hoo  
  
  
  
  
 **/ 
  
  
  
  
   
  
  
  
  
;(function ($) {  
  
  
  
  
   
  
  
  
  
    if (/1\.(0|1|2)\.(0|1|2)/.test($.fn.jquery) || /^1.1/.test($.fn.jquery)) {  
  
  
  
  
        alert('WebIM requires jQuery v1.2.3 or later!  You are using v' + $.fn.jquery);  
  
  
  
  
        return;  
  
  
  
  
    }  
  
  
  
  
      
  
  
  
  
    var faceTimed, count = 0;  
  
  
  
  
      
  
  
  
  
    var _opts = defaultOptions = {  
  
  
  
  
        version: 2.0,  
  
  
  
  
        chat: "#chat",  
  
  
  
  
        chatEl: function () {  
  
  
  
  
            var $chat = _opts.chat;  
  
  
  
  
            if ((typeof _opts.chat) == "string") {  
  
  
  
  
                $chat = $(_opts.chat);  
  
  
  
  
            } else if ((typeof _opts.chat) == "object") {  
  
  
  
  
                if (!$chat.get(0)) {  
  
  
  
  
                    $chat = $($chat);  
  
  
  
  
                }  
  
  
  
  
            }   
  
  
  
  
            return $chat;  
  
  
  
  
        },  
  
  
  
  
        sendMessageIFrame: function (receiverId) {  
  
  
  
  
            return $("iframe[name='sendMessage" + receiverId + "']").get(0).contentWindow;  
  
  
  
  
        },  
  
  
  
  
        receiveMessageDoc: function (receiverId) {  
  
  
  
  
            receiverId = receiverId || "";  
  
  
  
  
            var docs = [];  
  
  
  
  
            $.each($("iframe[name^='receiveMessage" + receiverId + "']"), function () {  
  
  
  
  
                docs.push($(this.contentWindow.document));  
  
  
  
  
            });  
  
  
  
  
            return docs;  
  
  
  
  
            //return $($("iframe[name^='receiveMessage" + receiverId + "']").get(0).contentWindow.document);  
  
  
  
  
        },  
  
  
  
  
        sender: "", // 发送者  
  
  
  
  
        receiver: "", // 接收者  
  
  
  
  
        setTitle: function (chatEl) {  
  
  
  
  
            var receiver = this.getReceiver(chatEl);  
  
  
  
  
            chatEl.find(".title").html("和" + receiver + "聊天对话中");  
  
  
  
  
        },  
  
  
  
  
        getReceiver: function (chatEl) {  
  
  
  
  
            var receiver = chatEl.attr("receiver");  
  
  
  
  
            if (~receiver.indexOf("@")) {  
  
  
  
  
                receiver = receiver.split("@")[0];  
  
  
  
  
            }  
  
  
  
  
            return receiver;  
  
  
  
  
        },  
  
  
  
  
          
  
  
  
  
        // 接收消息iframe样式  
  
  
  
  
        receiveStyle: [  
  
  
  
  
            '',  
  
  
  
  
                '',  
  
  
  
  
                'body{border:0;margin:0;padding:3px;height:98%;cursor:text;background-color:white;font-size:12px;font-family:Courier,serif,monospace;}',  
  
  
  
  
                '.msg{margin-left: 1em;}p{margin:0;padding:0;}.me{color: blue;}.you{color:green;}',  
  
  
  
  
                '',  
  
  
  
  
                '',  
  
  
  
  
            '' 
  
  
  
  
        ].join(""),  
  
  
  
  
        writeReceiveStyle: function (receiverId) {  
  
  
  
  
            this.receiveMessageDoc(receiverId)[0].get(0).write(this.receiveStyle);  
  
  
  
  
        },  
  
  
  
  
          
  
  
  
  
        datetimeFormat: function (v) {  
  
  
  
  
            if (~~v < 10) {  
  
  
  
  
                return "0" + v;  
  
  
  
  
            }  
  
  
  
  
            return v;  
  
  
  
  
        },  
  
  
  
  
        getDatetime: function () {  
  
  
  
  
            // 设置当前发送日前  
  
  
  
  
            var date = new Date();  
  
  
  
  
            var datetime = date.getFullYear() + "-" + date.getMonth() + "-" + date.getDate();  
  
  
  
  
            datetime = " " + _opts.datetimeFormat(date.getHours())   
  
  
  
  
                        + ":" + _opts.datetimeFormat(date.getMinutes())   
  
  
  
  
                        + ":" + _opts.datetimeFormat(date.getSeconds());  
  
  
  
  
            return datetime;  
  
  
  
  
        },  
  
  
  
  
          
  
  
  
  
        /***  
  
  
  
  
         * 发送消息的格式模板                      
  
  
  
  
         * flag = true 表示当前user是自己，否则就是对方  
  
  
  
  
         **/   
  
  
  
  
        receiveMessageTpl: function (userName, styleTpl, content, flag) {  
  
  
  
  
            var userCls = flag ? "me" : "you";  
  
  
  
  
            if (styleTpl && flag) {  
  
  
  
  
                content = [ "", content, "" ].join("");  
  
  
  
  
            }  
  
  
  
  
            return [  
  
  
  
  
                '', _opts.getDatetime(), '  ', userName, ':
',  
  
  
  
  
                '', content, '
' 
  
  
  
  
            ].join("");  
  
  
  
  
        },  
  
  
  
  
          
  
  
  
  
        // 工具类按钮触发事件返回html模板  
  
  
  
  
        sendMessageStyle: {  
  
  
  
  
             cssStyle: {  
  
  
  
  
                 bold: "font-weight: bold;",  
  
  
  
  
                 underline: "text-decoration: underline;",  
  
  
  
  
                 italic: "font-style: oblique;" 
  
  
  
  
             },  
  
  
  
  
             setStyle: function (style, val) {  
  
  
  
  
                 if (val) {  
  
  
  
  
                     _opts.sendMessageStyle[style] = val;  
  
  
  
  
                 } else {  
  
  
  
  
                     var styleVal = _opts.sendMessageStyle[style];  
  
  
  
  
                     if (styleVal === undefined || !styleVal) {  
  
  
  
  
                         _opts.sendMessageStyle[style] = true;  
  
  
  
  
                     } else {  
  
  
  
  
                         _opts.sendMessageStyle[style] = false;  
  
  
  
  
                     }  
  
  
  
  
                 }  
  
  
  
  
             },  
  
  
  
  
             getStyleTpl: function () {  
  
  
  
  
                 var tpl = "";  
  
  
  
  
                 $.each(_opts.sendMessageStyle, function (style, item) {  
  
  
  
  
                     //alert(style + "#" + item + "#" + (typeof item));  
  
  
  
  
                     if (item === true) {  
  
  
  
  
                         tpl += _opts.sendMessageStyle.cssStyle[style];  
  
  
  
  
                     } else if ((typeof item) === "string") {  
  
  
  
  
                         //alert(style + "-------------" + sendMessageStyle[style]);  
  
  
  
  
                         tpl += style + ":" + item + ";";  
  
  
  
  
                     }  
  
  
  
  
                 });  
  
  
  
  
                 return tpl;  
  
  
  
  
             }  
  
  
  
  
        },  
  
  
  
  
        // 向接收消息iframe区域写消息  
  
  
  
  
        writeReceiveMessage: function (receiverId, userName, content, flag) {  
  
  
  
  
            if (content) {  
  
  
  
  
                // 发送消息的样式  
  
  
  
  
                var styleTpl = _opts.sendMessageStyle.getStyleTpl();  
  
  
  
  
                var receiveMessageDoc = _opts.receiveMessageDoc(receiverId);  
  
  
  
  
                $.each(receiveMessageDoc, function () {  
  
  
  
  
                    var $body = this.find("body");  
  
  
  
  
                    // 向接收信息区域写入发送的数据  
  
  
  
  
                    $body.append(_opts.receiveMessageTpl(userName, styleTpl, content, flag));  
  
  
  
  
                    // 滚动条滚到底部  
  
  
  
  
                    this.scrollTop(this.height());  
  
  
  
  
                });  
  
  
  
  
            }  
  
  
  
  
        },  
  
  
  
  
        // 发送消息  
  
  
  
  
        sendHandler: function ($chatMain) {  
  
  
  
  
            var doc = $chatMain.find("iframe[name^='sendMessage']").get(0).contentWindow.document;  
  
  
  
  
              
  
  
  
  
            var content = doc.body.innerHTML;  
  
  
  
  
            content = $.trim(content);  
  
  
  
  
            content = content.replace(new RegExp("
", "gm"), "");  
  
  
  
  
            // 获取即将发送的内容  
  
  
  
  
            if (content) {  
  
  
  
  
                var sender = $chatMain.attr("sender");  
  
  
  
  
                var receiverId = $chatMain.attr("id");  
  
  
  
  
                // 接收区域写消息  
  
  
  
  
                _opts.writeReceiveMessage(receiverId, sender, content, true);  
  
  
  
  
                  
  
  
  
  
                //############# XXX  
  
  
  
  
                var receiver = $chatMain.find("#to").val();  
  
  
  
  
                //var receiver = $chatMain.attr("receiver");  
  
  
  
  
                // 判断是否是手机端会话，如果是就发送纯text，否则就发送html代码  
  
  
  
  
                var flag = _opts.isMobileClient(receiver);  
  
  
  
  
                if (flag) {  
  
  
  
  
                    var text = $(doc.body).text();  
  
  
  
  
                    text = $.trim(text);  
  
  
  
  
                    if (text) {  
  
  
  
  
                        // 远程发送消息  
  
  
  
  
                        remote.jsjac.chat.sendMessage(text, receiver);  
  
  
  
  
                    }  
  
  
  
  
                } else { // 非手机端通信 可以发送html代码  
  
  
  
  
                    var styleTpl = _opts.sendMessageStyle.getStyleTpl();  
  
  
  
  
                    content = [ "", content, "" ].join("");  
  
  
  
  
                    remote.jsjac.chat.sendMessage(content, receiver);  
  
  
  
  
                }  
  
  
  
  
                  
  
  
  
  
                // 清空发送区域  
  
  
  
  
                $(doc).find("body").html("");  
  
  
  
  
            }  
  
  
  
  
        },   
  
  
  
  
          
  
  
  
  
        faceImagePath: "images/emotions/",  
  
  
  
  
        faceElTpl: function (i) {  
  
  
  
  
            return [  
  
  
  
  
                "  
  
  
  
                this.faceImagePath,  
  
  
  
  
                (i - 1),  
  
  
  
  
                "fixed.bmp' gif='",  
  
  
  
  
                this.faceImagePath,  
  
  
  
  
                (i - 1),  
  
  
  
  
                ".gif'/>" 
  
  
  
  
            ].join("");  
  
  
  
  

                网页题目：Web IM 远程及时聊天通信程序
                

                网站URL：http://www.36103.cn/qtweb/news19/37419.html
            

            

                网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等
                                
            

                广告
                
            
            

                声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：
                创新互联
            
        
        

            
猜你还喜欢下面的内容
            

                

                        如何使用Linux上的Shell脚本文件进行软件安装（linuxsh文件安装）
                    

                        Linux 掌控特殊权限的能力（linux的特殊权限）
                    

                        SQLServer2000网络连接安全性的加强
                    

                        租用香港服务器有着哪些优势
                    

                        SQLServer数据库对图像数据之存储机制
                    

                        网站服务器价格为啥区别这么大？
                    

                        Elasticsearch安装与配置指南：快速搭建高性能搜索引擎！
                    

                        Linux设备驱动程序第三版免费下载指南(linux设备驱动程序第三版下载)
                    

                        解析Perl正则表达式的形式、模式和原则
                    
                            
        
    
    

        

            
网站设计公司知识
            

                

                        python怎么读取api接口数据
                    

                        创新互联SASS教程:5-2.混合器中的CSS规则
                    

                        新加坡vps评测的方法是什么
                    

                        Git是开源的吗？——深入探索Git的开放性
                    

                        深入剖析：Linux进程的结构与原理解析（linux进程结构）
                    

                        步步高手机i管家删掉后一建加速不能用了，一用就出现vivo服务已停止服务？（总是提示清空百度加速不管用）
                    

                        系统设计 | 应用、微服务、流程、规则编排
                    

                        PSP上的模拟器怎样联机？adhocserverwindows
                    

                        服务器遇到内部错误?（服务器遇到内部错误,阻止它满足此请求)
                    

                        pythoncopy函数用法
                    

                        oracle表空间满了如何处理
                    

                        c语言用strlen函数求字符串长度
                    

                        Digium 开源实时音频和视频通信 SDKs
                    

                        轻松浏览：Linux下更佳的IMG查看工具(linuximg查看工具)
                    

                        处理Oracle数据库事务过多的困境
                    
            
        
        

            
分类信息网
            

                

                        纸箱
                    

                        小搅拌车
                    

                        水电改造
                    

                        隧道混凝土搅拌车
                    

                        宴会酒店设计
                    

                        阳台护栏
                    

                        展览展示
                    

                        自上料搅拌车
                    

                        汽车玻璃修复
                    

                        混凝土搅拌罐车
                    

                        砂岩浮雕
                    

                        橡塑保温
                    

                        LED显示屏
                    

                        搅拌罐车
                    

                        三维植被网
                    

                        高空作业车租赁
                    
            
        
    


    

        成都娃娃鱼　　 　百度关键词排名　　 　短视频拍摄　　 　成都门窗定制　　 　四川主机托管　　 　app开发　　 　清舞人间　　 　高端网站设计　　 　南充做网站　　 　成都h5网站建设　　 　成都主机托管　　 　成都网站设计　　 　泽君科技　　 　自适应网页设计　　 　香港云服务器　　 　温江做网站　　 　雕琢时光茶叶　　 　长城雪茄　　 　重庆服务器托管　　 　高端网站定制