随着互联网越来越深入人们的日常生活,基于网络的信息沟通变得愈发的频繁,人们已经无法满足于论坛、电邮等非即时通讯工具,更多的人们都依赖于即时通讯工具来进行网络信息沟通。桌面级即时通讯工具需要安装、配置等,使用成本比较高。而市场中页面级即时通讯工具又会有诸多的限制,并不是任何网站都能随意增加的功能。从这一出发点,论文提出一个基于HTML5新技术的通用WebIM组件,着重考虑兼容性与通用性,有效提高了组件的适用范围,让更多的网站可以引入使用基于页面的即时通讯组件。论文的研究重点在于WebIM通用组件的前端部分。研究使用HTML5、CSS3、Websocket新技术,让程序有更强的适应性,同时也考虑兼容性问题,实现良好的向前兼容。论文根据对现有可用相关技术的对比研究,选定使用Websocket通信方式作为组件的默认通信方案。在设计部分,遵循一般互联网产品的设计流程,从用户角色分析到原型设计,再到交互设计,最后是表现层结构设计和行为层结构设计。在实现部分,页面结构采用了HTML5新标签,样式重构部分采用了“渐进增强”的思想。行为层是建立在一个自研的前端库基础上来实现的。在自用库开发阶段,已经将浏览器的兼容性问题封装在开发库内部,提供了方便、统一的接口,优化了后续开发。对于不支持Websocket的浏览器,论文研究也提供了其他替代方案,采用了其他的通信模型,确保了组件的通用性。通过模拟环境对WebIM通用组件进行运行测试和验证。运行结果表明,组件功能运行良好,组件调用简单,样式可自定义程度高,所采用的Websocket通信模型实现了真正的基于网络的即时通讯。