1、实现用一个 (类索引数组 )来存储 socket 资源和对应的用户信息的方法代码。
2、实现创建服务器 socket 的方法代码如下。
3、实现服务器的主要逻辑方法代码。
4、实现服务器与客户端的交互定义 json 类型的消息格式的方法代码。
5、创建客户端方法：使用js实现事件机制来处理浏览器与服务器的交互的方法代码。
6、使用消息框 textarea 添加了一个键盘监控事件，当用户按下回车键时直接发送消息的方法代码。
两者不是一个系统，难免会有偏差。两者的代码也不一样，html只是浅浅效仿，如果说偏差很大，那可能是代码敲错了，建议及时更改。微信支持多种语言，以及手机数据网络。用户可拍摄照片或视频发送至“朋友圈”。用户可在联系人列表中选择联系人，使用云端服务将数据备份和恢复，以保护用户通讯录数据。微信中还有订阅号、服务号、企业号等功能，可以供用户订阅他们喜欢的公众号，也提供一个良好的自媒体平台，每个人都可以申请个人订阅号发布个人的文章等，用户可以透过订阅或者搜索获取微信公众号的文章，用户使用微信大部分功能都不会被收取费用。
如何在浏览器中打开IM并执行相应操作？下面以旺旺为例说明，对于QQ等原理一致。
1. 浏览器中如何判断旺旺是否已经安装,
过程如下：
(1) 打开淘宝任意店铺页面，查看源码，在亮灯旺旺图标处有如下代码：
[html] view plain copy <a href="http://amos.alicdn.com/getcid.aw?v=3&uid=%B5%D1%C9%AF%C6%EC%BD%A2%B5%EA&site=cntaobao&groupid=416517&s=1&charset=gbk" target="_blank"> <span style="white-space:pre"> </span><img border="0" alt="给我发消息" src="http://amos.alicdn.com/grponline.aw?v=3&uid=%B5%D1%C9%AF%C6%EC%BD%A2%B5%EA&site=cntaobao&gids=416517&s=1"> </a>img是旺旺图标，重点是href的内容。查看href链接的源码，如下：
[html] view plain copy <html xmlns="http://www.w3.org/1999/xhtml"> <head><title></title> </head> <body> <script src="http://www.im.alisoft.com/webim/js/website.js" > </script> <script language="javascript"> function windowClose(){ window.opener = null window.open('','_top') window.top.close() } sendClientMsg('', '', 'cntaobao', '笛莎旗舰店:25', 1, '') setTimeout('windowClose()', 1) </script> </body> </html>从源码可知这段代码做了这几件事：首先调用sendClientMsg函数，等待1秒钟，打开一个空白窗口，然后关闭之。核心是sendClientMsg函数。它位于website.js中。查看website.js的源码。改源码被混淆压缩了，为了便于查看，找个在线js格式化工具将代码重新格式化一下。这里使用了“站长工具”提供的在线js格式化工具
有这样一段函数，它首先创建一个aliimx的activeX对象，如果创建成功则说明旺旺被安装了，否则根据站点来源（淘宝中国站、阿里中国站、雅虎中国站）分别判断是否安装了其它几个版本的旺旺。源码如下：
[javascript] view plain copy function isInstalledClient(C) { try { var B = new ActiveXObject("aliimx.wangwangx") if (B != null) { return 1 } } catch(D) {} var A = getSite(C) if (A == "cntaobao") { if (newCheckWangWangInstalled() != DEFAULT_VERSION) { return 1 } } else { if (A == "cnalichn") { if (newCheckAlitalkInstalled() != DEFAULT_VERSION) { return 1 } } else { if (A == "chnyahoo") { if (newCheckYahooInstalled() != DEFAULT_VERSION) { return 1 } } else { return 0 } } } return 0 } [javascript] view plain copy function newCheckAlitalkInstalled() { var A = DEFAULT_VERSION try { var C = new ActiveXObject("AlitalkSetup.Install") if (C != null) { A = "cnalichn" } } catch(B) {} return A } function newCheckWangWangInstalled() { var A = DEFAULT_VERSION try { var C = new ActiveXObject("WangWangX.WangWangObj") if (C != null && "1.6.06.0525" != C.GetVersionStr()) { A = "cntaobao" } } catch(B) {} finally { C = null } return A } function newCheckYahooInstalled() { var A = DEFAULT_VERSION try { var C = new ActiveXObject("YahooWangWangX.WangWangObj") if (C != null) { A = "chnyahoo" } } catch(B) {} return A }为何通过
[javascript] view plain copy var B = new ActiveXObject("aliimx.wangwangx") if (B != null) { return 1 }这段代码能判断出Windows是否安装了旺旺呢？旺旺安装到Windows中之后会在注册表中写入若干条注册表项，在浏览器中通过ActiveX控件来读取注册表，如果能够找到相应的注册表项，则说明当前Windows中安装了旺旺，否则表明没有安装。调用
[javascript] view plain copynew ActiveXObject("aliimx.wangwangx")的时候浏览器会去读取注册表，在HKEY_CLASSES_ROOT下搜索aliimx.wangwangx表项，找到了则说明系统安装了阿里旺旺。
由此也可以知道，如果系统中的旺旺是未经“美化”的绿色版，浏览器不一定能够判断出它的存在。
