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 远程及时聊天通信程序
                

                分享路径：http://www.gawzjz.com/qtweb/news3/204953.html
            

            

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

                广告
                
            
            

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

            
猜你还喜欢下面的内容
            

                

                        Linux系统如何通过netstat命令查看连接数判断攻击
                    

                        虚拟主机怎么做泛解析
                    

                        如何在linux系统上安装wenlogic？(linux安装wenlogic)
                    

                        全国省市地理数据库，省市信息一网打尽(全国省市geo数据库)
                    

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

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

                        Linux下播放MP3音乐的简易方法（linux播放mp3）
                    

                        SQLServer2000网络连接安全性的加强
                    

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

        

            
微信小程序知识
            

                

                        时间戳的组成部分包括
                    

                        html如何返回顶部
                    

                        手机加密dns是关闭好还是开启好(手机加密dns什么意思？)
                    

                        国内无需备案服务器租用怎么选择
                    

                        SpringAOP中，切点有多少种定义方式？
                    

                        web应用服务器特点有哪些
                    

                        怎么解决韩国服务器访问卡顿的问题
                    

                        Linux系统下更换硬盘的操作步骤（linux更换硬盘）
                    

                        DNS入门：域名续期过程必须定期进行以保持域名活跃
                    

                        IIS入门：为游戏背景数据库实施IIS
                    

                        win10如何用bat命令行进入安全模式
                    

                        路由器电脑网络设置
                    

                        为什么iwatch睡眠监测没有数据
                    

                        上调预期：Gartner预测21年全球公有云终端用户支出增长23%
                    

                        CentOS配置https证书教程
                    
            
        
        

            
各行业网站
            

                

                        假山制作
                    

                        除甲醛
                    

                        自上料搅拌车
                    

                        边坡防护网
                    

                        软装设计
                    

                        振动盘
                    

                        门帘
                    

                        小搅拌车
                    

                        混凝土搅拌罐
                    

                        三轮搅拌车
                    

                        葡萄架
                    

                        报废汽车回收
                    

                        宴会酒店设计
                    

                        混凝土搅拌机
                    

                        砂岩浮雕
                    

                        iso认证
                    
            
        
    


    

        网站建设报价方案　　 　成都铺面装修　　 　娄底尾呼妄服装　　 　成都网站建设　　 　四川成都网站制作　　 　四川电信高防服务器托管　　 　边坡防护网　　 　上市集团网站建设　　 　眉山服务器租用　　 　成都电商网站建设方案　　 　成都移动主机托管　　 　防护网厂　　 　支点广告　　 　成都网站制作　　 　网站维护　　 　成都小程序开发公司　　 　企业画册设计制作　　 　宣传册设计　　 　南充服务器托管　　 　成都力比特