webim

webim

0
评论

2017 本土开源大盘点!年度编程语言和开源项目 TOP 榜 开源 2017 码云

beyond 发表了文章 • 141 次浏览 • 2018-01-09 15:10 • 来自相关话题

摘要:年度最受国内开发者喜爱的编程语言?最受欢迎的开源项目?为你呈现最详细的国内开发者画像。




在即将过去的2017年,作为程序员的你过得怎么样呢?在这一年中你是否参与过开源项目的创建或运营?今天为大家带来最详细的本土开源现状报告,为你展现国内开发者喜爱的编程语言、最受欢迎的国内开源项目等丰富信息。

1. 国内开发者的地域分布





2. 国内开发者的性别分布
 





3. 2017 年新增756 K 开源项目——Star 数增长排行
 





4. 2017 年新增756 K 开源项目——Fork 数增长排行





5. 2017 年,更多人开始参与开源项目​





6. 国内开源项目的语言占比是什么情况?​





7. 国内开源项目的功能分类是什么情况?​





8.国内开发者最喜爱的编程语言​





9. 2017 年增速最快的语言





本文数据由 码云 2017年度数据报告 提供,码云是开源中国旗下的云端协作开发平台,上线四年来用户突破200万,托管项目近300万,已成为经过大规模部署的成熟产品。码云的社区版的私有库完全免费,企业版(5人以下免费)则提供代码托管、项目管理、文档协作的一体化开发服务,竭诚为广大本土开发者服务。 查看全部
摘要:年度最受国内开发者喜爱的编程语言?最受欢迎的开源项目?为你呈现最详细的国内开发者画像。

盘点.jpg

在即将过去的2017年,作为程序员的你过得怎么样呢?在这一年中你是否参与过开源项目的创建或运营?今天为大家带来最详细的本土开源现状报告,为你展现国内开发者喜爱的编程语言、最受欢迎的国内开源项目等丰富信息。

1. 国内开发者的地域分布


开发者.png


2. 国内开发者的性别分布
 


性别.png


3. 2017 年新增756 K 开源项目——Star 数增长排行
 


star.png


4. 2017 年新增756 K 开源项目——Fork 数增长排行


fork.png


5. 2017 年,更多人开始参与开源项目​


参与.png


6. 国内开源项目的语言占比是什么情况?​


预言.png


7. 国内开源项目的功能分类是什么情况?​


功能.png


8.国内开发者最喜爱的编程语言​


语言.png


9. 2017 年增速最快的语言


增长.png


本文数据由 码云 2017年度数据报告 提供,码云是开源中国旗下的云端协作开发平台,上线四年来用户突破200万,托管项目近300万,已成为经过大规模部署的成熟产品。码云的社区版的私有库完全免费,企业版(5人以下免费)则提供代码托管、项目管理、文档协作的一体化开发服务,竭诚为广大本土开发者服务。
0
评论

2017环信八大开源项目源码放出:两个已获融资,单个20W+关注 开源项目

beyond 发表了文章 • 445 次浏览 • 2017-12-29 14:27 • 来自相关话题

“这是一家极具极客范的公司”,来过环信公司的每一位客户都这么评价到。有着“连接人与人,连接人与商业”愿景的环信正在一步一步慢慢用技术和场景改变每个人的生活和工作。生有涯而知无涯,业有涯而心无涯,路漫漫其修远,“开源”当上下而求索!
 环信成立于2013年,公司数位联合创始人都是技术大牛出身,在Symbian,Nokia,Red Hat等知名IT公司都是开源项目的重度参与者,环信的基因便因此打上了“开源”的烙印,在2014年即创办了国内首个即时通讯云开源社区“IMGeek社区”,经过了3年多的深耕,2017年度在环信IMGeek社区涌现了数十个优质开源项目,其中两个开源项目目前已经拿到融资,更有一个项目获得了超过20W+的关注度,环信正通过即时通讯云PaaS平台和客服PaaS平台一步步完善自己的商业梦想,也在一步步的通过开源回馈自己的开发者和产业链上下游的小伙伴。




环信公司前台一角
2017年是企业服务丰收的一年,感谢伙伴们对环信一直以来的支持。18年伊始之际,我们总结了17年间基于环信开发者的八大开源项目,希望能对大家有所帮助。
 
小马直播间-开源直播APP
 
推荐理由:基于环信开发的开源直播应用,IMGeek收藏数量3W8,对于有直播需求的小伙伴们值得参考,教你从头开始开发一个移动端直播APP。
 
互联网直播平台催生了一批批网红大咖,作为程序猿,我们绝不甘于委身幕后做搬砖工,我们一定要闪亮登场!!!做一个属于我们程序猿的IOS版直播平台~~




应用截图
 实现功能:
创建推流和拉流加速集成环信IM的聊天室功能集成UCloud的ULive直播云SDK在聊天室里集成推流(录制)和拉流(播放)功能
 相关链接:http://www.imgeek.org/article/825307904​ 

Dolores-基于环信IM开发完整的企业通讯解决方案
 
推荐理由:对企业而言,初选OA办公系统是为了满足需求,解决当下问题,由于OA办公系统的在公司运作流程中扮演的重要性,安全与隐私等问题急需未雨绸缪,“可定制”、“可私有化部署”的OA办公系统成为了更多企业的首选。
 
公司想自己开发一套IM系统应该从哪里开始呢? 企业通讯录怎么保持同步呢? 企业通讯录的权限管理应该怎么做?




Dolores海报
相关链接:http://www.imgeek.org/article/825308805
 
凡信-百尺竿头更进一步,2017凡信携直播、红包而来
 
推荐理由:自凡信开源以来,更新了3个大版本,从基本聊天功能,到越来越多的开发者创建分支,累计收到了10W+的收藏,帮助了很多开发者进行开发即时通讯应用。
 
已完成功能:
单聊群聊朋友圈钱包直播红包




项目运行效果图
相关链接:http://www.imgeek.org/article/825307930
 
 Slack聊天机器人-环信客服版
 
推荐理由:17年作为人工智能元年,聊天机器人(Chatbot)在各大行业的应用方兴未艾,国外包括Facebook Messenger、Slack等均引入了聊天机器人,所以毋庸置疑,聊天机器人将成为我们未来生活中不可或缺的一部分
,IMGEEK开源社区热心开发者&朝阳区群众“晨星桑”一言不合他就花2小时写了一个Slack的聊天机器人,您可以通过这个项目在Slack上对接客户服务,并且通过一些定制开发能够看见Slack用户的基本信息(比如:昵称、电话、团队名称等),并且可以二维码支付。
相关功能:
事件订阅初始化处理消息的事件把消息发送到移动客服处理OAuth回调把收到的消息发给Slack 用户
 
相关链接:http://www.imgeek.org/article/825308711​ 
 
泛聊-厉害了我的开发者,基于环信的开源高仿QQ项目
 
推荐理由:聊天功能做到了极致,展示即时通讯基本功能的实现,包括注册登录,退出登录,联系人列表,添加好友,删除好友,收发消息,消息提醒等功能。




项目运行效果图
实现功能:
 环信SDK的集成与使用 MVP模式的运用 ORM数据库的集成与使用 模块化思想的运用
 相关链接:http://www.imgeek.org/article/825308542​ 
 
Baby-开源私密社交应用
 
推荐理由:私密社交APP,情侣、死党必备的一对一专属聊天应用。作者开发初期下载了市面上所有IM的demo源码跑一遍,从功能、集成难易和消息稳定几个方面对比,最终还是选择了环信。使用环信EaseUi集成,基本上一天就能集成完毕。




项目运行效果图
实现功能:
加入Tinker 热修复加入部分注释增加长按删除功能优化Rxbus订阅加载数据外国友人优化的一些细节增加了评论功能优化了相册加载把登陆注册事件换了个Zip操作符更符合流的思想
相关链接:http://www.imgeek.org/article/825308850

LITE-IM-环信webim的网页即时聊天

推荐理由:你见过最酷炫的WEB聊天项目,LITE-IM不仅能够担当客户服务来使用,还可以用作你网站粘连客户、活跃社区的媒介,提升用户的使用率。




项目运行效果图
[b]实现功能:[/b]
好友/群内的文字、表情、图片、文件 在线/离线消息发送和接收。查看群员列表。 面板内快速查找。 面板右键自定义事件 修改签名 自定义上传背景皮肤 搜索好友/群 添加好友/群 新建群 消息盒子展示
 相关链接:http://www.imgeek.org/article/825308961 
 
VMTVCall-使用环信3.xSDK 在 TV 端集成音视频通话功能
 
推荐理由:移动互联网方便了我们生活,移动端随时随地沟通成为了常态,今天我们推荐的是一个可以安装在电视机上进行视频通话的开源项目。




项目运行效果图
 
实现功能
项目首次启动自动注册登录拨号盘实现历史通话记录 TODO视频通话功能(因为电视不需要语音通话以及最小化)视频通话的录制通话截图
 相关链接:http://www.imgeek.org/article/825308732
 
end.
 
生有涯而知无涯,业有涯而心无涯,路漫漫其修远,当上下而求索。未来,我们还将开源更多。
 
环信IMGeek社区开源项目地址http://www.imgeek.org/code/
  查看全部
“这是一家极具极客范的公司”,来过环信公司的每一位客户都这么评价到。有着“连接人与人,连接人与商业”愿景的环信正在一步一步慢慢用技术和场景改变每个人的生活和工作。生有涯而知无涯,业有涯而心无涯,路漫漫其修远,“开源”当上下而求索!

 环信成立于2013年,公司数位联合创始人都是技术大牛出身,在Symbian,Nokia,Red Hat等知名IT公司都是开源项目的重度参与者,环信的基因便因此打上了“开源”的烙印,在2014年即创办了国内首个即时通讯云开源社区“IMGeek社区”,经过了3年多的深耕,2017年度在环信IMGeek社区涌现了数十个优质开源项目,其中两个开源项目目前已经拿到融资,更有一个项目获得了超过20W+的关注度,环信正通过即时通讯云PaaS平台和客服PaaS平台一步步完善自己的商业梦想,也在一步步的通过开源回馈自己的开发者和产业链上下游的小伙伴。

微信图片_20171229142123.jpg

环信公司前台一角


2017年是企业服务丰收的一年,感谢伙伴们对环信一直以来的支持。18年伊始之际,我们总结了17年间基于环信开发者的八大开源项目,希望能对大家有所帮助。
 
小马直播间-开源直播APP
 
推荐理由:基于环信开发的开源直播应用,IMGeek收藏数量3W8,对于有直播需求的小伙伴们值得参考,教你从头开始开发一个移动端直播APP。
 
互联网直播平台催生了一批批网红大咖,作为程序猿,我们绝不甘于委身幕后做搬砖工,我们一定要闪亮登场!!!做一个属于我们程序猿的IOS版直播平台~~

小马直播间.png

应用截图


 实现功能:
  • 创建推流和拉流加速
  • 集成环信IM的聊天室功能
  • 集成UCloud的ULive直播云SDK
  • 在聊天室里集成推流(录制)和拉流(播放)功能

 相关链接:http://www.imgeek.org/article/825307904​ 

Dolores-基于环信IM开发完整的企业通讯解决方案
 
推荐理由:对企业而言,初选OA办公系统是为了满足需求,解决当下问题,由于OA办公系统的在公司运作流程中扮演的重要性,安全与隐私等问题急需未雨绸缪,“可定制”、“可私有化部署”的OA办公系统成为了更多企业的首选。
 
公司想自己开发一套IM系统应该从哪里开始呢? 企业通讯录怎么保持同步呢? 企业通讯录的权限管理应该怎么做?

89e5f4394605d1a330e558e46e7cc6b0.jpg

Dolores海报


相关链接:http://www.imgeek.org/article/825308805
 
凡信-百尺竿头更进一步,2017凡信携直播、红包而来
 
推荐理由:自凡信开源以来,更新了3个大版本,从基本聊天功能,到越来越多的开发者创建分支,累计收到了10W+的收藏,帮助了很多开发者进行开发即时通讯应用。
 
已完成功能:
  • 单聊
  • 群聊
  • 朋友圈
  • 钱包
  • 直播
  • 红包

凡信.png

项目运行效果图


相关链接:http://www.imgeek.org/article/825307930
 
 Slack聊天机器人-环信客服版
 
推荐理由:17年作为人工智能元年,聊天机器人(Chatbot)在各大行业的应用方兴未艾,国外包括Facebook Messenger、Slack等均引入了聊天机器人,所以毋庸置疑,聊天机器人将成为我们未来生活中不可或缺的一部分
,IMGEEK开源社区热心开发者&朝阳区群众“晨星桑”一言不合他就花2小时写了一个Slack的聊天机器人,您可以通过这个项目在Slack上对接客户服务,并且通过一些定制开发能够看见Slack用户的基本信息(比如:昵称、电话、团队名称等),并且可以二维码支付。
相关功能:
  • 事件订阅初始化
  • 处理消息的事件
  • 把消息发送到移动客服
  • 处理OAuth回调
  • 把收到的消息发给Slack 用户

 
相关链接:http://www.imgeek.org/article/825308711​ 
 
泛聊-厉害了我的开发者,基于环信的开源高仿QQ项目
 
推荐理由:聊天功能做到了极致,展示即时通讯基本功能的实现,包括注册登录,退出登录,联系人列表,添加好友,删除好友,收发消息,消息提醒等功能。

泛聊.png

项目运行效果图


实现功能:
  •  环信SDK的集成与使用
  •  MVP模式的运用
  •  ORM数据库的集成与使用
  •  模块化思想的运用

 相关链接:http://www.imgeek.org/article/825308542​ 
 
Baby-开源私密社交应用
 
推荐理由:私密社交APP,情侣、死党必备的一对一专属聊天应用。作者开发初期下载了市面上所有IM的demo源码跑一遍,从功能、集成难易和消息稳定几个方面对比,最终还是选择了环信。使用环信EaseUi集成,基本上一天就能集成完毕。

baby.png

项目运行效果图


实现功能:
  • 加入Tinker 热修复
  • 加入部分注释
  • 增加长按删除功能
  • 优化Rxbus订阅加载数据
  • 外国友人优化的一些细节
  • 增加了评论功能
  • 优化了相册加载
  • 把登陆注册事件换了个Zip操作符更符合流的思想

相关链接:http://www.imgeek.org/article/825308850

LITE-IM-环信webim的网页即时聊天

推荐理由:你见过最酷炫的WEB聊天项目,LITE-IM不仅能够担当客户服务来使用,还可以用作你网站粘连客户、活跃社区的媒介,提升用户的使用率。

lym.png

项目运行效果图


[b]实现功能:[/b]
  • 好友/群内的文字、表情、图片、文件 在线/离线消息发送和接收。
  • 查看群员列表。 
  • 面板内快速查找。 
  • 面板右键自定义事件 
  • 修改签名 
  • 自定义上传背景皮肤 
  • 搜索好友/群 
  • 添加好友/群 
  • 新建群 
  • 消息盒子展示

 相关链接:http://www.imgeek.org/article/825308961 
 
VMTVCall-使用环信3.xSDK 在 TV 端集成音视频通话功能
 
推荐理由:移动互联网方便了我们生活,移动端随时随地沟通成为了常态,今天我们推荐的是一个可以安装在电视机上进行视频通话的开源项目。

电视机.jpg

项目运行效果图


 
实现功能
  • 项目首次启动自动注册登录
  • 拨号盘实现
  • 历史通话记录 TODO
  • 视频通话功能(因为电视不需要语音通话以及最小化)
  • 视频通话的录制
  • 通话截图

 相关链接:http://www.imgeek.org/article/825308732
 
end.
 
生有涯而知无涯,业有涯而心无涯,路漫漫其修远,当上下而求索。未来,我们还将开源更多。
 
环信IMGeek社区开源项目地址http://www.imgeek.org/code/
 
7
回复

收集基于环信SDK开发的开源项目 开源项目

回眸淡然笑 回复了问题 • 9 人关注 • 5029 次浏览 • 2017-12-03 00:50 • 来自相关话题

8
评论

【新手快速入门】集成环信常见问题+解决方案汇总 常见问题

dujiepeng 发表了文章 • 9164 次浏览 • 2017-05-22 15:51 • 来自相关话题

   这里整理了集成环信的常见问题和一些功能的实现思路,希望能帮助到大家。感谢热心的开发者贡献,大家在观看过程中有不明白的地方欢迎直接跟帖咨询。
 
ios篇
APNs证书创建和上传到环信后台头像昵称的简述和处理方案音视频离线推送Demo实现环信服务器聊天记录保存多久?离线收不到好友请求IOS中环信聊天窗口如何实现文件发送和预览的功能ios集成常见问题环信推送的一些常见问题实现名片|红包|话题聊天室等自定义cell
 
Android篇
环信3.0SDK集成小米推送教程EaseUI库中V4、v7包冲突解决方案Android EaseUI里的百度地图替换为高德地图android扩展消息(名片集成)关于会话列表的置顶聊天java.lang.UnsatisfiedLinkError: 的问题android 端 app 后台被杀死收不到消息的解决方案
昵称头像篇
android中如何显示开发者服务器上的昵称和头像 Android中显示头像(接上一篇文章看)环信(Android)设置头像和昵称的方法(最简单暴力的基于环信demo的集成)IOS中如何显示开发者服务器上的昵称和头像【环信公开课第12期视频回放】-所有关于环信IM昵称头像的问题听这课就够了
 
直播篇
一言不合你就搞个直播APP
 
客服集成
IM-SDK和客服SDK并存开发指南—Android篇IM-SDK和客服SDK并存开发指南—iOS篇
 
开源项目
Android简版demoios简版demo凡信2.0:超仿微信的开源项目 凡信3.0:携直播和红包而来高仿微信:Github 3,515 Star方圆十里:环信编程大赛冠军项目泛聊:定一个小目标写一个QQSlack聊天机器人:一天时间做一个聊天机器人TV视频通话:在电视上视频通话视频通话:Android手机视频通话酷信:ios高仿微信公众号助手:与订阅用户聊天沟通
 
持续更新ing...小伙伴们还有什么想知道欢迎跟帖提出。
  查看全部
   这里整理了集成环信的常见问题和一些功能的实现思路,希望能帮助到大家。感谢热心的开发者贡献,大家在观看过程中有不明白的地方欢迎直接跟帖咨询。
 
ios篇

 
Android篇

昵称头像篇

 
直播篇
  1. 一言不合你就搞个直播APP

 
客服集成
  1. IM-SDK和客服SDK并存开发指南—Android篇
  2. IM-SDK和客服SDK并存开发指南—iOS篇

 
开源项目

 
持续更新ing...小伙伴们还有什么想知道欢迎跟帖提出。
 
0
回复

web im页面怎么写环信的登录的监听事件,求大神指点 webim

回复

仙人掌 发起了问题 • 1 人关注 • 49 次浏览 • 2018-01-16 11:16 • 来自相关话题

0
回复

chrome 连接webim 连接不上 webim

回复

zengwj 发起了问题 • 1 人关注 • 303 次浏览 • 2017-12-05 15:17 • 来自相关话题

2
评论

基于layim+环信webim的网页即时聊天 LITE-IM LITE_IM webim layim 即时通信 网页聊天

回眸淡然笑 发表了文章 • 517 次浏览 • 2017-12-03 00:55 • 来自相关话题

什么是LITE-IM?LITE-IM是一款基于 环信webim3.X 和 layim 开发而成的WEB即时通讯,并且完全的免费和开源 。LITE-IM使用 拥有高并发,长连接永不掉线的即时通讯的行业领头羊环信作为通信介质,再搭配上拥有丰富前端交互的layim,让你能够快速的搭建一个现代化的、高度稳定的web即时通讯。

LITE-IM不仅能够担当客户服务来使用,还可以用作你网站粘连客户、活跃社区的媒介,提升用户的使用率。当然LITE-IM还有许多有待完善之处。
 
目前已完成的功能有:
好友/群内的文字、表情、图片、文件 在线/离线消息发送和接收。查看群员列表。 面板内快速查找。 面板右键自定义事件 修改签名 自定义上传背景皮肤 搜索好友/群 添加好友/群 新建群 消息盒子展示查看/修改个人信息实时获取好友在线状态挤下线提醒增删改 好友/好友分组群管理(增删管理员/修改群名片/单个群员禁言解除禁言/踢人)

部分截图如下
 
好友聊天界面

自定义上传皮肤

群组

自定义右键

消息盒子

好友

 
 LITE-IM在线体验地址:test.guoshanchina.com

体验帐号:
用户名:911088 密码:123456

用户名:1570855 密码:123456

用户名:1570845 密码:123456

用户名:911058 密码:123456

用户名:910992 密码:123456

用户名:911067 密码:123456

用户名:911100 密码:123456

用户名:911085 密码:123456

 github源码:https://github.com/shmilylbelva/webim 查看全部
什么是LITE-IM?
LITE-IM是一款基于 环信webim3.X 和 layim 开发而成的WEB即时通讯,并且完全的免费和开源 。LITE-IM使用 拥有高并发,长连接永不掉线的即时通讯的行业领头羊环信作为通信介质,再搭配上拥有丰富前端交互的layim,让你能够快速的搭建一个现代化的、高度稳定的web即时通讯。

LITE-IM不仅能够担当客户服务来使用,还可以用作你网站粘连客户、活跃社区的媒介,提升用户的使用率。当然LITE-IM还有许多有待完善之处。

 
目前已完成的功能有:

  1. 好友/群内的文字、表情、图片、文件 在线/离线消息发送和接收。
  2. 查看群员列表。 
  3. 面板内快速查找。 
  4. 面板右键自定义事件 
  5. 修改签名 
  6. 自定义上传背景皮肤 
  7. 搜索好友/群 
  8. 添加好友/群 
  9. 新建群 
  10. 消息盒子展示
  11. 查看/修改个人信息
  12. 实时获取好友在线状态
  13. 挤下线提醒
  14. 增删改 好友/好友分组
  15. 群管理(增删管理员/修改群名片/单个群员禁言解除禁言/踢人)



部分截图如下
 
好友聊天界面


自定义上传皮肤


群组


自定义右键


消息盒子


好友


 
 LITE-IM在线体验地址:test.guoshanchina.com

体验帐号:

用户名:911088 密码:123456

用户名:1570855 密码:123456

用户名:1570845 密码:123456

用户名:911058 密码:123456

用户名:910992 密码:123456

用户名:911067 密码:123456

用户名:911100 密码:123456

用户名:911085 密码:123456



 github源码:https://github.com/shmilylbelva/webim
3
评论

基于环信webIM提供的Demo改造 webim 自动登录 聊天记录 头像 昵称 显示

__kaven™、 发表了文章 • 254 次浏览 • 2017-11-17 14:44 • 来自相关话题

本效果图是基于webIM的demo版本修改,主要实现了以下功能
1.实现自动登录,到聊天窗口
    解决办法:是在页面自己写参数调用 Demo.conn.open(options) 方法

2.实现最近联系人列表渲染(因为我们没有好友概念,只要跟谁最近聊天了,就算是好友了)
    解决办法:在页面通过ajax调用后台restFul地址获取联系人,然后循环调用 Demo.conn.onTextMessage(msg)方法,将消息内容为空,在msg里面设置标识为初始化加载,这样就会出现在列表里面

3.实现联系人:头像、昵称 渲染
   解决办法:很简单就是在刚才上面的方法体里面调用完之后,你的列表就会出现好友列表,这时候你只需要根据环信用户id,直接基于jq替换即可

4.实现点击联系人 渲染历史聊天记录(在发送消息的时候将聊天记录保存在我们自己的数据库)
   解决办法:在你获取最近联系人这个方法时已经返回了聊天记录列表,你需要在(Demo.chatRecord.环信用户id.messages)这个数组里面把你的消息放在这个数据里面去,然后当用户点击联系人列表时你jq写一个(webim-contact-item)这个样式的click触发方法,在这个方法中你需要写把聊天记录从(Demo.chatRecord.环信用户id.messages) 循环取出来,包装成HTML然后在  $("#wrapper"+Demo.selected).append() 这些HTML即可

5.实现保存聊天
    解决办法:就是在 sendTxt里面调用我们的ajax方法保存
大致就这么多,个人不建议基于官方的webIM的Demo 去修改,这次踩过这个坑了

欢迎各位 集成的朋友来访,目前我这个算是解决,等过段时间我还是自己写一个吧,不打算基于他们的Demo去改造
在此欢迎去我的博客:   www.kaven.cn 查看全部
本效果图是基于webIM的demo版本修改,主要实现了以下功能
1.实现自动登录,到聊天窗口
    解决办法:是在页面自己写参数调用 Demo.conn.open(options) 方法

2.实现最近联系人列表渲染(因为我们没有好友概念,只要跟谁最近聊天了,就算是好友了)
    解决办法:在页面通过ajax调用后台restFul地址获取联系人,然后循环调用 Demo.conn.onTextMessage(msg)方法,将消息内容为空,在msg里面设置标识为初始化加载,这样就会出现在列表里面

3.实现联系人:头像、昵称 渲染
   解决办法:很简单就是在刚才上面的方法体里面调用完之后,你的列表就会出现好友列表,这时候你只需要根据环信用户id,直接基于jq替换即可

4.实现点击联系人 渲染历史聊天记录(在发送消息的时候将聊天记录保存在我们自己的数据库)
   解决办法:在你获取最近联系人这个方法时已经返回了聊天记录列表,你需要在(Demo.chatRecord.环信用户id.messages)这个数组里面把你的消息放在这个数据里面去,然后当用户点击联系人列表时你jq写一个(webim-contact-item)这个样式的click触发方法,在这个方法中你需要写把聊天记录从(Demo.chatRecord.环信用户id.messages) 循环取出来,包装成HTML然后在  $("#wrapper"+Demo.selected).append() 这些HTML即可

5.实现保存聊天
    解决办法:就是在 sendTxt里面调用我们的ajax方法保存
大致就这么多,个人不建议基于官方的webIM的Demo 去修改,这次踩过这个坑了

欢迎各位 集成的朋友来访,目前我这个算是解决,等过段时间我还是自己写一个吧,不打算基于他们的Demo去改造
在此欢迎去我的博客:   www.kaven.cn
0
回复

webIM 连接 webim

回复

空白 也只是昨天的记忆 发起了问题 • 1 人关注 • 208 次浏览 • 2017-11-14 17:23 • 来自相关话题

8
评论

Vue-cli整合环信WebIM webim vue vuejs

魂之挽歌 发表了文章 • 867 次浏览 • 2017-10-11 17:34 • 来自相关话题

[b]今天碰到了一个问题,就是conn.listen里面的函数没法执行,目前不知道怎么解决[/b]baidu下,这个好像是不支持js严格模式下的调用,看来不行了,希望有大神来改造下
回调函数的参数都是报错TypeError: 'caller' and 'arguments' are restricted function properties and cannot be accessed in this context.

 
 由于准备做一个社交性的网站,(暂时不考虑app),前端使用的vuejs+vux,使用vue-cli安装,发现环信有提供react的整合,并没有vuejs版本的,只好自己来动手, 由于是第一次用vuejs开发,硬着头皮来,各种import 都是不行,strophe这个js是个自执行的闭包函数,网上各种搜也没有找到方法,也尝试过直接在index.html引入并执行,但是打包的时候会报错,摸索了一个星期(主要是生手加上头脑简单), 今天找到了不报XXX未定义之类的,打包也正常。可能有朋友用得到,提供一个思路,我暂时只想到了这样,希望有比我简单快捷的方法
 
1.  官方的  npm install easemob-websdk --save
 
2.  npm install strophe.js (这里注意加上.js)
 
3.找到node_modules/easemob-websdk/src/connection.js
在里面引入strophe.js, 我是在第二行假的
var Strophe = require('../../strophe.js').Strophe;





 
然后再大约667行左右加入config 定义





并在4205行左右使用这个定义





 
4. 找到node_modules/strophe.js/strophe.js
大约在2883行左右加入两个函数





 
 
好了,现在基本上可以像vuejs那样使用了
 

























  查看全部
[b]今天碰到了一个问题,就是conn.listen里面的函数没法执行,目前不知道怎么解决[/b]
baidu下,这个好像是不支持js严格模式下的调用,看来不行了,希望有大神来改造下
回调函数的参数都是报错
TypeError: 'caller' and 'arguments' are restricted function properties and cannot be accessed in this context.

 


 由于准备做一个社交性的网站,(暂时不考虑app),前端使用的vuejs+vux,使用vue-cli安装,发现环信有提供react的整合,并没有vuejs版本的,只好自己来动手, 由于是第一次用vuejs开发,硬着头皮来,各种import 都是不行,strophe这个js是个自执行的闭包函数,网上各种搜也没有找到方法,也尝试过直接在index.html引入并执行,但是打包的时候会报错,摸索了一个星期(主要是生手加上头脑简单), 今天找到了不报XXX未定义之类的,打包也正常。可能有朋友用得到,提供一个思路,我暂时只想到了这样,希望有比我简单快捷的方法
 
1.  官方的  npm install easemob-websdk --save
 
2.  npm install strophe.js (这里注意加上.js)
 
3.找到node_modules/easemob-websdk/src/connection.js
在里面引入strophe.js, 我是在第二行假的
var Strophe = require('../../strophe.js').Strophe;

1.png

 
然后再大约667行左右加入config 定义

2.png

并在4205行左右使用这个定义

3.png

 
4. 找到node_modules/strophe.js/strophe.js
大约在2883行左右加入两个函数

4.png

 
 
好了,现在基本上可以像vuejs那样使用了
 

5.png


6.png


7.png


8.png


9.png

 
4
评论

环信WebIM2.0版本发布,专为移动端H5打造的通讯SDK webim h5 产品更新

产品更新 发表了文章 • 351 次浏览 • 2017-09-22 18:18 • 来自相关话题

十年磨一剑 砺得梅花香
-献给在一线开发程序员们 
经过了长达三个月的封闭开发,环信WebIM2.0版本在9月22号发布,此次更新的WebIM2.0也被称为“H5版本”,一套Demo同时支持PC和H5,自适应微信/QQ和各种手机浏览器。
 
WebIM 2.0 (webim-h5) 在1.x的基础上, 主要做了以下更新:
响应式布局, 一套Demo同时支持PC和H5,自适应不同终端屏幕尺寸完全基于Reac + Redux的单向数据流引入ant-design组件库,方便开发者后续开发适配微信/QQ和各种手机浏览器
 
webim-h5在线体验地址:https://webim-h5.easemob.com
 
安装1.初始化安装
在/demo下执行 npm i
2.如果需要同时编辑sdk cd sdk && npm link && cd .. && npm link easemob-websdk
3.如果需要同时编辑webrtc cd webrtc && npm link && cd .. && npm link easemob-webrtc
4.运行demo
cd demo && npm start (requires node@>=6)
http://localhost:3001
cd demo && HTTPS=true npm start (webrtc supports HTTPS only)
https://localhost:3001
5.发布demo cd demo && npm run build /demo/build 目录下的就是可以运行和部署的版本执行npm start时如果出现```
./src/config/WebIM.js
Module not found: Can't resolve 'easemob-websdk/dist/strophe-1.2.8-g.js' in '<YourRootDir>/demo/src/config'
```FIX: 没有执行 npm link easemob-websdk
 
3. 执行npm start时如果出现> node scripts/start.js

/Users/wenke/www/web-im/demo/scripts/start.js:23
const {
^

SyntaxError: Unexpected token {
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:373:25)
at Object.Module._extensions..js (module.js:416:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Function.Module.runMain (module.js:441:10)
at startup (node.js:139:18)
at node.js:974:3FIX: 请检查node版本是否是v6.0+
 
4. Redux State 的数据结构如下:{
// ---------------------------------
// 响应式断点
// ---------------------------------
//xs: "480px"
//sm: "768px"
//md: "992px"
//lg: "1200px"
//xl: "1600px"
breakpoint: {
xs: false,
sm: false,
md: false,
lg: false,
xl: false
},

// ---------------------------------
// UI相关
// ---------------------------------
common: {
fetching: false,
isGetGroupAlready: true,
isGetChatRoomAlready: false,
showGroupRequestModal: false //群主管理加入群消息
},

// ---------------------------------
// 用户登录信息
// ---------------------------------
login: {
username: 'sunylt',
password: null,
token: "YWMtZ0m-opwTEeeS-e0Ko59rsU1-S6DcShHjkNXh_7qs2vV",
fetching: false,
error: false
isLogin: true,
},

// ---------------------------------
// 多语言
// ---------------------------------
i18n: {

// 已配置语言
translations: {
cn: {},
us: {},
},

// 当前语言
locale: "cn"
},


// 注册信息,没进行注册操作为{}
register: {
username: "123abcdbb",
password: "123",
fetching: false,
registerError: null
},

// 预留 暂无用
contacts: {}

// 预留 暂无用
im: {}

// ---------------------------------
// 数据实体
// ---------------------------------
entities: {
// 好友
roster: {
byName: {
name: { subscription,jid, ask, name, groups }
...
},
names: ['lwz2' ...],
// 好友列表在此,因为好友列表来源于roster,息息相关
friends: ,
},
// 群组
group: {
loadingFailed: <Boolean>,
isLoading: <Booleadn>,
rightSiderOffset: <Number>, //控制右侧群组管理面板
byId: {
groupId: {groupid, groupname},
....
},
names: [groupName_#-#_groupId, ....]
},
// 聊天室
chatroom: {
byId: {
chatId: {chatId, name, owner, affiliations_count}
...
},
names: [chatName_#-#_chatId, ....]
},
// 陌生人
stranger: {
},

// 群组成员信息
groupMember: {
groupId: {
muted: {byName: {}},//群主可见,禁言列表
byName: {
name: {name: <String: name>, affiliation: 'member'}
},
names: ,
admins: , //群管理员可见
},
...
}

// 订阅通知
subscribe: {
byFrom: {}
},

// 黑名单列表
blacklist: {
byName: {}
name:
},

// 消息
message: {

// 所有消息
byId: {
mid: {"type":"chat|groupchat|chatroom|stranger|error", "chatId": <String: chatId>},
...
}

// 单聊消息列表
chat: {
chatId: [
{message},
...
]
},

// 群组消息列表
groupChat: {
chatId: [
{message},
...
]
},

// 聊天室消息列表
chatroom: {
chatId: [
{message},
...
]
},

// 陌生人消息列表
stranger: {
chatId: [
{message},
...
]
},

// 预留 暂无用
extra: {}

// 未读消息记录
unread: {
// 好友
chat: {
chatId: <Number: unreadNum>,
...
},
// 群组
groupchat: {
chatId: <Number: unreadNum>,
...
},
// 聊天室
chatroom: {
chatId: <Number: unreadNum>,
...
},
// 陌生人
stranger: {
chatId: <Number: unreadNum>,
...
}
}

// 自己发的消息mid跟本地id对照
byMid: {
messageId: {id: <String: localId>},
...
},
},

// 加入群申请
groupRequest: {
byGid: {}
}
}
} 查看全部
十年磨一剑 砺得梅花香
-献给在一线开发程序员们
 
经过了长达三个月的封闭开发,环信WebIM2.0版本在9月22号发布,此次更新的WebIM2.0也被称为“H5版本”,一套Demo同时支持PC和H5,自适应微信/QQ和各种手机浏览器。
 
WebIM 2.0 (webim-h5) 在1.x的基础上, 主要做了以下更新:
  • 响应式布局, 一套Demo同时支持PC和H5,自适应不同终端屏幕尺寸
  • 完全基于Reac + Redux的单向数据流
  • 引入ant-design组件库,方便开发者后续开发
  • 适配微信/QQ和各种手机浏览器

 
webim-h5在线体验地址:https://webim-h5.easemob.com
 
安装
1.初始化安装
在/demo下执行 npm i
2.如果需要同时编辑sdk cd sdk && npm link && cd .. && npm link easemob-websdk
3.如果需要同时编辑webrtc cd webrtc && npm link && cd .. && npm link easemob-webrtc
4.运行demo
cd demo && npm start (requires node@>=6)
http://localhost:3001
cd demo && HTTPS=true npm start (webrtc supports HTTPS only)
https://localhost:3001
5.发布demo cd demo && npm run build /demo/build 目录下的就是可以运行和部署的版本
执行npm start时如果出现
```
./src/config/WebIM.js
Module not found: Can't resolve 'easemob-websdk/dist/strophe-1.2.8-g.js' in '<YourRootDir>/demo/src/config'
```
FIX: 没有执行 npm link easemob-websdk
 
3. 执行npm start时如果出现
> node scripts/start.js

/Users/wenke/www/web-im/demo/scripts/start.js:23
const {
^

SyntaxError: Unexpected token {
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:373:25)
at Object.Module._extensions..js (module.js:416:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Function.Module.runMain (module.js:441:10)
at startup (node.js:139:18)
at node.js:974:3
FIX: 请检查node版本是否是v6.0+
 
4. Redux State 的数据结构如下:
{
// ---------------------------------
// 响应式断点
// ---------------------------------
//xs: "480px"
//sm: "768px"
//md: "992px"
//lg: "1200px"
//xl: "1600px"
breakpoint: {
xs: false,
sm: false,
md: false,
lg: false,
xl: false
},

// ---------------------------------
// UI相关
// ---------------------------------
common: {
fetching: false,
isGetGroupAlready: true,
isGetChatRoomAlready: false,
showGroupRequestModal: false //群主管理加入群消息
},

// ---------------------------------
// 用户登录信息
// ---------------------------------
login: {
username: 'sunylt',
password: null,
token: "YWMtZ0m-opwTEeeS-e0Ko59rsU1-S6DcShHjkNXh_7qs2vV",
fetching: false,
error: false
isLogin: true,
},

// ---------------------------------
// 多语言
// ---------------------------------
i18n: {

// 已配置语言
translations: {
cn: {},
us: {},
},

// 当前语言
locale: "cn"
},


// 注册信息,没进行注册操作为{}
register: {
username: "123abcdbb",
password: "123",
fetching: false,
registerError: null
},

// 预留 暂无用
contacts: {}

// 预留 暂无用
im: {}

// ---------------------------------
// 数据实体
// ---------------------------------
entities: {
// 好友
roster: {
byName: {
name: { subscription,jid, ask, name, groups }
...
},
names: ['lwz2' ...],
// 好友列表在此,因为好友列表来源于roster,息息相关
friends: ,
},
// 群组
group: {
loadingFailed: <Boolean>,
isLoading: <Booleadn>,
rightSiderOffset: <Number>, //控制右侧群组管理面板
byId: {
groupId: {groupid, groupname},
....
},
names: [groupName_#-#_groupId, ....]
},
// 聊天室
chatroom: {
byId: {
chatId: {chatId, name, owner, affiliations_count}
...
},
names: [chatName_#-#_chatId, ....]
},
// 陌生人
stranger: {
},

// 群组成员信息
groupMember: {
groupId: {
muted: {byName: {}},//群主可见,禁言列表
byName: {
name: {name: <String: name>, affiliation: 'member'}
},
names: ,
admins: , //群管理员可见
},
...
}

// 订阅通知
subscribe: {
byFrom: {}
},

// 黑名单列表
blacklist: {
byName: {}
name:
},

// 消息
message: {

// 所有消息
byId: {
mid: {"type":"chat|groupchat|chatroom|stranger|error", "chatId": <String: chatId>},
...
}

// 单聊消息列表
chat: {
chatId: [
{message},
...
]
},

// 群组消息列表
groupChat: {
chatId: [
{message},
...
]
},

// 聊天室消息列表
chatroom: {
chatId: [
{message},
...
]
},

// 陌生人消息列表
stranger: {
chatId: [
{message},
...
]
},

// 预留 暂无用
extra: {}

// 未读消息记录
unread: {
// 好友
chat: {
chatId: <Number: unreadNum>,
...
},
// 群组
groupchat: {
chatId: <Number: unreadNum>,
...
},
// 聊天室
chatroom: {
chatId: <Number: unreadNum>,
...
},
// 陌生人
stranger: {
chatId: <Number: unreadNum>,
...
}
}

// 自己发的消息mid跟本地id对照
byMid: {
messageId: {id: <String: localId>},
...
},
},

// 加入群申请
groupRequest: {
byGid: {}
}
}
}
0
回复

webIM reactnative 如何修改群昵称? react_native webim

回复

leslieliu 发起了问题 • 1 人关注 • 310 次浏览 • 2017-08-25 11:25 • 来自相关话题

0
回复

web im集成后,发送消息成功的回调函数不执行 webim

回复

kidoo1012 发起了问题 • 1 人关注 • 323 次浏览 • 2017-06-25 23:28 • 来自相关话题

0
回复

WEBIM中发送图片如何通过BASE64编码或者APP中地址路径来发送 webim

回复

cjy1002 发起了问题 • 1 人关注 • 265 次浏览 • 2017-06-12 09:59 • 来自相关话题

4
回复

偶尔出现不明错误Error in connection establishment: net::net::<unknown> webim

木云落 回复了问题 • 3 人关注 • 1098 次浏览 • 2017-05-27 13:09 • 来自相关话题

0
回复

环信WEBIm的那个coolkie是在哪里生成的?我重新生成COOKIE都不起效?看我下面的截图 webim

回复

lzf520 发起了问题 • 1 人关注 • 317 次浏览 • 2017-05-19 09:14 • 来自相关话题

2
回复

为什么webim按照开发文档写TOKEN登录的时候 conn.open(options)报错? webim

lzf520 回复了问题 • 2 人关注 • 248 次浏览 • 2017-05-18 15:12 • 来自相关话题

0
回复

webIM webim

回复

苜宝小叔 发起了问题 • 1 人关注 • 296 次浏览 • 2017-05-03 14:06 • 来自相关话题

0
回复

webim集成 webim

回复

时间不等人❀ 发起了问题 • 1 人关注 • 306 次浏览 • 2017-05-02 10:17 • 来自相关话题

1
回复

web im webim

回复

时间不等人❀ 回复了问题 • 1 人关注 • 254 次浏览 • 2017-05-02 10:01 • 来自相关话题

1
回复
3
回复

webim 收到消息后strophe.Websocket.prototype._onMessage 能被调用,handleMessage 没被调用 WebIM API webim

wansheg 回复了问题 • 2 人关注 • 466 次浏览 • 2017-04-10 15:46 • 来自相关话题

1
回复

webim发送cmd消息 如何定义? 环信_WebIM webim

木云落 回复了问题 • 2 人关注 • 322 次浏览 • 2017-04-10 12:49 • 来自相关话题

1
回复

webim在demo中如何获取自己服务器的头像和昵称? 头像 昵称 扩展 环信_WebIM 昵称 头像 webim

环信沈冲 回复了问题 • 2 人关注 • 558 次浏览 • 2017-03-24 14:12 • 来自相关话题

1
回复

web IM 回调事件为何触发了两次 webim

zhangyb 回复了问题 • 2 人关注 • 373 次浏览 • 2017-03-22 17:13 • 来自相关话题

1
回复

我的电脑是x201i,win10,使用webim,点击联系人为什么聊天窗不见了 webim系统设配 webim

zhangyb 回复了问题 • 2 人关注 • 327 次浏览 • 2017-03-14 11:24 • 来自相关话题

2
最佳

环信服务端集成,如何集成? iOS Android webim

执念 回复了问题 • 3 人关注 • 3169 次浏览 • 2017-03-13 11:36 • 来自相关话题

3
回复

webim在登录系统时同时登录环信账号,登录成功跳转其他页面时失败 提示登录失败 跳转页面时登录失败 webim

zhangyb 回复了问题 • 4 人关注 • 1539 次浏览 • 2017-03-05 22:14 • 来自相关话题

2
回复

amr 音频 webim播放问题 arm 音频 webim

lizg 回复了问题 • 2 人关注 • 584 次浏览 • 2017-02-15 16:44 • 来自相关话题

条新动态, 点击查看
zl

zl 回答了问题 • 2016-02-17 14:17 • 1 个回复 不感兴趣

webIM如何通过图片路径发送图片

赞同来自:

用hbuider ,构建hybird app,使用环信webIM作为Im通讯,发送图片遇到问题,纯浏览器中使用webIM是可以用选图片的方式直接调相机拍照的,但是混合app的话,用的是三方封装的api来调的手机系统拍照,在混合中webIM纯JS调用相机功能不可... 显示全部 »
用hbuider ,构建hybird app,使用环信webIM作为Im通讯,发送图片遇到问题,纯浏览器中使用webIM是可以用选图片的方式直接调相机拍照的,但是混合app的话,用的是三方封装的api来调的手机系统拍照,在混合中webIM纯JS调用相机功能不可用,但是三方封装的api调用后拿到的是图片路径,而webIM发送图片用的是表单,是通过inputid来取的图片对象,发的时候是发的表单数据,这个表单获取图片对象是sdk中封装的,通过路径获取的图片对象和表单获取的不一样,没法直接用,对SDK的改动比较大。

----------------解决方案:可以调rest api 上传 , 上传成功后调用web sdk 的sendPictureMessage方法
 
lizg

lizg 回答了问题 • 2016-06-12 19:01 • 1 个回复 不感兴趣

webim发送的图片,多久会删除?

赞同来自:

webim发送图片是先上传到服务器,服务器保存14天
webim发送图片是先上传到服务器,服务器保存14天
lizg

lizg 回答了问题 • 2016-07-25 19:14 • 1 个回复 不感兴趣

webim加入聊天室406

赞同来自:

获取一下聊天室详情,看下是不是成员满了
获取一下聊天室详情,看下是不是成员满了
环信沈冲

环信沈冲 回答了问题 • 2016-12-26 14:32 • 2 个回复 不感兴趣

环信服务端集成,如何集成?

赞同来自:

客户端直接集成SDK即可,服务端可以根据自己需求调用相应的rest接口集成
客户端直接集成SDK即可,服务端可以根据自己需求调用相应的rest接口集成
0
评论

2017 本土开源大盘点!年度编程语言和开源项目 TOP 榜 开源 2017 码云

beyond 发表了文章 • 141 次浏览 • 2018-01-09 15:10 • 来自相关话题

摘要:年度最受国内开发者喜爱的编程语言?最受欢迎的开源项目?为你呈现最详细的国内开发者画像。




在即将过去的2017年,作为程序员的你过得怎么样呢?在这一年中你是否参与过开源项目的创建或运营?今天为大家带来最详细的本土开源现状报告,为你展现国内开发者喜爱的编程语言、最受欢迎的国内开源项目等丰富信息。

1. 国内开发者的地域分布





2. 国内开发者的性别分布
 





3. 2017 年新增756 K 开源项目——Star 数增长排行
 





4. 2017 年新增756 K 开源项目——Fork 数增长排行





5. 2017 年,更多人开始参与开源项目​





6. 国内开源项目的语言占比是什么情况?​





7. 国内开源项目的功能分类是什么情况?​





8.国内开发者最喜爱的编程语言​





9. 2017 年增速最快的语言





本文数据由 码云 2017年度数据报告 提供,码云是开源中国旗下的云端协作开发平台,上线四年来用户突破200万,托管项目近300万,已成为经过大规模部署的成熟产品。码云的社区版的私有库完全免费,企业版(5人以下免费)则提供代码托管、项目管理、文档协作的一体化开发服务,竭诚为广大本土开发者服务。 查看全部
摘要:年度最受国内开发者喜爱的编程语言?最受欢迎的开源项目?为你呈现最详细的国内开发者画像。

盘点.jpg

在即将过去的2017年,作为程序员的你过得怎么样呢?在这一年中你是否参与过开源项目的创建或运营?今天为大家带来最详细的本土开源现状报告,为你展现国内开发者喜爱的编程语言、最受欢迎的国内开源项目等丰富信息。

1. 国内开发者的地域分布


开发者.png


2. 国内开发者的性别分布
 


性别.png


3. 2017 年新增756 K 开源项目——Star 数增长排行
 


star.png


4. 2017 年新增756 K 开源项目——Fork 数增长排行


fork.png


5. 2017 年,更多人开始参与开源项目​


参与.png


6. 国内开源项目的语言占比是什么情况?​


预言.png


7. 国内开源项目的功能分类是什么情况?​


功能.png


8.国内开发者最喜爱的编程语言​


语言.png


9. 2017 年增速最快的语言


增长.png


本文数据由 码云 2017年度数据报告 提供,码云是开源中国旗下的云端协作开发平台,上线四年来用户突破200万,托管项目近300万,已成为经过大规模部署的成熟产品。码云的社区版的私有库完全免费,企业版(5人以下免费)则提供代码托管、项目管理、文档协作的一体化开发服务,竭诚为广大本土开发者服务。
0
评论

2017环信八大开源项目源码放出:两个已获融资,单个20W+关注 开源项目

beyond 发表了文章 • 445 次浏览 • 2017-12-29 14:27 • 来自相关话题

“这是一家极具极客范的公司”,来过环信公司的每一位客户都这么评价到。有着“连接人与人,连接人与商业”愿景的环信正在一步一步慢慢用技术和场景改变每个人的生活和工作。生有涯而知无涯,业有涯而心无涯,路漫漫其修远,“开源”当上下而求索!
 环信成立于2013年,公司数位联合创始人都是技术大牛出身,在Symbian,Nokia,Red Hat等知名IT公司都是开源项目的重度参与者,环信的基因便因此打上了“开源”的烙印,在2014年即创办了国内首个即时通讯云开源社区“IMGeek社区”,经过了3年多的深耕,2017年度在环信IMGeek社区涌现了数十个优质开源项目,其中两个开源项目目前已经拿到融资,更有一个项目获得了超过20W+的关注度,环信正通过即时通讯云PaaS平台和客服PaaS平台一步步完善自己的商业梦想,也在一步步的通过开源回馈自己的开发者和产业链上下游的小伙伴。




环信公司前台一角
2017年是企业服务丰收的一年,感谢伙伴们对环信一直以来的支持。18年伊始之际,我们总结了17年间基于环信开发者的八大开源项目,希望能对大家有所帮助。
 
小马直播间-开源直播APP
 
推荐理由:基于环信开发的开源直播应用,IMGeek收藏数量3W8,对于有直播需求的小伙伴们值得参考,教你从头开始开发一个移动端直播APP。
 
互联网直播平台催生了一批批网红大咖,作为程序猿,我们绝不甘于委身幕后做搬砖工,我们一定要闪亮登场!!!做一个属于我们程序猿的IOS版直播平台~~




应用截图
 实现功能:
创建推流和拉流加速集成环信IM的聊天室功能集成UCloud的ULive直播云SDK在聊天室里集成推流(录制)和拉流(播放)功能
 相关链接:http://www.imgeek.org/article/825307904​ 

Dolores-基于环信IM开发完整的企业通讯解决方案
 
推荐理由:对企业而言,初选OA办公系统是为了满足需求,解决当下问题,由于OA办公系统的在公司运作流程中扮演的重要性,安全与隐私等问题急需未雨绸缪,“可定制”、“可私有化部署”的OA办公系统成为了更多企业的首选。
 
公司想自己开发一套IM系统应该从哪里开始呢? 企业通讯录怎么保持同步呢? 企业通讯录的权限管理应该怎么做?




Dolores海报
相关链接:http://www.imgeek.org/article/825308805
 
凡信-百尺竿头更进一步,2017凡信携直播、红包而来
 
推荐理由:自凡信开源以来,更新了3个大版本,从基本聊天功能,到越来越多的开发者创建分支,累计收到了10W+的收藏,帮助了很多开发者进行开发即时通讯应用。
 
已完成功能:
单聊群聊朋友圈钱包直播红包




项目运行效果图
相关链接:http://www.imgeek.org/article/825307930
 
 Slack聊天机器人-环信客服版
 
推荐理由:17年作为人工智能元年,聊天机器人(Chatbot)在各大行业的应用方兴未艾,国外包括Facebook Messenger、Slack等均引入了聊天机器人,所以毋庸置疑,聊天机器人将成为我们未来生活中不可或缺的一部分
,IMGEEK开源社区热心开发者&朝阳区群众“晨星桑”一言不合他就花2小时写了一个Slack的聊天机器人,您可以通过这个项目在Slack上对接客户服务,并且通过一些定制开发能够看见Slack用户的基本信息(比如:昵称、电话、团队名称等),并且可以二维码支付。
相关功能:
事件订阅初始化处理消息的事件把消息发送到移动客服处理OAuth回调把收到的消息发给Slack 用户
 
相关链接:http://www.imgeek.org/article/825308711​ 
 
泛聊-厉害了我的开发者,基于环信的开源高仿QQ项目
 
推荐理由:聊天功能做到了极致,展示即时通讯基本功能的实现,包括注册登录,退出登录,联系人列表,添加好友,删除好友,收发消息,消息提醒等功能。




项目运行效果图
实现功能:
 环信SDK的集成与使用 MVP模式的运用 ORM数据库的集成与使用 模块化思想的运用
 相关链接:http://www.imgeek.org/article/825308542​ 
 
Baby-开源私密社交应用
 
推荐理由:私密社交APP,情侣、死党必备的一对一专属聊天应用。作者开发初期下载了市面上所有IM的demo源码跑一遍,从功能、集成难易和消息稳定几个方面对比,最终还是选择了环信。使用环信EaseUi集成,基本上一天就能集成完毕。




项目运行效果图
实现功能:
加入Tinker 热修复加入部分注释增加长按删除功能优化Rxbus订阅加载数据外国友人优化的一些细节增加了评论功能优化了相册加载把登陆注册事件换了个Zip操作符更符合流的思想
相关链接:http://www.imgeek.org/article/825308850

LITE-IM-环信webim的网页即时聊天

推荐理由:你见过最酷炫的WEB聊天项目,LITE-IM不仅能够担当客户服务来使用,还可以用作你网站粘连客户、活跃社区的媒介,提升用户的使用率。




项目运行效果图
[b]实现功能:[/b]
好友/群内的文字、表情、图片、文件 在线/离线消息发送和接收。查看群员列表。 面板内快速查找。 面板右键自定义事件 修改签名 自定义上传背景皮肤 搜索好友/群 添加好友/群 新建群 消息盒子展示
 相关链接:http://www.imgeek.org/article/825308961 
 
VMTVCall-使用环信3.xSDK 在 TV 端集成音视频通话功能
 
推荐理由:移动互联网方便了我们生活,移动端随时随地沟通成为了常态,今天我们推荐的是一个可以安装在电视机上进行视频通话的开源项目。




项目运行效果图
 
实现功能
项目首次启动自动注册登录拨号盘实现历史通话记录 TODO视频通话功能(因为电视不需要语音通话以及最小化)视频通话的录制通话截图
 相关链接:http://www.imgeek.org/article/825308732
 
end.
 
生有涯而知无涯,业有涯而心无涯,路漫漫其修远,当上下而求索。未来,我们还将开源更多。
 
环信IMGeek社区开源项目地址http://www.imgeek.org/code/
  查看全部
“这是一家极具极客范的公司”,来过环信公司的每一位客户都这么评价到。有着“连接人与人,连接人与商业”愿景的环信正在一步一步慢慢用技术和场景改变每个人的生活和工作。生有涯而知无涯,业有涯而心无涯,路漫漫其修远,“开源”当上下而求索!

 环信成立于2013年,公司数位联合创始人都是技术大牛出身,在Symbian,Nokia,Red Hat等知名IT公司都是开源项目的重度参与者,环信的基因便因此打上了“开源”的烙印,在2014年即创办了国内首个即时通讯云开源社区“IMGeek社区”,经过了3年多的深耕,2017年度在环信IMGeek社区涌现了数十个优质开源项目,其中两个开源项目目前已经拿到融资,更有一个项目获得了超过20W+的关注度,环信正通过即时通讯云PaaS平台和客服PaaS平台一步步完善自己的商业梦想,也在一步步的通过开源回馈自己的开发者和产业链上下游的小伙伴。

微信图片_20171229142123.jpg

环信公司前台一角


2017年是企业服务丰收的一年,感谢伙伴们对环信一直以来的支持。18年伊始之际,我们总结了17年间基于环信开发者的八大开源项目,希望能对大家有所帮助。
 
小马直播间-开源直播APP
 
推荐理由:基于环信开发的开源直播应用,IMGeek收藏数量3W8,对于有直播需求的小伙伴们值得参考,教你从头开始开发一个移动端直播APP。
 
互联网直播平台催生了一批批网红大咖,作为程序猿,我们绝不甘于委身幕后做搬砖工,我们一定要闪亮登场!!!做一个属于我们程序猿的IOS版直播平台~~

小马直播间.png

应用截图


 实现功能:
  • 创建推流和拉流加速
  • 集成环信IM的聊天室功能
  • 集成UCloud的ULive直播云SDK
  • 在聊天室里集成推流(录制)和拉流(播放)功能

 相关链接:http://www.imgeek.org/article/825307904​ 

Dolores-基于环信IM开发完整的企业通讯解决方案
 
推荐理由:对企业而言,初选OA办公系统是为了满足需求,解决当下问题,由于OA办公系统的在公司运作流程中扮演的重要性,安全与隐私等问题急需未雨绸缪,“可定制”、“可私有化部署”的OA办公系统成为了更多企业的首选。
 
公司想自己开发一套IM系统应该从哪里开始呢? 企业通讯录怎么保持同步呢? 企业通讯录的权限管理应该怎么做?

89e5f4394605d1a330e558e46e7cc6b0.jpg

Dolores海报


相关链接:http://www.imgeek.org/article/825308805
 
凡信-百尺竿头更进一步,2017凡信携直播、红包而来
 
推荐理由:自凡信开源以来,更新了3个大版本,从基本聊天功能,到越来越多的开发者创建分支,累计收到了10W+的收藏,帮助了很多开发者进行开发即时通讯应用。
 
已完成功能:
  • 单聊
  • 群聊
  • 朋友圈
  • 钱包
  • 直播
  • 红包

凡信.png

项目运行效果图


相关链接:http://www.imgeek.org/article/825307930
 
 Slack聊天机器人-环信客服版
 
推荐理由:17年作为人工智能元年,聊天机器人(Chatbot)在各大行业的应用方兴未艾,国外包括Facebook Messenger、Slack等均引入了聊天机器人,所以毋庸置疑,聊天机器人将成为我们未来生活中不可或缺的一部分
,IMGEEK开源社区热心开发者&朝阳区群众“晨星桑”一言不合他就花2小时写了一个Slack的聊天机器人,您可以通过这个项目在Slack上对接客户服务,并且通过一些定制开发能够看见Slack用户的基本信息(比如:昵称、电话、团队名称等),并且可以二维码支付。
相关功能:
  • 事件订阅初始化
  • 处理消息的事件
  • 把消息发送到移动客服
  • 处理OAuth回调
  • 把收到的消息发给Slack 用户

 
相关链接:http://www.imgeek.org/article/825308711​ 
 
泛聊-厉害了我的开发者,基于环信的开源高仿QQ项目
 
推荐理由:聊天功能做到了极致,展示即时通讯基本功能的实现,包括注册登录,退出登录,联系人列表,添加好友,删除好友,收发消息,消息提醒等功能。

泛聊.png

项目运行效果图


实现功能:
  •  环信SDK的集成与使用
  •  MVP模式的运用
  •  ORM数据库的集成与使用
  •  模块化思想的运用

 相关链接:http://www.imgeek.org/article/825308542​ 
 
Baby-开源私密社交应用
 
推荐理由:私密社交APP,情侣、死党必备的一对一专属聊天应用。作者开发初期下载了市面上所有IM的demo源码跑一遍,从功能、集成难易和消息稳定几个方面对比,最终还是选择了环信。使用环信EaseUi集成,基本上一天就能集成完毕。

baby.png

项目运行效果图


实现功能:
  • 加入Tinker 热修复
  • 加入部分注释
  • 增加长按删除功能
  • 优化Rxbus订阅加载数据
  • 外国友人优化的一些细节
  • 增加了评论功能
  • 优化了相册加载
  • 把登陆注册事件换了个Zip操作符更符合流的思想

相关链接:http://www.imgeek.org/article/825308850

LITE-IM-环信webim的网页即时聊天

推荐理由:你见过最酷炫的WEB聊天项目,LITE-IM不仅能够担当客户服务来使用,还可以用作你网站粘连客户、活跃社区的媒介,提升用户的使用率。

lym.png

项目运行效果图


[b]实现功能:[/b]
  • 好友/群内的文字、表情、图片、文件 在线/离线消息发送和接收。
  • 查看群员列表。 
  • 面板内快速查找。 
  • 面板右键自定义事件 
  • 修改签名 
  • 自定义上传背景皮肤 
  • 搜索好友/群 
  • 添加好友/群 
  • 新建群 
  • 消息盒子展示

 相关链接:http://www.imgeek.org/article/825308961 
 
VMTVCall-使用环信3.xSDK 在 TV 端集成音视频通话功能
 
推荐理由:移动互联网方便了我们生活,移动端随时随地沟通成为了常态,今天我们推荐的是一个可以安装在电视机上进行视频通话的开源项目。

电视机.jpg

项目运行效果图


 
实现功能
  • 项目首次启动自动注册登录
  • 拨号盘实现
  • 历史通话记录 TODO
  • 视频通话功能(因为电视不需要语音通话以及最小化)
  • 视频通话的录制
  • 通话截图

 相关链接:http://www.imgeek.org/article/825308732
 
end.
 
生有涯而知无涯,业有涯而心无涯,路漫漫其修远,当上下而求索。未来,我们还将开源更多。
 
环信IMGeek社区开源项目地址http://www.imgeek.org/code/
 
8
评论

【新手快速入门】集成环信常见问题+解决方案汇总 常见问题

dujiepeng 发表了文章 • 9164 次浏览 • 2017-05-22 15:51 • 来自相关话题

   这里整理了集成环信的常见问题和一些功能的实现思路,希望能帮助到大家。感谢热心的开发者贡献,大家在观看过程中有不明白的地方欢迎直接跟帖咨询。
 
ios篇
APNs证书创建和上传到环信后台头像昵称的简述和处理方案音视频离线推送Demo实现环信服务器聊天记录保存多久?离线收不到好友请求IOS中环信聊天窗口如何实现文件发送和预览的功能ios集成常见问题环信推送的一些常见问题实现名片|红包|话题聊天室等自定义cell
 
Android篇
环信3.0SDK集成小米推送教程EaseUI库中V4、v7包冲突解决方案Android EaseUI里的百度地图替换为高德地图android扩展消息(名片集成)关于会话列表的置顶聊天java.lang.UnsatisfiedLinkError: 的问题android 端 app 后台被杀死收不到消息的解决方案
昵称头像篇
android中如何显示开发者服务器上的昵称和头像 Android中显示头像(接上一篇文章看)环信(Android)设置头像和昵称的方法(最简单暴力的基于环信demo的集成)IOS中如何显示开发者服务器上的昵称和头像【环信公开课第12期视频回放】-所有关于环信IM昵称头像的问题听这课就够了
 
直播篇
一言不合你就搞个直播APP
 
客服集成
IM-SDK和客服SDK并存开发指南—Android篇IM-SDK和客服SDK并存开发指南—iOS篇
 
开源项目
Android简版demoios简版demo凡信2.0:超仿微信的开源项目 凡信3.0:携直播和红包而来高仿微信:Github 3,515 Star方圆十里:环信编程大赛冠军项目泛聊:定一个小目标写一个QQSlack聊天机器人:一天时间做一个聊天机器人TV视频通话:在电视上视频通话视频通话:Android手机视频通话酷信:ios高仿微信公众号助手:与订阅用户聊天沟通
 
持续更新ing...小伙伴们还有什么想知道欢迎跟帖提出。
  查看全部
   这里整理了集成环信的常见问题和一些功能的实现思路,希望能帮助到大家。感谢热心的开发者贡献,大家在观看过程中有不明白的地方欢迎直接跟帖咨询。
 
ios篇

 
Android篇

昵称头像篇

 
直播篇
  1. 一言不合你就搞个直播APP

 
客服集成
  1. IM-SDK和客服SDK并存开发指南—Android篇
  2. IM-SDK和客服SDK并存开发指南—iOS篇

 
开源项目

 
持续更新ing...小伙伴们还有什么想知道欢迎跟帖提出。
 
7
回复

收集基于环信SDK开发的开源项目 开源项目

回眸淡然笑 回复了问题 • 9 人关注 • 5029 次浏览 • 2017-12-03 00:50 • 来自相关话题

0
评论

2017 本土开源大盘点!年度编程语言和开源项目 TOP 榜 开源 2017 码云

beyond 发表了文章 • 141 次浏览 • 2018-01-09 15:10 • 来自相关话题

摘要:年度最受国内开发者喜爱的编程语言?最受欢迎的开源项目?为你呈现最详细的国内开发者画像。




在即将过去的2017年,作为程序员的你过得怎么样呢?在这一年中你是否参与过开源项目的创建或运营?今天为大家带来最详细的本土开源现状报告,为你展现国内开发者喜爱的编程语言、最受欢迎的国内开源项目等丰富信息。

1. 国内开发者的地域分布





2. 国内开发者的性别分布
 





3. 2017 年新增756 K 开源项目——Star 数增长排行
 





4. 2017 年新增756 K 开源项目——Fork 数增长排行





5. 2017 年,更多人开始参与开源项目​





6. 国内开源项目的语言占比是什么情况?​





7. 国内开源项目的功能分类是什么情况?​





8.国内开发者最喜爱的编程语言​





9. 2017 年增速最快的语言





本文数据由 码云 2017年度数据报告 提供,码云是开源中国旗下的云端协作开发平台,上线四年来用户突破200万,托管项目近300万,已成为经过大规模部署的成熟产品。码云的社区版的私有库完全免费,企业版(5人以下免费)则提供代码托管、项目管理、文档协作的一体化开发服务,竭诚为广大本土开发者服务。 查看全部
摘要:年度最受国内开发者喜爱的编程语言?最受欢迎的开源项目?为你呈现最详细的国内开发者画像。

盘点.jpg

在即将过去的2017年,作为程序员的你过得怎么样呢?在这一年中你是否参与过开源项目的创建或运营?今天为大家带来最详细的本土开源现状报告,为你展现国内开发者喜爱的编程语言、最受欢迎的国内开源项目等丰富信息。

1. 国内开发者的地域分布


开发者.png


2. 国内开发者的性别分布
 


性别.png


3. 2017 年新增756 K 开源项目——Star 数增长排行
 


star.png


4. 2017 年新增756 K 开源项目——Fork 数增长排行


fork.png


5. 2017 年,更多人开始参与开源项目​


参与.png


6. 国内开源项目的语言占比是什么情况?​


预言.png


7. 国内开源项目的功能分类是什么情况?​


功能.png


8.国内开发者最喜爱的编程语言​


语言.png


9. 2017 年增速最快的语言


增长.png


本文数据由 码云 2017年度数据报告 提供,码云是开源中国旗下的云端协作开发平台,上线四年来用户突破200万,托管项目近300万,已成为经过大规模部署的成熟产品。码云的社区版的私有库完全免费,企业版(5人以下免费)则提供代码托管、项目管理、文档协作的一体化开发服务,竭诚为广大本土开发者服务。
0
评论

2017环信八大开源项目源码放出:两个已获融资,单个20W+关注 开源项目

beyond 发表了文章 • 445 次浏览 • 2017-12-29 14:27 • 来自相关话题

“这是一家极具极客范的公司”,来过环信公司的每一位客户都这么评价到。有着“连接人与人,连接人与商业”愿景的环信正在一步一步慢慢用技术和场景改变每个人的生活和工作。生有涯而知无涯,业有涯而心无涯,路漫漫其修远,“开源”当上下而求索!
 环信成立于2013年,公司数位联合创始人都是技术大牛出身,在Symbian,Nokia,Red Hat等知名IT公司都是开源项目的重度参与者,环信的基因便因此打上了“开源”的烙印,在2014年即创办了国内首个即时通讯云开源社区“IMGeek社区”,经过了3年多的深耕,2017年度在环信IMGeek社区涌现了数十个优质开源项目,其中两个开源项目目前已经拿到融资,更有一个项目获得了超过20W+的关注度,环信正通过即时通讯云PaaS平台和客服PaaS平台一步步完善自己的商业梦想,也在一步步的通过开源回馈自己的开发者和产业链上下游的小伙伴。




环信公司前台一角
2017年是企业服务丰收的一年,感谢伙伴们对环信一直以来的支持。18年伊始之际,我们总结了17年间基于环信开发者的八大开源项目,希望能对大家有所帮助。
 
小马直播间-开源直播APP
 
推荐理由:基于环信开发的开源直播应用,IMGeek收藏数量3W8,对于有直播需求的小伙伴们值得参考,教你从头开始开发一个移动端直播APP。
 
互联网直播平台催生了一批批网红大咖,作为程序猿,我们绝不甘于委身幕后做搬砖工,我们一定要闪亮登场!!!做一个属于我们程序猿的IOS版直播平台~~




应用截图
 实现功能:
创建推流和拉流加速集成环信IM的聊天室功能集成UCloud的ULive直播云SDK在聊天室里集成推流(录制)和拉流(播放)功能
 相关链接:http://www.imgeek.org/article/825307904​ 

Dolores-基于环信IM开发完整的企业通讯解决方案
 
推荐理由:对企业而言,初选OA办公系统是为了满足需求,解决当下问题,由于OA办公系统的在公司运作流程中扮演的重要性,安全与隐私等问题急需未雨绸缪,“可定制”、“可私有化部署”的OA办公系统成为了更多企业的首选。
 
公司想自己开发一套IM系统应该从哪里开始呢? 企业通讯录怎么保持同步呢? 企业通讯录的权限管理应该怎么做?




Dolores海报
相关链接:http://www.imgeek.org/article/825308805
 
凡信-百尺竿头更进一步,2017凡信携直播、红包而来
 
推荐理由:自凡信开源以来,更新了3个大版本,从基本聊天功能,到越来越多的开发者创建分支,累计收到了10W+的收藏,帮助了很多开发者进行开发即时通讯应用。
 
已完成功能:
单聊群聊朋友圈钱包直播红包




项目运行效果图
相关链接:http://www.imgeek.org/article/825307930
 
 Slack聊天机器人-环信客服版
 
推荐理由:17年作为人工智能元年,聊天机器人(Chatbot)在各大行业的应用方兴未艾,国外包括Facebook Messenger、Slack等均引入了聊天机器人,所以毋庸置疑,聊天机器人将成为我们未来生活中不可或缺的一部分
,IMGEEK开源社区热心开发者&朝阳区群众“晨星桑”一言不合他就花2小时写了一个Slack的聊天机器人,您可以通过这个项目在Slack上对接客户服务,并且通过一些定制开发能够看见Slack用户的基本信息(比如:昵称、电话、团队名称等),并且可以二维码支付。
相关功能:
事件订阅初始化处理消息的事件把消息发送到移动客服处理OAuth回调把收到的消息发给Slack 用户
 
相关链接:http://www.imgeek.org/article/825308711​ 
 
泛聊-厉害了我的开发者,基于环信的开源高仿QQ项目
 
推荐理由:聊天功能做到了极致,展示即时通讯基本功能的实现,包括注册登录,退出登录,联系人列表,添加好友,删除好友,收发消息,消息提醒等功能。




项目运行效果图
实现功能:
 环信SDK的集成与使用 MVP模式的运用 ORM数据库的集成与使用 模块化思想的运用
 相关链接:http://www.imgeek.org/article/825308542​ 
 
Baby-开源私密社交应用
 
推荐理由:私密社交APP,情侣、死党必备的一对一专属聊天应用。作者开发初期下载了市面上所有IM的demo源码跑一遍,从功能、集成难易和消息稳定几个方面对比,最终还是选择了环信。使用环信EaseUi集成,基本上一天就能集成完毕。




项目运行效果图
实现功能:
加入Tinker 热修复加入部分注释增加长按删除功能优化Rxbus订阅加载数据外国友人优化的一些细节增加了评论功能优化了相册加载把登陆注册事件换了个Zip操作符更符合流的思想
相关链接:http://www.imgeek.org/article/825308850

LITE-IM-环信webim的网页即时聊天

推荐理由:你见过最酷炫的WEB聊天项目,LITE-IM不仅能够担当客户服务来使用,还可以用作你网站粘连客户、活跃社区的媒介,提升用户的使用率。




项目运行效果图
[b]实现功能:[/b]
好友/群内的文字、表情、图片、文件 在线/离线消息发送和接收。查看群员列表。 面板内快速查找。 面板右键自定义事件 修改签名 自定义上传背景皮肤 搜索好友/群 添加好友/群 新建群 消息盒子展示
 相关链接:http://www.imgeek.org/article/825308961 
 
VMTVCall-使用环信3.xSDK 在 TV 端集成音视频通话功能
 
推荐理由:移动互联网方便了我们生活,移动端随时随地沟通成为了常态,今天我们推荐的是一个可以安装在电视机上进行视频通话的开源项目。




项目运行效果图
 
实现功能
项目首次启动自动注册登录拨号盘实现历史通话记录 TODO视频通话功能(因为电视不需要语音通话以及最小化)视频通话的录制通话截图
 相关链接:http://www.imgeek.org/article/825308732
 
end.
 
生有涯而知无涯,业有涯而心无涯,路漫漫其修远,当上下而求索。未来,我们还将开源更多。
 
环信IMGeek社区开源项目地址http://www.imgeek.org/code/
  查看全部
“这是一家极具极客范的公司”,来过环信公司的每一位客户都这么评价到。有着“连接人与人,连接人与商业”愿景的环信正在一步一步慢慢用技术和场景改变每个人的生活和工作。生有涯而知无涯,业有涯而心无涯,路漫漫其修远,“开源”当上下而求索!

 环信成立于2013年,公司数位联合创始人都是技术大牛出身,在Symbian,Nokia,Red Hat等知名IT公司都是开源项目的重度参与者,环信的基因便因此打上了“开源”的烙印,在2014年即创办了国内首个即时通讯云开源社区“IMGeek社区”,经过了3年多的深耕,2017年度在环信IMGeek社区涌现了数十个优质开源项目,其中两个开源项目目前已经拿到融资,更有一个项目获得了超过20W+的关注度,环信正通过即时通讯云PaaS平台和客服PaaS平台一步步完善自己的商业梦想,也在一步步的通过开源回馈自己的开发者和产业链上下游的小伙伴。

微信图片_20171229142123.jpg

环信公司前台一角


2017年是企业服务丰收的一年,感谢伙伴们对环信一直以来的支持。18年伊始之际,我们总结了17年间基于环信开发者的八大开源项目,希望能对大家有所帮助。
 
小马直播间-开源直播APP
 
推荐理由:基于环信开发的开源直播应用,IMGeek收藏数量3W8,对于有直播需求的小伙伴们值得参考,教你从头开始开发一个移动端直播APP。
 
互联网直播平台催生了一批批网红大咖,作为程序猿,我们绝不甘于委身幕后做搬砖工,我们一定要闪亮登场!!!做一个属于我们程序猿的IOS版直播平台~~

小马直播间.png

应用截图


 实现功能:
  • 创建推流和拉流加速
  • 集成环信IM的聊天室功能
  • 集成UCloud的ULive直播云SDK
  • 在聊天室里集成推流(录制)和拉流(播放)功能

 相关链接:http://www.imgeek.org/article/825307904​ 

Dolores-基于环信IM开发完整的企业通讯解决方案
 
推荐理由:对企业而言,初选OA办公系统是为了满足需求,解决当下问题,由于OA办公系统的在公司运作流程中扮演的重要性,安全与隐私等问题急需未雨绸缪,“可定制”、“可私有化部署”的OA办公系统成为了更多企业的首选。
 
公司想自己开发一套IM系统应该从哪里开始呢? 企业通讯录怎么保持同步呢? 企业通讯录的权限管理应该怎么做?

89e5f4394605d1a330e558e46e7cc6b0.jpg

Dolores海报


相关链接:http://www.imgeek.org/article/825308805
 
凡信-百尺竿头更进一步,2017凡信携直播、红包而来
 
推荐理由:自凡信开源以来,更新了3个大版本,从基本聊天功能,到越来越多的开发者创建分支,累计收到了10W+的收藏,帮助了很多开发者进行开发即时通讯应用。
 
已完成功能:
  • 单聊
  • 群聊
  • 朋友圈
  • 钱包
  • 直播
  • 红包

凡信.png

项目运行效果图


相关链接:http://www.imgeek.org/article/825307930
 
 Slack聊天机器人-环信客服版
 
推荐理由:17年作为人工智能元年,聊天机器人(Chatbot)在各大行业的应用方兴未艾,国外包括Facebook Messenger、Slack等均引入了聊天机器人,所以毋庸置疑,聊天机器人将成为我们未来生活中不可或缺的一部分
,IMGEEK开源社区热心开发者&朝阳区群众“晨星桑”一言不合他就花2小时写了一个Slack的聊天机器人,您可以通过这个项目在Slack上对接客户服务,并且通过一些定制开发能够看见Slack用户的基本信息(比如:昵称、电话、团队名称等),并且可以二维码支付。
相关功能:
  • 事件订阅初始化
  • 处理消息的事件
  • 把消息发送到移动客服
  • 处理OAuth回调
  • 把收到的消息发给Slack 用户

 
相关链接:http://www.imgeek.org/article/825308711​ 
 
泛聊-厉害了我的开发者,基于环信的开源高仿QQ项目
 
推荐理由:聊天功能做到了极致,展示即时通讯基本功能的实现,包括注册登录,退出登录,联系人列表,添加好友,删除好友,收发消息,消息提醒等功能。

泛聊.png

项目运行效果图


实现功能:
  •  环信SDK的集成与使用
  •  MVP模式的运用
  •  ORM数据库的集成与使用
  •  模块化思想的运用

 相关链接:http://www.imgeek.org/article/825308542​ 
 
Baby-开源私密社交应用
 
推荐理由:私密社交APP,情侣、死党必备的一对一专属聊天应用。作者开发初期下载了市面上所有IM的demo源码跑一遍,从功能、集成难易和消息稳定几个方面对比,最终还是选择了环信。使用环信EaseUi集成,基本上一天就能集成完毕。

baby.png

项目运行效果图


实现功能:
  • 加入Tinker 热修复
  • 加入部分注释
  • 增加长按删除功能
  • 优化Rxbus订阅加载数据
  • 外国友人优化的一些细节
  • 增加了评论功能
  • 优化了相册加载
  • 把登陆注册事件换了个Zip操作符更符合流的思想

相关链接:http://www.imgeek.org/article/825308850

LITE-IM-环信webim的网页即时聊天

推荐理由:你见过最酷炫的WEB聊天项目,LITE-IM不仅能够担当客户服务来使用,还可以用作你网站粘连客户、活跃社区的媒介,提升用户的使用率。

lym.png

项目运行效果图


[b]实现功能:[/b]
  • 好友/群内的文字、表情、图片、文件 在线/离线消息发送和接收。
  • 查看群员列表。 
  • 面板内快速查找。 
  • 面板右键自定义事件 
  • 修改签名 
  • 自定义上传背景皮肤 
  • 搜索好友/群 
  • 添加好友/群 
  • 新建群 
  • 消息盒子展示

 相关链接:http://www.imgeek.org/article/825308961 
 
VMTVCall-使用环信3.xSDK 在 TV 端集成音视频通话功能
 
推荐理由:移动互联网方便了我们生活,移动端随时随地沟通成为了常态,今天我们推荐的是一个可以安装在电视机上进行视频通话的开源项目。

电视机.jpg

项目运行效果图


 
实现功能
  • 项目首次启动自动注册登录
  • 拨号盘实现
  • 历史通话记录 TODO
  • 视频通话功能(因为电视不需要语音通话以及最小化)
  • 视频通话的录制
  • 通话截图

 相关链接:http://www.imgeek.org/article/825308732
 
end.
 
生有涯而知无涯,业有涯而心无涯,路漫漫其修远,当上下而求索。未来,我们还将开源更多。
 
环信IMGeek社区开源项目地址http://www.imgeek.org/code/
 
7
回复

收集基于环信SDK开发的开源项目 开源项目

回复

回眸淡然笑 回复了问题 • 9 人关注 • 5029 次浏览 • 2017-12-03 00:50 • 来自相关话题

8
评论

【新手快速入门】集成环信常见问题+解决方案汇总 常见问题

dujiepeng 发表了文章 • 9164 次浏览 • 2017-05-22 15:51 • 来自相关话题

   这里整理了集成环信的常见问题和一些功能的实现思路,希望能帮助到大家。感谢热心的开发者贡献,大家在观看过程中有不明白的地方欢迎直接跟帖咨询。
 
ios篇
APNs证书创建和上传到环信后台头像昵称的简述和处理方案音视频离线推送Demo实现环信服务器聊天记录保存多久?离线收不到好友请求IOS中环信聊天窗口如何实现文件发送和预览的功能ios集成常见问题环信推送的一些常见问题实现名片|红包|话题聊天室等自定义cell
 
Android篇
环信3.0SDK集成小米推送教程EaseUI库中V4、v7包冲突解决方案Android EaseUI里的百度地图替换为高德地图android扩展消息(名片集成)关于会话列表的置顶聊天java.lang.UnsatisfiedLinkError: 的问题android 端 app 后台被杀死收不到消息的解决方案
昵称头像篇
android中如何显示开发者服务器上的昵称和头像 Android中显示头像(接上一篇文章看)环信(Android)设置头像和昵称的方法(最简单暴力的基于环信demo的集成)IOS中如何显示开发者服务器上的昵称和头像【环信公开课第12期视频回放】-所有关于环信IM昵称头像的问题听这课就够了
 
直播篇
一言不合你就搞个直播APP
 
客服集成
IM-SDK和客服SDK并存开发指南—Android篇IM-SDK和客服SDK并存开发指南—iOS篇
 
开源项目
Android简版demoios简版demo凡信2.0:超仿微信的开源项目 凡信3.0:携直播和红包而来高仿微信:Github 3,515 Star方圆十里:环信编程大赛冠军项目泛聊:定一个小目标写一个QQSlack聊天机器人:一天时间做一个聊天机器人TV视频通话:在电视上视频通话视频通话:Android手机视频通话酷信:ios高仿微信公众号助手:与订阅用户聊天沟通
 
持续更新ing...小伙伴们还有什么想知道欢迎跟帖提出。
  查看全部
   这里整理了集成环信的常见问题和一些功能的实现思路,希望能帮助到大家。感谢热心的开发者贡献,大家在观看过程中有不明白的地方欢迎直接跟帖咨询。
 
ios篇

 
Android篇

昵称头像篇

 
直播篇
  1. 一言不合你就搞个直播APP

 
客服集成
  1. IM-SDK和客服SDK并存开发指南—Android篇
  2. IM-SDK和客服SDK并存开发指南—iOS篇

 
开源项目

 
持续更新ing...小伙伴们还有什么想知道欢迎跟帖提出。
 
0
回复

web im页面怎么写环信的登录的监听事件,求大神指点 webim

回复

仙人掌 发起了问题 • 1 人关注 • 49 次浏览 • 2018-01-16 11:16 • 来自相关话题

0
回复

chrome 连接webim 连接不上 webim

回复

zengwj 发起了问题 • 1 人关注 • 303 次浏览 • 2017-12-05 15:17 • 来自相关话题

0
回复

webIM 连接 webim

回复

空白 也只是昨天的记忆 发起了问题 • 1 人关注 • 208 次浏览 • 2017-11-14 17:23 • 来自相关话题

0
回复

webIM reactnative 如何修改群昵称? react_native webim

回复

leslieliu 发起了问题 • 1 人关注 • 310 次浏览 • 2017-08-25 11:25 • 来自相关话题

0
回复

web im集成后,发送消息成功的回调函数不执行 webim

回复

kidoo1012 发起了问题 • 1 人关注 • 323 次浏览 • 2017-06-25 23:28 • 来自相关话题

0
回复

WEBIM中发送图片如何通过BASE64编码或者APP中地址路径来发送 webim

回复

cjy1002 发起了问题 • 1 人关注 • 265 次浏览 • 2017-06-12 09:59 • 来自相关话题

4
回复

偶尔出现不明错误Error in connection establishment: net::net::<unknown> webim

回复

木云落 回复了问题 • 3 人关注 • 1098 次浏览 • 2017-05-27 13:09 • 来自相关话题

0
回复

环信WEBIm的那个coolkie是在哪里生成的?我重新生成COOKIE都不起效?看我下面的截图 webim

回复

lzf520 发起了问题 • 1 人关注 • 317 次浏览 • 2017-05-19 09:14 • 来自相关话题

2
回复

为什么webim按照开发文档写TOKEN登录的时候 conn.open(options)报错? webim

回复

lzf520 回复了问题 • 2 人关注 • 248 次浏览 • 2017-05-18 15:12 • 来自相关话题

0
回复

webIM webim

回复

苜宝小叔 发起了问题 • 1 人关注 • 296 次浏览 • 2017-05-03 14:06 • 来自相关话题

0
回复

webim集成 webim

回复

时间不等人❀ 发起了问题 • 1 人关注 • 306 次浏览 • 2017-05-02 10:17 • 来自相关话题

1
回复

web im webim

回复

时间不等人❀ 回复了问题 • 1 人关注 • 254 次浏览 • 2017-05-02 10:01 • 来自相关话题

3
回复

webim 收到消息后strophe.Websocket.prototype._onMessage 能被调用,handleMessage 没被调用 WebIM API webim

回复

wansheg 回复了问题 • 2 人关注 • 466 次浏览 • 2017-04-10 15:46 • 来自相关话题

1
回复

webim发送cmd消息 如何定义? 环信_WebIM webim

回复

木云落 回复了问题 • 2 人关注 • 322 次浏览 • 2017-04-10 12:49 • 来自相关话题

1
回复

webim在demo中如何获取自己服务器的头像和昵称? 头像 昵称 扩展 环信_WebIM 昵称 头像 webim

回复

环信沈冲 回复了问题 • 2 人关注 • 558 次浏览 • 2017-03-24 14:12 • 来自相关话题

1
回复

web IM 回调事件为何触发了两次 webim

回复

zhangyb 回复了问题 • 2 人关注 • 373 次浏览 • 2017-03-22 17:13 • 来自相关话题

1
回复

我的电脑是x201i,win10,使用webim,点击联系人为什么聊天窗不见了 webim系统设配 webim

回复

zhangyb 回复了问题 • 2 人关注 • 327 次浏览 • 2017-03-14 11:24 • 来自相关话题

2
最佳

环信服务端集成,如何集成? iOS Android webim

回复

执念 回复了问题 • 3 人关注 • 3169 次浏览 • 2017-03-13 11:36 • 来自相关话题

3
回复

webim在登录系统时同时登录环信账号,登录成功跳转其他页面时失败 提示登录失败 跳转页面时登录失败 webim

回复

zhangyb 回复了问题 • 4 人关注 • 1539 次浏览 • 2017-03-05 22:14 • 来自相关话题

2
回复

amr 音频 webim播放问题 arm 音频 webim

回复

lizg 回复了问题 • 2 人关注 • 584 次浏览 • 2017-02-15 16:44 • 来自相关话题

1
回复

webim关于https设置问题 https webim

回复

zhangyb 回复了问题 • 2 人关注 • 599 次浏览 • 2017-01-17 12:21 • 来自相关话题

1
回复

webim 上传图片的 width height获取 webim

回复

baoshu 回复了问题 • 2 人关注 • 588 次浏览 • 2016-12-22 17:07 • 来自相关话题

2
回复

最新版本web IM的demo不会修改 webim

回复

孙新乐 回复了问题 • 2 人关注 • 640 次浏览 • 2016-12-10 12:24 • 来自相关话题

7
回复

webim 为什么刷新后就又要重新登录啊?怎么才能不让它重新登录 登录 webim

回复

baoshu 回复了问题 • 5 人关注 • 1192 次浏览 • 2016-11-23 12:01 • 来自相关话题

0
评论

2017 本土开源大盘点!年度编程语言和开源项目 TOP 榜 开源 2017 码云

beyond 发表了文章 • 141 次浏览 • 2018-01-09 15:10 • 来自相关话题

摘要:年度最受国内开发者喜爱的编程语言?最受欢迎的开源项目?为你呈现最详细的国内开发者画像。




在即将过去的2017年,作为程序员的你过得怎么样呢?在这一年中你是否参与过开源项目的创建或运营?今天为大家带来最详细的本土开源现状报告,为你展现国内开发者喜爱的编程语言、最受欢迎的国内开源项目等丰富信息。

1. 国内开发者的地域分布





2. 国内开发者的性别分布
 





3. 2017 年新增756 K 开源项目——Star 数增长排行
 





4. 2017 年新增756 K 开源项目——Fork 数增长排行





5. 2017 年,更多人开始参与开源项目​





6. 国内开源项目的语言占比是什么情况?​





7. 国内开源项目的功能分类是什么情况?​





8.国内开发者最喜爱的编程语言​





9. 2017 年增速最快的语言





本文数据由 码云 2017年度数据报告 提供,码云是开源中国旗下的云端协作开发平台,上线四年来用户突破200万,托管项目近300万,已成为经过大规模部署的成熟产品。码云的社区版的私有库完全免费,企业版(5人以下免费)则提供代码托管、项目管理、文档协作的一体化开发服务,竭诚为广大本土开发者服务。 查看全部
摘要:年度最受国内开发者喜爱的编程语言?最受欢迎的开源项目?为你呈现最详细的国内开发者画像。

盘点.jpg

在即将过去的2017年,作为程序员的你过得怎么样呢?在这一年中你是否参与过开源项目的创建或运营?今天为大家带来最详细的本土开源现状报告,为你展现国内开发者喜爱的编程语言、最受欢迎的国内开源项目等丰富信息。

1. 国内开发者的地域分布


开发者.png


2. 国内开发者的性别分布
 


性别.png


3. 2017 年新增756 K 开源项目——Star 数增长排行
 


star.png


4. 2017 年新增756 K 开源项目——Fork 数增长排行


fork.png


5. 2017 年,更多人开始参与开源项目​


参与.png


6. 国内开源项目的语言占比是什么情况?​


预言.png


7. 国内开源项目的功能分类是什么情况?​


功能.png


8.国内开发者最喜爱的编程语言​


语言.png


9. 2017 年增速最快的语言


增长.png


本文数据由 码云 2017年度数据报告 提供,码云是开源中国旗下的云端协作开发平台,上线四年来用户突破200万,托管项目近300万,已成为经过大规模部署的成熟产品。码云的社区版的私有库完全免费,企业版(5人以下免费)则提供代码托管、项目管理、文档协作的一体化开发服务,竭诚为广大本土开发者服务。
0
评论

2017环信八大开源项目源码放出:两个已获融资,单个20W+关注 开源项目

beyond 发表了文章 • 445 次浏览 • 2017-12-29 14:27 • 来自相关话题

“这是一家极具极客范的公司”,来过环信公司的每一位客户都这么评价到。有着“连接人与人,连接人与商业”愿景的环信正在一步一步慢慢用技术和场景改变每个人的生活和工作。生有涯而知无涯,业有涯而心无涯,路漫漫其修远,“开源”当上下而求索!
 环信成立于2013年,公司数位联合创始人都是技术大牛出身,在Symbian,Nokia,Red Hat等知名IT公司都是开源项目的重度参与者,环信的基因便因此打上了“开源”的烙印,在2014年即创办了国内首个即时通讯云开源社区“IMGeek社区”,经过了3年多的深耕,2017年度在环信IMGeek社区涌现了数十个优质开源项目,其中两个开源项目目前已经拿到融资,更有一个项目获得了超过20W+的关注度,环信正通过即时通讯云PaaS平台和客服PaaS平台一步步完善自己的商业梦想,也在一步步的通过开源回馈自己的开发者和产业链上下游的小伙伴。




环信公司前台一角
2017年是企业服务丰收的一年,感谢伙伴们对环信一直以来的支持。18年伊始之际,我们总结了17年间基于环信开发者的八大开源项目,希望能对大家有所帮助。
 
小马直播间-开源直播APP
 
推荐理由:基于环信开发的开源直播应用,IMGeek收藏数量3W8,对于有直播需求的小伙伴们值得参考,教你从头开始开发一个移动端直播APP。
 
互联网直播平台催生了一批批网红大咖,作为程序猿,我们绝不甘于委身幕后做搬砖工,我们一定要闪亮登场!!!做一个属于我们程序猿的IOS版直播平台~~




应用截图
 实现功能:
创建推流和拉流加速集成环信IM的聊天室功能集成UCloud的ULive直播云SDK在聊天室里集成推流(录制)和拉流(播放)功能
 相关链接:http://www.imgeek.org/article/825307904​ 

Dolores-基于环信IM开发完整的企业通讯解决方案
 
推荐理由:对企业而言,初选OA办公系统是为了满足需求,解决当下问题,由于OA办公系统的在公司运作流程中扮演的重要性,安全与隐私等问题急需未雨绸缪,“可定制”、“可私有化部署”的OA办公系统成为了更多企业的首选。
 
公司想自己开发一套IM系统应该从哪里开始呢? 企业通讯录怎么保持同步呢? 企业通讯录的权限管理应该怎么做?




Dolores海报
相关链接:http://www.imgeek.org/article/825308805
 
凡信-百尺竿头更进一步,2017凡信携直播、红包而来
 
推荐理由:自凡信开源以来,更新了3个大版本,从基本聊天功能,到越来越多的开发者创建分支,累计收到了10W+的收藏,帮助了很多开发者进行开发即时通讯应用。
 
已完成功能:
单聊群聊朋友圈钱包直播红包




项目运行效果图
相关链接:http://www.imgeek.org/article/825307930
 
 Slack聊天机器人-环信客服版
 
推荐理由:17年作为人工智能元年,聊天机器人(Chatbot)在各大行业的应用方兴未艾,国外包括Facebook Messenger、Slack等均引入了聊天机器人,所以毋庸置疑,聊天机器人将成为我们未来生活中不可或缺的一部分
,IMGEEK开源社区热心开发者&朝阳区群众“晨星桑”一言不合他就花2小时写了一个Slack的聊天机器人,您可以通过这个项目在Slack上对接客户服务,并且通过一些定制开发能够看见Slack用户的基本信息(比如:昵称、电话、团队名称等),并且可以二维码支付。
相关功能:
事件订阅初始化处理消息的事件把消息发送到移动客服处理OAuth回调把收到的消息发给Slack 用户
 
相关链接:http://www.imgeek.org/article/825308711​ 
 
泛聊-厉害了我的开发者,基于环信的开源高仿QQ项目
 
推荐理由:聊天功能做到了极致,展示即时通讯基本功能的实现,包括注册登录,退出登录,联系人列表,添加好友,删除好友,收发消息,消息提醒等功能。




项目运行效果图
实现功能:
 环信SDK的集成与使用 MVP模式的运用 ORM数据库的集成与使用 模块化思想的运用
 相关链接:http://www.imgeek.org/article/825308542​ 
 
Baby-开源私密社交应用
 
推荐理由:私密社交APP,情侣、死党必备的一对一专属聊天应用。作者开发初期下载了市面上所有IM的demo源码跑一遍,从功能、集成难易和消息稳定几个方面对比,最终还是选择了环信。使用环信EaseUi集成,基本上一天就能集成完毕。




项目运行效果图
实现功能:
加入Tinker 热修复加入部分注释增加长按删除功能优化Rxbus订阅加载数据外国友人优化的一些细节增加了评论功能优化了相册加载把登陆注册事件换了个Zip操作符更符合流的思想
相关链接:http://www.imgeek.org/article/825308850

LITE-IM-环信webim的网页即时聊天

推荐理由:你见过最酷炫的WEB聊天项目,LITE-IM不仅能够担当客户服务来使用,还可以用作你网站粘连客户、活跃社区的媒介,提升用户的使用率。




项目运行效果图
[b]实现功能:[/b]
好友/群内的文字、表情、图片、文件 在线/离线消息发送和接收。查看群员列表。 面板内快速查找。 面板右键自定义事件 修改签名 自定义上传背景皮肤 搜索好友/群 添加好友/群 新建群 消息盒子展示
 相关链接:http://www.imgeek.org/article/825308961 
 
VMTVCall-使用环信3.xSDK 在 TV 端集成音视频通话功能
 
推荐理由:移动互联网方便了我们生活,移动端随时随地沟通成为了常态,今天我们推荐的是一个可以安装在电视机上进行视频通话的开源项目。




项目运行效果图
 
实现功能
项目首次启动自动注册登录拨号盘实现历史通话记录 TODO视频通话功能(因为电视不需要语音通话以及最小化)视频通话的录制通话截图
 相关链接:http://www.imgeek.org/article/825308732
 
end.
 
生有涯而知无涯,业有涯而心无涯,路漫漫其修远,当上下而求索。未来,我们还将开源更多。
 
环信IMGeek社区开源项目地址http://www.imgeek.org/code/
  查看全部
“这是一家极具极客范的公司”,来过环信公司的每一位客户都这么评价到。有着“连接人与人,连接人与商业”愿景的环信正在一步一步慢慢用技术和场景改变每个人的生活和工作。生有涯而知无涯,业有涯而心无涯,路漫漫其修远,“开源”当上下而求索!

 环信成立于2013年,公司数位联合创始人都是技术大牛出身,在Symbian,Nokia,Red Hat等知名IT公司都是开源项目的重度参与者,环信的基因便因此打上了“开源”的烙印,在2014年即创办了国内首个即时通讯云开源社区“IMGeek社区”,经过了3年多的深耕,2017年度在环信IMGeek社区涌现了数十个优质开源项目,其中两个开源项目目前已经拿到融资,更有一个项目获得了超过20W+的关注度,环信正通过即时通讯云PaaS平台和客服PaaS平台一步步完善自己的商业梦想,也在一步步的通过开源回馈自己的开发者和产业链上下游的小伙伴。

微信图片_20171229142123.jpg

环信公司前台一角


2017年是企业服务丰收的一年,感谢伙伴们对环信一直以来的支持。18年伊始之际,我们总结了17年间基于环信开发者的八大开源项目,希望能对大家有所帮助。
 
小马直播间-开源直播APP
 
推荐理由:基于环信开发的开源直播应用,IMGeek收藏数量3W8,对于有直播需求的小伙伴们值得参考,教你从头开始开发一个移动端直播APP。
 
互联网直播平台催生了一批批网红大咖,作为程序猿,我们绝不甘于委身幕后做搬砖工,我们一定要闪亮登场!!!做一个属于我们程序猿的IOS版直播平台~~

小马直播间.png

应用截图


 实现功能:
  • 创建推流和拉流加速
  • 集成环信IM的聊天室功能
  • 集成UCloud的ULive直播云SDK
  • 在聊天室里集成推流(录制)和拉流(播放)功能

 相关链接:http://www.imgeek.org/article/825307904​ 

Dolores-基于环信IM开发完整的企业通讯解决方案
 
推荐理由:对企业而言,初选OA办公系统是为了满足需求,解决当下问题,由于OA办公系统的在公司运作流程中扮演的重要性,安全与隐私等问题急需未雨绸缪,“可定制”、“可私有化部署”的OA办公系统成为了更多企业的首选。
 
公司想自己开发一套IM系统应该从哪里开始呢? 企业通讯录怎么保持同步呢? 企业通讯录的权限管理应该怎么做?

89e5f4394605d1a330e558e46e7cc6b0.jpg

Dolores海报


相关链接:http://www.imgeek.org/article/825308805
 
凡信-百尺竿头更进一步,2017凡信携直播、红包而来
 
推荐理由:自凡信开源以来,更新了3个大版本,从基本聊天功能,到越来越多的开发者创建分支,累计收到了10W+的收藏,帮助了很多开发者进行开发即时通讯应用。
 
已完成功能:
  • 单聊
  • 群聊
  • 朋友圈
  • 钱包
  • 直播
  • 红包

凡信.png

项目运行效果图


相关链接:http://www.imgeek.org/article/825307930
 
 Slack聊天机器人-环信客服版
 
推荐理由:17年作为人工智能元年,聊天机器人(Chatbot)在各大行业的应用方兴未艾,国外包括Facebook Messenger、Slack等均引入了聊天机器人,所以毋庸置疑,聊天机器人将成为我们未来生活中不可或缺的一部分
,IMGEEK开源社区热心开发者&朝阳区群众“晨星桑”一言不合他就花2小时写了一个Slack的聊天机器人,您可以通过这个项目在Slack上对接客户服务,并且通过一些定制开发能够看见Slack用户的基本信息(比如:昵称、电话、团队名称等),并且可以二维码支付。
相关功能:
  • 事件订阅初始化
  • 处理消息的事件
  • 把消息发送到移动客服
  • 处理OAuth回调
  • 把收到的消息发给Slack 用户

 
相关链接:http://www.imgeek.org/article/825308711​ 
 
泛聊-厉害了我的开发者,基于环信的开源高仿QQ项目
 
推荐理由:聊天功能做到了极致,展示即时通讯基本功能的实现,包括注册登录,退出登录,联系人列表,添加好友,删除好友,收发消息,消息提醒等功能。

泛聊.png

项目运行效果图


实现功能:
  •  环信SDK的集成与使用
  •  MVP模式的运用
  •  ORM数据库的集成与使用
  •  模块化思想的运用

 相关链接:http://www.imgeek.org/article/825308542​ 
 
Baby-开源私密社交应用
 
推荐理由:私密社交APP,情侣、死党必备的一对一专属聊天应用。作者开发初期下载了市面上所有IM的demo源码跑一遍,从功能、集成难易和消息稳定几个方面对比,最终还是选择了环信。使用环信EaseUi集成,基本上一天就能集成完毕。

baby.png

项目运行效果图


实现功能:
  • 加入Tinker 热修复
  • 加入部分注释
  • 增加长按删除功能
  • 优化Rxbus订阅加载数据
  • 外国友人优化的一些细节
  • 增加了评论功能
  • 优化了相册加载
  • 把登陆注册事件换了个Zip操作符更符合流的思想

相关链接:http://www.imgeek.org/article/825308850

LITE-IM-环信webim的网页即时聊天

推荐理由:你见过最酷炫的WEB聊天项目,LITE-IM不仅能够担当客户服务来使用,还可以用作你网站粘连客户、活跃社区的媒介,提升用户的使用率。

lym.png

项目运行效果图


[b]实现功能:[/b]
  • 好友/群内的文字、表情、图片、文件 在线/离线消息发送和接收。
  • 查看群员列表。 
  • 面板内快速查找。 
  • 面板右键自定义事件 
  • 修改签名 
  • 自定义上传背景皮肤 
  • 搜索好友/群 
  • 添加好友/群 
  • 新建群 
  • 消息盒子展示

 相关链接:http://www.imgeek.org/article/825308961 
 
VMTVCall-使用环信3.xSDK 在 TV 端集成音视频通话功能
 
推荐理由:移动互联网方便了我们生活,移动端随时随地沟通成为了常态,今天我们推荐的是一个可以安装在电视机上进行视频通话的开源项目。

电视机.jpg

项目运行效果图


 
实现功能
  • 项目首次启动自动注册登录
  • 拨号盘实现
  • 历史通话记录 TODO
  • 视频通话功能(因为电视不需要语音通话以及最小化)
  • 视频通话的录制
  • 通话截图

 相关链接:http://www.imgeek.org/article/825308732
 
end.
 
生有涯而知无涯,业有涯而心无涯,路漫漫其修远,当上下而求索。未来,我们还将开源更多。
 
环信IMGeek社区开源项目地址http://www.imgeek.org/code/
 
7
回复

收集基于环信SDK开发的开源项目 开源项目

回复

回眸淡然笑 回复了问题 • 9 人关注 • 5029 次浏览 • 2017-12-03 00:50 • 来自相关话题

8
评论

【新手快速入门】集成环信常见问题+解决方案汇总 常见问题

dujiepeng 发表了文章 • 9164 次浏览 • 2017-05-22 15:51 • 来自相关话题

   这里整理了集成环信的常见问题和一些功能的实现思路,希望能帮助到大家。感谢热心的开发者贡献,大家在观看过程中有不明白的地方欢迎直接跟帖咨询。
 
ios篇
APNs证书创建和上传到环信后台头像昵称的简述和处理方案音视频离线推送Demo实现环信服务器聊天记录保存多久?离线收不到好友请求IOS中环信聊天窗口如何实现文件发送和预览的功能ios集成常见问题环信推送的一些常见问题实现名片|红包|话题聊天室等自定义cell
 
Android篇
环信3.0SDK集成小米推送教程EaseUI库中V4、v7包冲突解决方案Android EaseUI里的百度地图替换为高德地图android扩展消息(名片集成)关于会话列表的置顶聊天java.lang.UnsatisfiedLinkError: 的问题android 端 app 后台被杀死收不到消息的解决方案
昵称头像篇
android中如何显示开发者服务器上的昵称和头像 Android中显示头像(接上一篇文章看)环信(Android)设置头像和昵称的方法(最简单暴力的基于环信demo的集成)IOS中如何显示开发者服务器上的昵称和头像【环信公开课第12期视频回放】-所有关于环信IM昵称头像的问题听这课就够了
 
直播篇
一言不合你就搞个直播APP
 
客服集成
IM-SDK和客服SDK并存开发指南—Android篇IM-SDK和客服SDK并存开发指南—iOS篇
 
开源项目
Android简版demoios简版demo凡信2.0:超仿微信的开源项目 凡信3.0:携直播和红包而来高仿微信:Github 3,515 Star方圆十里:环信编程大赛冠军项目泛聊:定一个小目标写一个QQSlack聊天机器人:一天时间做一个聊天机器人TV视频通话:在电视上视频通话视频通话:Android手机视频通话酷信:ios高仿微信公众号助手:与订阅用户聊天沟通
 
持续更新ing...小伙伴们还有什么想知道欢迎跟帖提出。
  查看全部
   这里整理了集成环信的常见问题和一些功能的实现思路,希望能帮助到大家。感谢热心的开发者贡献,大家在观看过程中有不明白的地方欢迎直接跟帖咨询。
 
ios篇

 
Android篇

昵称头像篇

 
直播篇
  1. 一言不合你就搞个直播APP

 
客服集成
  1. IM-SDK和客服SDK并存开发指南—Android篇
  2. IM-SDK和客服SDK并存开发指南—iOS篇

 
开源项目

 
持续更新ing...小伙伴们还有什么想知道欢迎跟帖提出。
 
2
评论

基于layim+环信webim的网页即时聊天 LITE-IM LITE_IM webim layim 即时通信 网页聊天

回眸淡然笑 发表了文章 • 517 次浏览 • 2017-12-03 00:55 • 来自相关话题

什么是LITE-IM?LITE-IM是一款基于 环信webim3.X 和 layim 开发而成的WEB即时通讯,并且完全的免费和开源 。LITE-IM使用 拥有高并发,长连接永不掉线的即时通讯的行业领头羊环信作为通信介质,再搭配上拥有丰富前端交互的layim,让你能够快速的搭建一个现代化的、高度稳定的web即时通讯。

LITE-IM不仅能够担当客户服务来使用,还可以用作你网站粘连客户、活跃社区的媒介,提升用户的使用率。当然LITE-IM还有许多有待完善之处。
 
目前已完成的功能有:
好友/群内的文字、表情、图片、文件 在线/离线消息发送和接收。查看群员列表。 面板内快速查找。 面板右键自定义事件 修改签名 自定义上传背景皮肤 搜索好友/群 添加好友/群 新建群 消息盒子展示查看/修改个人信息实时获取好友在线状态挤下线提醒增删改 好友/好友分组群管理(增删管理员/修改群名片/单个群员禁言解除禁言/踢人)

部分截图如下
 
好友聊天界面

自定义上传皮肤

群组

自定义右键

消息盒子

好友

 
 LITE-IM在线体验地址:test.guoshanchina.com

体验帐号:
用户名:911088 密码:123456

用户名:1570855 密码:123456

用户名:1570845 密码:123456

用户名:911058 密码:123456

用户名:910992 密码:123456

用户名:911067 密码:123456

用户名:911100 密码:123456

用户名:911085 密码:123456

 github源码:https://github.com/shmilylbelva/webim 查看全部
什么是LITE-IM?
LITE-IM是一款基于 环信webim3.X 和 layim 开发而成的WEB即时通讯,并且完全的免费和开源 。LITE-IM使用 拥有高并发,长连接永不掉线的即时通讯的行业领头羊环信作为通信介质,再搭配上拥有丰富前端交互的layim,让你能够快速的搭建一个现代化的、高度稳定的web即时通讯。

LITE-IM不仅能够担当客户服务来使用,还可以用作你网站粘连客户、活跃社区的媒介,提升用户的使用率。当然LITE-IM还有许多有待完善之处。

 
目前已完成的功能有:

  1. 好友/群内的文字、表情、图片、文件 在线/离线消息发送和接收。
  2. 查看群员列表。 
  3. 面板内快速查找。 
  4. 面板右键自定义事件 
  5. 修改签名 
  6. 自定义上传背景皮肤 
  7. 搜索好友/群 
  8. 添加好友/群 
  9. 新建群 
  10. 消息盒子展示
  11. 查看/修改个人信息
  12. 实时获取好友在线状态
  13. 挤下线提醒
  14. 增删改 好友/好友分组
  15. 群管理(增删管理员/修改群名片/单个群员禁言解除禁言/踢人)



部分截图如下
 
好友聊天界面


自定义上传皮肤


群组


自定义右键


消息盒子


好友


 
 LITE-IM在线体验地址:test.guoshanchina.com

体验帐号:

用户名:911088 密码:123456

用户名:1570855 密码:123456

用户名:1570845 密码:123456

用户名:911058 密码:123456

用户名:910992 密码:123456

用户名:911067 密码:123456

用户名:911100 密码:123456

用户名:911085 密码:123456



 github源码:https://github.com/shmilylbelva/webim
3
评论

基于环信webIM提供的Demo改造 webim 自动登录 聊天记录 头像 昵称 显示

__kaven™、 发表了文章 • 254 次浏览 • 2017-11-17 14:44 • 来自相关话题

本效果图是基于webIM的demo版本修改,主要实现了以下功能
1.实现自动登录,到聊天窗口
    解决办法:是在页面自己写参数调用 Demo.conn.open(options) 方法

2.实现最近联系人列表渲染(因为我们没有好友概念,只要跟谁最近聊天了,就算是好友了)
    解决办法:在页面通过ajax调用后台restFul地址获取联系人,然后循环调用 Demo.conn.onTextMessage(msg)方法,将消息内容为空,在msg里面设置标识为初始化加载,这样就会出现在列表里面

3.实现联系人:头像、昵称 渲染
   解决办法:很简单就是在刚才上面的方法体里面调用完之后,你的列表就会出现好友列表,这时候你只需要根据环信用户id,直接基于jq替换即可

4.实现点击联系人 渲染历史聊天记录(在发送消息的时候将聊天记录保存在我们自己的数据库)
   解决办法:在你获取最近联系人这个方法时已经返回了聊天记录列表,你需要在(Demo.chatRecord.环信用户id.messages)这个数组里面把你的消息放在这个数据里面去,然后当用户点击联系人列表时你jq写一个(webim-contact-item)这个样式的click触发方法,在这个方法中你需要写把聊天记录从(Demo.chatRecord.环信用户id.messages) 循环取出来,包装成HTML然后在  $("#wrapper"+Demo.selected).append() 这些HTML即可

5.实现保存聊天
    解决办法:就是在 sendTxt里面调用我们的ajax方法保存
大致就这么多,个人不建议基于官方的webIM的Demo 去修改,这次踩过这个坑了

欢迎各位 集成的朋友来访,目前我这个算是解决,等过段时间我还是自己写一个吧,不打算基于他们的Demo去改造
在此欢迎去我的博客:   www.kaven.cn 查看全部
本效果图是基于webIM的demo版本修改,主要实现了以下功能
1.实现自动登录,到聊天窗口
    解决办法:是在页面自己写参数调用 Demo.conn.open(options) 方法

2.实现最近联系人列表渲染(因为我们没有好友概念,只要跟谁最近聊天了,就算是好友了)
    解决办法:在页面通过ajax调用后台restFul地址获取联系人,然后循环调用 Demo.conn.onTextMessage(msg)方法,将消息内容为空,在msg里面设置标识为初始化加载,这样就会出现在列表里面

3.实现联系人:头像、昵称 渲染
   解决办法:很简单就是在刚才上面的方法体里面调用完之后,你的列表就会出现好友列表,这时候你只需要根据环信用户id,直接基于jq替换即可

4.实现点击联系人 渲染历史聊天记录(在发送消息的时候将聊天记录保存在我们自己的数据库)
   解决办法:在你获取最近联系人这个方法时已经返回了聊天记录列表,你需要在(Demo.chatRecord.环信用户id.messages)这个数组里面把你的消息放在这个数据里面去,然后当用户点击联系人列表时你jq写一个(webim-contact-item)这个样式的click触发方法,在这个方法中你需要写把聊天记录从(Demo.chatRecord.环信用户id.messages) 循环取出来,包装成HTML然后在  $("#wrapper"+Demo.selected).append() 这些HTML即可

5.实现保存聊天
    解决办法:就是在 sendTxt里面调用我们的ajax方法保存
大致就这么多,个人不建议基于官方的webIM的Demo 去修改,这次踩过这个坑了

欢迎各位 集成的朋友来访,目前我这个算是解决,等过段时间我还是自己写一个吧,不打算基于他们的Demo去改造
在此欢迎去我的博客:   www.kaven.cn
8
评论

Vue-cli整合环信WebIM webim vue vuejs

魂之挽歌 发表了文章 • 867 次浏览 • 2017-10-11 17:34 • 来自相关话题

[b]今天碰到了一个问题,就是conn.listen里面的函数没法执行,目前不知道怎么解决[/b]baidu下,这个好像是不支持js严格模式下的调用,看来不行了,希望有大神来改造下
回调函数的参数都是报错TypeError: 'caller' and 'arguments' are restricted function properties and cannot be accessed in this context.

 
 由于准备做一个社交性的网站,(暂时不考虑app),前端使用的vuejs+vux,使用vue-cli安装,发现环信有提供react的整合,并没有vuejs版本的,只好自己来动手, 由于是第一次用vuejs开发,硬着头皮来,各种import 都是不行,strophe这个js是个自执行的闭包函数,网上各种搜也没有找到方法,也尝试过直接在index.html引入并执行,但是打包的时候会报错,摸索了一个星期(主要是生手加上头脑简单), 今天找到了不报XXX未定义之类的,打包也正常。可能有朋友用得到,提供一个思路,我暂时只想到了这样,希望有比我简单快捷的方法
 
1.  官方的  npm install easemob-websdk --save
 
2.  npm install strophe.js (这里注意加上.js)
 
3.找到node_modules/easemob-websdk/src/connection.js
在里面引入strophe.js, 我是在第二行假的
var Strophe = require('../../strophe.js').Strophe;





 
然后再大约667行左右加入config 定义





并在4205行左右使用这个定义





 
4. 找到node_modules/strophe.js/strophe.js
大约在2883行左右加入两个函数





 
 
好了,现在基本上可以像vuejs那样使用了
 

























  查看全部
[b]今天碰到了一个问题,就是conn.listen里面的函数没法执行,目前不知道怎么解决[/b]
baidu下,这个好像是不支持js严格模式下的调用,看来不行了,希望有大神来改造下
回调函数的参数都是报错
TypeError: 'caller' and 'arguments' are restricted function properties and cannot be accessed in this context.

 


 由于准备做一个社交性的网站,(暂时不考虑app),前端使用的vuejs+vux,使用vue-cli安装,发现环信有提供react的整合,并没有vuejs版本的,只好自己来动手, 由于是第一次用vuejs开发,硬着头皮来,各种import 都是不行,strophe这个js是个自执行的闭包函数,网上各种搜也没有找到方法,也尝试过直接在index.html引入并执行,但是打包的时候会报错,摸索了一个星期(主要是生手加上头脑简单), 今天找到了不报XXX未定义之类的,打包也正常。可能有朋友用得到,提供一个思路,我暂时只想到了这样,希望有比我简单快捷的方法
 
1.  官方的  npm install easemob-websdk --save
 
2.  npm install strophe.js (这里注意加上.js)
 
3.找到node_modules/easemob-websdk/src/connection.js
在里面引入strophe.js, 我是在第二行假的
var Strophe = require('../../strophe.js').Strophe;

1.png

 
然后再大约667行左右加入config 定义

2.png

并在4205行左右使用这个定义

3.png

 
4. 找到node_modules/strophe.js/strophe.js
大约在2883行左右加入两个函数

4.png

 
 
好了,现在基本上可以像vuejs那样使用了
 

5.png


6.png


7.png


8.png


9.png

 
4
评论

环信WebIM2.0版本发布,专为移动端H5打造的通讯SDK webim h5 产品更新

产品更新 发表了文章 • 351 次浏览 • 2017-09-22 18:18 • 来自相关话题

十年磨一剑 砺得梅花香
-献给在一线开发程序员们 
经过了长达三个月的封闭开发,环信WebIM2.0版本在9月22号发布,此次更新的WebIM2.0也被称为“H5版本”,一套Demo同时支持PC和H5,自适应微信/QQ和各种手机浏览器。
 
WebIM 2.0 (webim-h5) 在1.x的基础上, 主要做了以下更新:
响应式布局, 一套Demo同时支持PC和H5,自适应不同终端屏幕尺寸完全基于Reac + Redux的单向数据流引入ant-design组件库,方便开发者后续开发适配微信/QQ和各种手机浏览器
 
webim-h5在线体验地址:https://webim-h5.easemob.com
 
安装1.初始化安装
在/demo下执行 npm i
2.如果需要同时编辑sdk cd sdk && npm link && cd .. && npm link easemob-websdk
3.如果需要同时编辑webrtc cd webrtc && npm link && cd .. && npm link easemob-webrtc
4.运行demo
cd demo && npm start (requires node@>=6)
http://localhost:3001
cd demo && HTTPS=true npm start (webrtc supports HTTPS only)
https://localhost:3001
5.发布demo cd demo && npm run build /demo/build 目录下的就是可以运行和部署的版本执行npm start时如果出现```
./src/config/WebIM.js
Module not found: Can't resolve 'easemob-websdk/dist/strophe-1.2.8-g.js' in '<YourRootDir>/demo/src/config'
```FIX: 没有执行 npm link easemob-websdk
 
3. 执行npm start时如果出现> node scripts/start.js

/Users/wenke/www/web-im/demo/scripts/start.js:23
const {
^

SyntaxError: Unexpected token {
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:373:25)
at Object.Module._extensions..js (module.js:416:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Function.Module.runMain (module.js:441:10)
at startup (node.js:139:18)
at node.js:974:3FIX: 请检查node版本是否是v6.0+
 
4. Redux State 的数据结构如下:{
// ---------------------------------
// 响应式断点
// ---------------------------------
//xs: "480px"
//sm: "768px"
//md: "992px"
//lg: "1200px"
//xl: "1600px"
breakpoint: {
xs: false,
sm: false,
md: false,
lg: false,
xl: false
},

// ---------------------------------
// UI相关
// ---------------------------------
common: {
fetching: false,
isGetGroupAlready: true,
isGetChatRoomAlready: false,
showGroupRequestModal: false //群主管理加入群消息
},

// ---------------------------------
// 用户登录信息
// ---------------------------------
login: {
username: 'sunylt',
password: null,
token: "YWMtZ0m-opwTEeeS-e0Ko59rsU1-S6DcShHjkNXh_7qs2vV",
fetching: false,
error: false
isLogin: true,
},

// ---------------------------------
// 多语言
// ---------------------------------
i18n: {

// 已配置语言
translations: {
cn: {},
us: {},
},

// 当前语言
locale: "cn"
},


// 注册信息,没进行注册操作为{}
register: {
username: "123abcdbb",
password: "123",
fetching: false,
registerError: null
},

// 预留 暂无用
contacts: {}

// 预留 暂无用
im: {}

// ---------------------------------
// 数据实体
// ---------------------------------
entities: {
// 好友
roster: {
byName: {
name: { subscription,jid, ask, name, groups }
...
},
names: ['lwz2' ...],
// 好友列表在此,因为好友列表来源于roster,息息相关
friends: ,
},
// 群组
group: {
loadingFailed: <Boolean>,
isLoading: <Booleadn>,
rightSiderOffset: <Number>, //控制右侧群组管理面板
byId: {
groupId: {groupid, groupname},
....
},
names: [groupName_#-#_groupId, ....]
},
// 聊天室
chatroom: {
byId: {
chatId: {chatId, name, owner, affiliations_count}
...
},
names: [chatName_#-#_chatId, ....]
},
// 陌生人
stranger: {
},

// 群组成员信息
groupMember: {
groupId: {
muted: {byName: {}},//群主可见,禁言列表
byName: {
name: {name: <String: name>, affiliation: 'member'}
},
names: ,
admins: , //群管理员可见
},
...
}

// 订阅通知
subscribe: {
byFrom: {}
},

// 黑名单列表
blacklist: {
byName: {}
name:
},

// 消息
message: {

// 所有消息
byId: {
mid: {"type":"chat|groupchat|chatroom|stranger|error", "chatId": <String: chatId>},
...
}

// 单聊消息列表
chat: {
chatId: [
{message},
...
]
},

// 群组消息列表
groupChat: {
chatId: [
{message},
...
]
},

// 聊天室消息列表
chatroom: {
chatId: [
{message},
...
]
},

// 陌生人消息列表
stranger: {
chatId: [
{message},
...
]
},

// 预留 暂无用
extra: {}

// 未读消息记录
unread: {
// 好友
chat: {
chatId: <Number: unreadNum>,
...
},
// 群组
groupchat: {
chatId: <Number: unreadNum>,
...
},
// 聊天室
chatroom: {
chatId: <Number: unreadNum>,
...
},
// 陌生人
stranger: {
chatId: <Number: unreadNum>,
...
}
}

// 自己发的消息mid跟本地id对照
byMid: {
messageId: {id: <String: localId>},
...
},
},

// 加入群申请
groupRequest: {
byGid: {}
}
}
} 查看全部
十年磨一剑 砺得梅花香
-献给在一线开发程序员们
 
经过了长达三个月的封闭开发,环信WebIM2.0版本在9月22号发布,此次更新的WebIM2.0也被称为“H5版本”,一套Demo同时支持PC和H5,自适应微信/QQ和各种手机浏览器。
 
WebIM 2.0 (webim-h5) 在1.x的基础上, 主要做了以下更新:
  • 响应式布局, 一套Demo同时支持PC和H5,自适应不同终端屏幕尺寸
  • 完全基于Reac + Redux的单向数据流
  • 引入ant-design组件库,方便开发者后续开发
  • 适配微信/QQ和各种手机浏览器

 
webim-h5在线体验地址:https://webim-h5.easemob.com
 
安装
1.初始化安装
在/demo下执行 npm i
2.如果需要同时编辑sdk cd sdk && npm link && cd .. && npm link easemob-websdk
3.如果需要同时编辑webrtc cd webrtc && npm link && cd .. && npm link easemob-webrtc
4.运行demo
cd demo && npm start (requires node@>=6)
http://localhost:3001
cd demo && HTTPS=true npm start (webrtc supports HTTPS only)
https://localhost:3001
5.发布demo cd demo && npm run build /demo/build 目录下的就是可以运行和部署的版本
执行npm start时如果出现
```
./src/config/WebIM.js
Module not found: Can't resolve 'easemob-websdk/dist/strophe-1.2.8-g.js' in '<YourRootDir>/demo/src/config'
```
FIX: 没有执行 npm link easemob-websdk
 
3. 执行npm start时如果出现
> node scripts/start.js

/Users/wenke/www/web-im/demo/scripts/start.js:23
const {
^

SyntaxError: Unexpected token {
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:373:25)
at Object.Module._extensions..js (module.js:416:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Function.Module.runMain (module.js:441:10)
at startup (node.js:139:18)
at node.js:974:3
FIX: 请检查node版本是否是v6.0+
 
4. Redux State 的数据结构如下:
{
// ---------------------------------
// 响应式断点
// ---------------------------------
//xs: "480px"
//sm: "768px"
//md: "992px"
//lg: "1200px"
//xl: "1600px"
breakpoint: {
xs: false,
sm: false,
md: false,
lg: false,
xl: false
},

// ---------------------------------
// UI相关
// ---------------------------------
common: {
fetching: false,
isGetGroupAlready: true,
isGetChatRoomAlready: false,
showGroupRequestModal: false //群主管理加入群消息
},

// ---------------------------------
// 用户登录信息
// ---------------------------------
login: {
username: 'sunylt',
password: null,
token: "YWMtZ0m-opwTEeeS-e0Ko59rsU1-S6DcShHjkNXh_7qs2vV",
fetching: false,
error: false
isLogin: true,
},

// ---------------------------------
// 多语言
// ---------------------------------
i18n: {

// 已配置语言
translations: {
cn: {},
us: {},
},

// 当前语言
locale: "cn"
},


// 注册信息,没进行注册操作为{}
register: {
username: "123abcdbb",
password: "123",
fetching: false,
registerError: null
},

// 预留 暂无用
contacts: {}

// 预留 暂无用
im: {}

// ---------------------------------
// 数据实体
// ---------------------------------
entities: {
// 好友
roster: {
byName: {
name: { subscription,jid, ask, name, groups }
...
},
names: ['lwz2' ...],
// 好友列表在此,因为好友列表来源于roster,息息相关
friends: ,
},
// 群组
group: {
loadingFailed: <Boolean>,
isLoading: <Booleadn>,
rightSiderOffset: <Number>, //控制右侧群组管理面板
byId: {
groupId: {groupid, groupname},
....
},
names: [groupName_#-#_groupId, ....]
},
// 聊天室
chatroom: {
byId: {
chatId: {chatId, name, owner, affiliations_count}
...
},
names: [chatName_#-#_chatId, ....]
},
// 陌生人
stranger: {
},

// 群组成员信息
groupMember: {
groupId: {
muted: {byName: {}},//群主可见,禁言列表
byName: {
name: {name: <String: name>, affiliation: 'member'}
},
names: ,
admins: , //群管理员可见
},
...
}

// 订阅通知
subscribe: {
byFrom: {}
},

// 黑名单列表
blacklist: {
byName: {}
name:
},

// 消息
message: {

// 所有消息
byId: {
mid: {"type":"chat|groupchat|chatroom|stranger|error", "chatId": <String: chatId>},
...
}

// 单聊消息列表
chat: {
chatId: [
{message},
...
]
},

// 群组消息列表
groupChat: {
chatId: [
{message},
...
]
},

// 聊天室消息列表
chatroom: {
chatId: [
{message},
...
]
},

// 陌生人消息列表
stranger: {
chatId: [
{message},
...
]
},

// 预留 暂无用
extra: {}

// 未读消息记录
unread: {
// 好友
chat: {
chatId: <Number: unreadNum>,
...
},
// 群组
groupchat: {
chatId: <Number: unreadNum>,
...
},
// 聊天室
chatroom: {
chatId: <Number: unreadNum>,
...
},
// 陌生人
stranger: {
chatId: <Number: unreadNum>,
...
}
}

// 自己发的消息mid跟本地id对照
byMid: {
messageId: {id: <String: localId>},
...
},
},

// 加入群申请
groupRequest: {
byGid: {}
}
}
}
1
评论

【产品快递】Web IM V1.1.3发布,支持自动重连 webim 产品快递

产品更新 发表了文章 • 1007 次浏览 • 2016-11-01 15:18 • 来自相关话题

功能改进:

DEMO
支持 Windows SDK。http://www.easemob.com/download/im 

新增黑名单功能。

获取聊天室列表: 支持分页、下拉刷新,新增以下2个参数:pagenum 和 pagesize。

调试更方便,webpack 支持开发和生产模式。

`npm run dev`:开发模式,支持热加载,启动一个供调试的webserve http://localhost:3000。 

`npm run prod`:生产模式,编译速度更快。

群组增加以下功能:创建群组、修改群组名称、修改群组简介、群组成员管理、加入公开群。

strophe 从 v1.2.2 升级到 v1.2.8,在生产模式使用 strophe-1.2.8.min.js, 在开发模式使用 strophe.js。

SDK
 支持自动重连: 在 webim.config.js 文件中新增相关参数 `autoReconnectNumMax` 和`autoReconnectInterval`。
Bug fixes:

DEMO
 增加 `babel-core/browser-polyfill.js`文件,修复了 IE 不支持 HTML5 elements 的 bug。

 修复了有未读消息时点击联系人不生效的bug。

 修复了strophe.js v1.2.8在IE9中使用BOSH会报错的bug。
https://github.com/strophe/strophejs/issues/213

SDK
修复了存在大量离线消息时收发消息延迟的bug。客户端将发送ack应答消息的速度限制在5个/秒,不影响其他正常消息。

将心跳消息从空body的 json message 切换为 ping/pong iq。前者会作为离线消息被XMPP Server缓存。
 
webim体验:http://webim.easemob.com/

版本历史:更新日志     
 
SDK下载:点击下载 查看全部
358-210(2).jpg

  • 功能改进:


DEMO

支持 Windows SDK。http://www.easemob.com/download/im 

新增黑名单功能。

获取聊天室列表: 支持分页、下拉刷新,新增以下2个参数:pagenum 和 pagesize。

调试更方便,webpack 支持开发和生产模式。

`npm run dev`:开发模式,支持热加载,启动一个供调试的webserve http://localhost:3000。 

`npm run prod`:生产模式,编译速度更快。

群组增加以下功能:创建群组、修改群组名称、修改群组简介、群组成员管理、加入公开群。

strophe 从 v1.2.2 升级到 v1.2.8,在生产模式使用 strophe-1.2.8.min.js, 在开发模式使用 strophe.js。



SDK

 支持自动重连: 在 webim.config.js 文件中新增相关参数 `autoReconnectNumMax` 和`autoReconnectInterval`。


  • Bug fixes:


DEMO

 增加 `babel-core/browser-polyfill.js`文件,修复了 IE 不支持 HTML5 elements 的 bug。

 修复了有未读消息时点击联系人不生效的bug。

 修复了strophe.js v1.2.8在IE9中使用BOSH会报错的bug。
https://github.com/strophe/strophejs/issues/213



SDK

修复了存在大量离线消息时收发消息延迟的bug。客户端将发送ack应答消息的速度限制在5个/秒,不影响其他正常消息。

将心跳消息从空body的 json message 切换为 ping/pong iq。前者会作为离线消息被XMPP Server缓存。


 
webim体验:http://webim.easemob.com/

版本历史:更新日志     
 
SDK下载:点击下载
1
评论

环信webim1.1.2版本在windows下npm环境搭建错误解决 webim

easonjim 发表了文章 • 1137 次浏览 • 2016-09-01 01:33 • 来自相关话题

1.1.2版本的webim从ui到整体的代码结构都做了很大改变,从代码结构上采用node.js的环境进行开发和打包,最终打包的输出项目,不依赖node.js的环境进行运行,得益于webpack的打包实现。

这里有详细的管网介绍:http://www.imgeek.org/article/825308179

下载地址:https://github.com/easemob/web ... 1.1.2

先说明一下在搭建node.js环境时到打包碰到的问题:

前提:必须成功搭建了node.js环境才能进行以下步骤,可以参考这篇文章进行搭建:http://xiaoyaojones.blog.163.c ... 3581/

1、如果在https://nodejs.org/en/官网下载的v4.5.0 LTS,然后进行npm install命令之后再进行webpack命令,会提示以下错误:






解决方法:使用会5.10.1版本的进行npm install->webpack,然后就能成功打包。

2、上面一步中,很大机率会出现webpack不是系统命令,如果出现这样的问题,一种是webpack的包安装不是全局,webim采用的就是局部安装,只是项目上引用局部模块非常方便,也不会出现太多的莫名奇怪的冲突问题;

可以通过以下方式解决:

①用npm install -g命令安装webpack为全局模块,然后即可使用webpack命令。

②既然要局部,那就直接局部使用;经过分析,调用webpack命令时其实就是一个cmd批处理,查看批处理会发现,就是node + “xxx.js”的形式存在,那么我们可以这样变通一下,命令行进入到webim的目录运行如下命令:

node ./node_modules/webpack/bin\webpack.js -config webpack.config.js

③还有一种方式,那就是通过package.json进行开刀,在scripts节点上增加"start":"webpack",然后在命令行上运行npm start同样能达到打包的效果。

注意:以上运行的命令行一定要以管理员的身份运行

题外:新版的webim需要用的知识比较多,可以按照这样的顺序进行突破:node.js->npm->react->webpack
  查看全部
1.1.2版本的webim从ui到整体的代码结构都做了很大改变,从代码结构上采用node.js的环境进行开发和打包,最终打包的输出项目,不依赖node.js的环境进行运行,得益于webpack的打包实现。

这里有详细的管网介绍:http://www.imgeek.org/article/825308179

下载地址:https://github.com/easemob/web ... 1.1.2

先说明一下在搭建node.js环境时到打包碰到的问题:

前提:必须成功搭建了node.js环境才能进行以下步骤,可以参考这篇文章进行搭建:http://xiaoyaojones.blog.163.c ... 3581/

1、如果在https://nodejs.org/en/官网下载的v4.5.0 LTS,然后进行npm install命令之后再进行webpack命令,会提示以下错误:

QQ图片20160901010009.png


解决方法:使用会5.10.1版本的进行npm install->webpack,然后就能成功打包。

2、上面一步中,很大机率会出现webpack不是系统命令,如果出现这样的问题,一种是webpack的包安装不是全局,webim采用的就是局部安装,只是项目上引用局部模块非常方便,也不会出现太多的莫名奇怪的冲突问题;

可以通过以下方式解决:

①用npm install -g命令安装webpack为全局模块,然后即可使用webpack命令。

②既然要局部,那就直接局部使用;经过分析,调用webpack命令时其实就是一个cmd批处理,查看批处理会发现,就是node + “xxx.js”的形式存在,那么我们可以这样变通一下,命令行进入到webim的目录运行如下命令:

node ./node_modules/webpack/bin\webpack.js -config webpack.config.js

③还有一种方式,那就是通过package.json进行开刀,在scripts节点上增加"start":"webpack",然后在命令行上运行npm start同样能达到打包的效果。

注意:以上运行的命令行一定要以管理员的身份运行

题外:新版的webim需要用的知识比较多,可以按照这样的顺序进行突破:node.js->npm->react->webpack
 
5
评论

【产品快递】Web IM V1.1.2发布,新版demo,全新SDK目录等你来体验 产品快递 webim

beyond 发表了文章 • 1535 次浏览 • 2016-08-15 15:59 • 来自相关话题

版本:V1.1.2 2016-8-12

功能改进:
新版demo添加isAutoLogoin参数,默认setPresence拆分sdk为四个文件,最终打包成一个webim.im.sdk.js增加try catch,尽量减少因为外部的错误导致的连接断开修改错误码,不在返回错误提示消息,在文档体现

Bug fix:
无法传file_length特殊字符无法显示im用户为数字时,toLowercase报错发送音频增加时长参数
 
环信 WebIM sdk
测试环信WebIM请访问 https://webim.easemob.com更多关于环信的开发文档请见:https://docs.easemob.com
 
什么是环信 Web IM Demo

环信 Web IM Demo 展示了怎样使用环信 Web IM SDK 快速创建一个完整的类似微信的网页聊天示例。展示的功能包括:登录,登出,操作好友,收发个人消息、群组消息。

环信 Web IM 源代码已在 GitHub 上开源供开发者下载 https://github.com/easemob/web-im,以帮助开发者更好的学习了解环信 SDK。

Demo使用react框架,支持IE9+、Chrome、Firefox等高级浏览器。SDK支持IE8+。

下载环信 Web IM Demo
下载环信Web IM及SDK:下载目录简要说明:
 
demo:demo相关静态资源文件。包括脚本、样式、语言包、Appkey配置文件(/demo/javascript/dist/webim.config.js)等sdk:WebIM SDKpackage.json: 构建环境依赖文件。需要安装npm环境,终端执行sudo npm intall等待安装完成webpack.config.js: webpack配置文件

运行环信 Web IM

运行方式有两种:
直接使用浏览器打开 index.html 文件。(注:ie9需要使用下面的方式)将Demo部署到 web 服务器通过 URL 访问 index.html。

Web IM 功能演示

点击http://webim.easemob.com 对 Web IM 进行体验,账号为环信Demo的账号(与 Android、iOS 的 Demo 账号相同)。

Web IM 功能说明

Easemob Web IM SDK 已支持如下功能:

1. SDK 本身已支持 IE8+、FireFox10+、Chrome15+、Safari6+ 之间文本、表情、图片、音频消息相互发送。

2. SDK 支持 Web 端之间,Web 端与 Android/iOS端相互添加、删除好友功能。

3. SDK 支持与iOS、Android SDK 之间相互发送文本、图片、音频、地址消息。

4. SDK 对于消息的处理方式如下:
文本、表情消息,直接发送、接收。附件消息(图片、音频、文件等),SDK上传附件到服务器,然后发送附件基本信息(发送方上传的附件URL、文件名等),接收方根据附件的URL、secret和自身的登录信息,以流的形式从服务器上下载到本地处理。

5. 提供Demo,方便大家参考,已实现聊天添加/删除好友/群组功能。

备注:
Demo默认支持的图片消息格式:PNG、JPG、BMP、GIF;Demo默认支持的音频消息格式:MP3、AMR、WMV;Demo默认支持的文件消息格式:PNG、JPG、BMP、GIF、zip、txt、doc、pdf; 查看全部
WebIM.jpg

版本:V1.1.2 2016-8-12

功能改进:
  • 新版demo
  • 添加isAutoLogoin参数,默认setPresence
  • 拆分sdk为四个文件,最终打包成一个webim.im.sdk.js
  • 增加try catch,尽量减少因为外部的错误导致的连接断开
  • 修改错误码,不在返回错误提示消息,在文档体现


Bug fix:
  • 无法传file_length
  • 特殊字符无法显示
  • im用户为数字时,toLowercase报错
  • 发送音频增加时长参数

 
环信 WebIM sdk

 
什么是环信 Web IM Demo

环信 Web IM Demo 展示了怎样使用环信 Web IM SDK 快速创建一个完整的类似微信的网页聊天示例。展示的功能包括:登录,登出,操作好友,收发个人消息、群组消息。

环信 Web IM 源代码已在 GitHub 上开源供开发者下载 https://github.com/easemob/web-im,以帮助开发者更好的学习了解环信 SDK。

Demo使用react框架,支持IE9+、Chrome、Firefox等高级浏览器。SDK支持IE8+。

下载环信 Web IM Demo
  1. 下载环信Web IM及SDK:下载
  2. 目录简要说明:

 
  • demo:demo相关静态资源文件。包括脚本、样式、语言包、Appkey配置文件(/demo/javascript/dist/webim.config.js)等
  • sdk:WebIM SDK
  • package.json: 构建环境依赖文件。需要安装npm环境,终端执行sudo npm intall等待安装完成
  • webpack.config.js: webpack配置文件


运行环信 Web IM

运行方式有两种:
  • 直接使用浏览器打开 index.html 文件。(注:ie9需要使用下面的方式)
  • 将Demo部署到 web 服务器通过 URL 访问 index.html。


Web IM 功能演示

点击http://webim.easemob.com 对 Web IM 进行体验,账号为环信Demo的账号(与 Android、iOS 的 Demo 账号相同)。

Web IM 功能说明

Easemob Web IM SDK 已支持如下功能:

1. SDK 本身已支持 IE8+、FireFox10+、Chrome15+、Safari6+ 之间文本、表情、图片、音频消息相互发送。

2. SDK 支持 Web 端之间,Web 端与 Android/iOS端相互添加、删除好友功能。

3. SDK 支持与iOS、Android SDK 之间相互发送文本、图片、音频、地址消息。

4. SDK 对于消息的处理方式如下:
  • 文本、表情消息,直接发送、接收。
  • 附件消息(图片、音频、文件等),SDK上传附件到服务器,然后发送附件基本信息(发送方上传的附件URL、文件名等),接收方根据附件的URL、secret和自身的登录信息,以流的形式从服务器上下载到本地处理。


5. 提供Demo,方便大家参考,已实现聊天添加/删除好友/群组功能。

备注:
  • Demo默认支持的图片消息格式:PNG、JPG、BMP、GIF;
  • Demo默认支持的音频消息格式:MP3、AMR、WMV;
  • Demo默认支持的文件消息格式:PNG、JPG、BMP、GIF、zip、txt、doc、pdf;

0
评论

15个Chrome中的开发技巧 chrome webim

beyond 发表了文章 • 763 次浏览 • 2016-08-09 16:02 • 来自相关话题

    如果你是一位开发者,相信你肯定不会对Chrome浏览器感到陌生。根据一份最新的浏览器市场占有率报告,Chrome近乎占有浏览器天下的半壁江山。如果你是一名web开发人员,我推荐你使用Chrome。作为前端开发的"IDE",你只需要搭配一个编辑器就能完成几乎所有的开发任务了。在Web开发者中,Google Chrome是使用最广泛的浏览器。六周一次的发布周期和一套强大的不断扩大开发功能,使其成为了web开发者必备的工具。本文分享15个有助于改进你的开发流程的技巧。

一、快速切换文件

如果你使用过sublime text,那么你可能不习惯没有Go to anything这个功能的覆盖。你会很高兴听到chrome开发者功能也有这个功能,当DevTools被打开的时候,按Ctrl+P(cmd+p on mac),就能快速搜寻和打开你项目的文件。




快速切换文件
二、在源代码中搜索

如果你希望在源代码中搜索要怎么办呢?在页面已经加载的文件中搜寻一个特定的字符串,快捷键是Ctrl + Shift + F (Cmd + Opt + F),这种搜寻方式还支持正则表达式哦




在源代码中搜索
三、快速跳转到指定行

在Sources标签中打开一个文件之后,在Windows和Linux中,按Ctrl + G,(or Cmd + L for Mac),然后输入行号,DevTools就会允许你跳转到文件中的任意一行。




快速跳转到指定行
另外一种方式是按Ctrl + O,输入:和行数,而不用去寻找一个文件。
 
四、在控制台选择元素

DevTools控制台支持一些变量和函数来选择DOM元素:

$()–document.querySelector()的简写,返回第一个和css选择器匹配的元素。例如$(‘div’)返回这个页面中第一个div元素
$$()–document.querySelectorAll()的简写,返回一个和css选择器匹配的元素数组。
$0-$4–依次返回五个最近你在元素面板选择过的DOM元素的历史记录,$0是最新的记录,以此类推。




在控制台选择元素
五、使用多个插入符进行选择

当编辑一个文件的时候,你可以按住Ctrl(cmd for mac),在你要编辑的地方点击鼠标,可以设置多个插入符,这样可以一次在多个地方编辑。




使用多个插入符进行选择
六、保存记录

勾选在Console标签下的保存记录选项,你可以使DevTools的console继续保存记录而不会在每个页面加载之后清除记录。当你想要研究在页面还没加载完之前出现的bug时,这会是一个很方便的方法。




保存记录
 
七、优质打印

Chrome’s Developer Tools有内建的美化代码,可以返回一段最小化且格式易读的代码。Pretty Print的按钮在Sources标签的左下角。




优质打印
八、设备模式

对于开发移动友好页面,DevTools包含了一个非常强大的模式,这个谷歌视频介绍了其主要特点,如调整屏幕大小、触摸仿真和模拟糟糕的网络连接。




设备模式

九、设备传感仿真

设备模式的另一个很酷的功能是模拟移动设备的传感器,例如触摸屏幕和加速计。你甚至可以恶搞你的地理位置。这个功能位于元素标签的底部,点击“show drawer”按钮,就可看见Emulation标签 --> Sensors。




设备传感仿真
 
十、颜色选择器

当在样式编辑中选择了一个颜色属性时,你可以点击颜色预览,就会弹出一个颜色选择器。当选择器开启时,如果你停留在页面,鼠标指针会变成一个放大镜,让你去选择像素精度的颜色。




颜色选择器
 
十一、强制改变元素状态

DevTools有一个可以模拟CSS状态的功能,例如元素的hover和focus,可以很容易的改变元素样式。在CSS编辑器中可以利用这个功能。




强制改变元素状态
十二、可视化的DOM阴影

Web浏览器在构建如文本框、按钮和输入框一类元素时,其它基本元素的视图是隐藏的。不过,你可以在Settings -> General 中切换成Show user agent shadow DOM,这样就会在元素标签页中显示被隐藏的代码。甚至还能单独设计他们的样式,这给你了很大的控制权。




可视化的DOM阴影
 
十三、选择下一个匹配项

当在Sources标签下编辑文件时,按下Ctrl + D (Cmd + D) ,当前选中的单词的下一个匹配也会被选中,有利于你同时对它们进行编辑。




选择下一个匹配项
 
十四、改变颜色格式

在颜色预览功能使用快捷键Shift + Click,可以在rgba、hsl和hexadecimal来回切换颜色的格式。




改变颜色格式
 
十五、通过workspaces来编辑本地 文件

Workspaces是Chrome DevTools的一个强大功能,这使DevTools变成了一个真正的IDE。Workspaces会将Sources选项卡中的文件和本地项目中的文件进行匹配,所以你可以直接编辑和保存,而不必复制/粘贴外部改变的文件到编辑器。

为了配置Workspaces,只需打开Sources选项,然后右击左边面板的任何一个地方,选择Add Folder To Worskpace,或者只是把你的整个工程文件夹拖放入Developer Tool。现在,无论在哪一个文件夹,被选中的文件夹,包括其子目录和所有文件都可以被编辑。为了让Workspaces更高效,你可以将页面中用到的文件映射到相应的文件夹,允许在线编辑和简单的保存。 查看全部
    如果你是一位开发者,相信你肯定不会对Chrome浏览器感到陌生。根据一份最新的浏览器市场占有率报告,Chrome近乎占有浏览器天下的半壁江山。如果你是一名web开发人员,我推荐你使用Chrome。作为前端开发的"IDE",你只需要搭配一个编辑器就能完成几乎所有的开发任务了。在Web开发者中,Google Chrome是使用最广泛的浏览器。六周一次的发布周期和一套强大的不断扩大开发功能,使其成为了web开发者必备的工具。本文分享15个有助于改进你的开发流程的技巧。

一、快速切换文件

如果你使用过sublime text,那么你可能不习惯没有Go to anything这个功能的覆盖。你会很高兴听到chrome开发者功能也有这个功能,当DevTools被打开的时候,按Ctrl+P(cmd+p on mac),就能快速搜寻和打开你项目的文件。

1714316-3f5e3c22736f3be7.gif

快速切换文件


二、在源代码中搜索

如果你希望在源代码中搜索要怎么办呢?在页面已经加载的文件中搜寻一个特定的字符串,快捷键是Ctrl + Shift + F (Cmd + Opt + F),这种搜寻方式还支持正则表达式哦

1714316-211b51988aef8f1f.gif

在源代码中搜索


三、快速跳转到指定行

在Sources标签中打开一个文件之后,在Windows和Linux中,按Ctrl + G,(or Cmd + L for Mac),然后输入行号,DevTools就会允许你跳转到文件中的任意一行。

1714316-def471241b0cb500.gif

快速跳转到指定行


另外一种方式是按Ctrl + O,输入:和行数,而不用去寻找一个文件。
 
四、在控制台选择元素

DevTools控制台支持一些变量和函数来选择DOM元素:

$()–document.querySelector()的简写,返回第一个和css选择器匹配的元素。例如$(‘div’)返回这个页面中第一个div元素
$$()–document.querySelectorAll()的简写,返回一个和css选择器匹配的元素数组。
$0-$4–依次返回五个最近你在元素面板选择过的DOM元素的历史记录,$0是最新的记录,以此类推。

1714316-3a3ad1498b101829.gif

在控制台选择元素


五、使用多个插入符进行选择

当编辑一个文件的时候,你可以按住Ctrl(cmd for mac),在你要编辑的地方点击鼠标,可以设置多个插入符,这样可以一次在多个地方编辑。

1714316-b1b717002c08d092.gif

使用多个插入符进行选择


六、保存记录

勾选在Console标签下的保存记录选项,你可以使DevTools的console继续保存记录而不会在每个页面加载之后清除记录。当你想要研究在页面还没加载完之前出现的bug时,这会是一个很方便的方法。

1714316-6b01f5e052aa5303.gif

保存记录


 
七、优质打印

Chrome’s Developer Tools有内建的美化代码,可以返回一段最小化且格式易读的代码。Pretty Print的按钮在Sources标签的左下角。

1714316-3445643968682add.gif

优质打印


八、设备模式

对于开发移动友好页面,DevTools包含了一个非常强大的模式,这个谷歌视频介绍了其主要特点,如调整屏幕大小、触摸仿真和模拟糟糕的网络连接。

1714316-adbd0cfcc727f787.png

设备模式



九、设备传感仿真

设备模式的另一个很酷的功能是模拟移动设备的传感器,例如触摸屏幕和加速计。你甚至可以恶搞你的地理位置。这个功能位于元素标签的底部,点击“show drawer”按钮,就可看见Emulation标签 --> Sensors。

1714316-72e0730ff49f4fc6.gif

设备传感仿真


 
十、颜色选择器

当在样式编辑中选择了一个颜色属性时,你可以点击颜色预览,就会弹出一个颜色选择器。当选择器开启时,如果你停留在页面,鼠标指针会变成一个放大镜,让你去选择像素精度的颜色。

1714316-c6a331a08722a76e.gif

颜色选择器


 
十一、强制改变元素状态

DevTools有一个可以模拟CSS状态的功能,例如元素的hover和focus,可以很容易的改变元素样式。在CSS编辑器中可以利用这个功能。

1714316-30f876f5791f7cb0.gif

强制改变元素状态


十二、可视化的DOM阴影

Web浏览器在构建如文本框、按钮和输入框一类元素时,其它基本元素的视图是隐藏的。不过,你可以在Settings -> General 中切换成Show user agent shadow DOM,这样就会在元素标签页中显示被隐藏的代码。甚至还能单独设计他们的样式,这给你了很大的控制权。

1714316-4540379689508bf9.gif

可视化的DOM阴影


 
十三、选择下一个匹配项

当在Sources标签下编辑文件时,按下Ctrl + D (Cmd + D) ,当前选中的单词的下一个匹配也会被选中,有利于你同时对它们进行编辑。

1714316-60021f3bb92aab5e.gif

选择下一个匹配项


 
十四、改变颜色格式

在颜色预览功能使用快捷键Shift + Click,可以在rgba、hsl和hexadecimal来回切换颜色的格式。

1714316-7a17a919f4e01687.gif

改变颜色格式


 
十五、通过workspaces来编辑本地 文件

Workspaces是Chrome DevTools的一个强大功能,这使DevTools变成了一个真正的IDE。Workspaces会将Sources选项卡中的文件和本地项目中的文件进行匹配,所以你可以直接编辑和保存,而不必复制/粘贴外部改变的文件到编辑器。

为了配置Workspaces,只需打开Sources选项,然后右击左边面板的任何一个地方,选择Add Folder To Worskpace,或者只是把你的整个工程文件夹拖放入Developer Tool。现在,无论在哪一个文件夹,被选中的文件夹,包括其子目录和所有文件都可以被编辑。为了让Workspaces更高效,你可以将页面中用到的文件映射到相应的文件夹,允许在线编辑和简单的保存。
0
评论

JS区分浏览器中页面刷新与关闭标签页 js刷新当前页面 webim JS区分浏览器中页面刷新与关闭标签页

beyond 发表了文章 • 2711 次浏览 • 2016-04-18 17:04 • 来自相关话题

文章摘要:js刷新当前页面,Web开发者在系统开发中经常要面对产品经理各式各样的需求,当然,大部分对产品体验还是有帮助的,例如我们今天提到的刷新页面,前进后退,关闭浏览器标签时,为了避免用户误操作,需给出二次确认提示框,这个相信大家都非常熟悉了,采用浏览器提供的BOM事件机制就可以...

   Web开发者在系统开发中经常要面对产品经理各式各样的需求,当然,大部分对产品体验还是有帮助的,例如我们今天提到的刷新页面,前进后退,关闭浏览器标签时,为了避免用户误操作,需给出二次确认提示框,这个相信大家都非常熟悉了,采用浏览器提供的BOM事件机制就可以解决,使用window对象的onbeforeunload事件即可,如果产品经理只提出这样的需求,那确实无可厚非,然而其需要的不仅仅是这些...

例如,我们一次项目开发中,产品经理就针对我们的实现提出了“改进方案”:
你们这弹出框太丑了,跟系统整体风格不搭调啊,不能使用咱们自己组件库中的Dialog吗?很好的问题...我只想说,you can you up...你们这刷新和关闭标签页中展示的文案一样啊,需要区分对待下,刷新提示XXX,关闭时提示SSS,这样用户才能更明确。恩,考虑到了用户的体验,很好,我还是想说,you can you up...其实,浏览器在关闭和刷新时,本身已经区别对待了,提示是不同的,只不过我们自定义的部分并不能显示不同的文案而已;当然,也有一些hack的方法,但是很难适应多个浏览器,各浏览器内部对于关闭标签页和刷新的实现机制会有所不同;你们每次登录进来,为什么要延时10秒,才让坐席签入电话系统啊(我们做的是客服系统)?能不能把这个限制去掉啊,用户体验太不好了!我们也想去掉啊,但是电话系统频繁签入签出会有问题,用户刷新了浏览器,再次签入,如果相隔时间很短的话,电话系统会出现故障,为了避免这个问题,我们才加上了这个限制,但是回过头来思考,就可以进入我们今天讨论的主题了;


区分刷新与关闭标签页

我们无法根据浏览器事件区分刷新还是关闭标签页,进而在相应动作触发前,执行不同的动作,但是对于上文中产品提出的第三点意见,其实还是可以考虑优化一下的,就是只有在刷新的时候延时10秒,新登录或关闭标签页一段时间之后再进来时不延时;

要做到这点其实也很简单,使用浏览器的本地存储机制就可以实现,例如cookie,LocalStorage等,这里就不能使用SessionStorage了,因为本次回话结束后,该缓存就失效了;由于在cookie中存储会增加cookie的字节数,每次请求中相应的网络传输量会增加,因此,我们采用了LocalStorage;其操作很简单,我们使用的前端框架是AngularJS,具体如下:const MAX_WAIT_TIME = 10;
const currentDate = new Date().getTime();
const lastestLeaveTime = parseInt(this.$window.localStorage.getItem('lastestLeaveTime'), 10) || currentDate;
this.secondCounter = Math.max(MAX_WAIT_TIME - Math.ceil((currentDate - lastestLeaveTime) / 1000), 0);
if (this.secondCounter > 0) {
this.logoutTimeInterval = this.$interval(()=> {
this.secondCounter--;
this.$scope.$digest();
}, 1000, this.secondCounter, false).then(() => {
this.updateByStatus(this.AvayaService.status.OFFLINE);
});
} else {
this.updateByStatus(this.AvayaService.status.OFFLINE);
}上面代码主要作用是,进入系统后,会先去LocalStorage中获取上次退出时的时间,再获取当前时间,两个时间进行减法,如果值小于10秒,我们就认为这是刷新,如果值大于10秒,我们认为是关闭标签页或新登录,进而可以执行不同的方法,让客服有更好的体验,不用每次进入系统都要等待10秒才能签入电话系统了,产品经理还是很重要的,吼吼,要不是他的疑问,可能我们也不会来优化这个地方了...当然,其实RD也要逐渐培养这种用户体验至上的思维,哪怕有一点可提升客服效率的地方,都值得我们花时间来优化;

下面把相关退出的代码也贴一下吧,前面忘说了,不管是刷新,还是关闭标签页,只要是页面销毁,我们都会去执行登出电话系统的操作,所以每次进来后需要重新签入;//刷新页面或者关闭页面
$window.onbeforeunload = () => {
return '操作将会导致页面数据清空,请谨慎操作...';
};//每次页面unload时,设置LocalStorage时间;
$window.onunload = () => {
$window.localStorage.setItem('lastestLeaveTime', new Date().getTime());
};我们可能还注意到一些问题,那就是刷新,关闭页面,前进后退,你需要跳出浏览器默认二次确认框,但是用户点击退出系统按钮,则必须弹出自己组件库中的Dialog了,还必须不能两个都弹出,具体代码如下:onStatusClick(index, name) {
if (name === '退出') {
this.mgDialog.openConfirm({
showClose: false,
template: 'app/header/logoutDialog.html',
controller: 'HeaderDialogController as dialog',
data: {
'title': '您确定要退出系统吗?'
}
}).then(() => {
this.$window.location.href = '/logout';
this.$window.onbeforeunload = null;
});
} else {
// 内部操作,大家不用管
...
}
} 查看全部
文章摘要:js刷新当前页面,Web开发者在系统开发中经常要面对产品经理各式各样的需求,当然,大部分对产品体验还是有帮助的,例如我们今天提到的刷新页面,前进后退,关闭浏览器标签时,为了避免用户误操作,需给出二次确认提示框,这个相信大家都非常熟悉了,采用浏览器提供的BOM事件机制就可以...

   Web开发者在系统开发中经常要面对产品经理各式各样的需求,当然,大部分对产品体验还是有帮助的,例如我们今天提到的刷新页面,前进后退,关闭浏览器标签时,为了避免用户误操作,需给出二次确认提示框,这个相信大家都非常熟悉了,采用浏览器提供的BOM事件机制就可以解决,使用window对象的onbeforeunload事件即可,如果产品经理只提出这样的需求,那确实无可厚非,然而其需要的不仅仅是这些...

例如,我们一次项目开发中,产品经理就针对我们的实现提出了“改进方案”:
  1. 你们这弹出框太丑了,跟系统整体风格不搭调啊,不能使用咱们自己组件库中的Dialog吗?很好的问题...我只想说,you can you up...
  2. 你们这刷新和关闭标签页中展示的文案一样啊,需要区分对待下,刷新提示XXX,关闭时提示SSS,这样用户才能更明确。恩,考虑到了用户的体验,很好,我还是想说,you can you up...其实,浏览器在关闭和刷新时,本身已经区别对待了,提示是不同的,只不过我们自定义的部分并不能显示不同的文案而已;当然,也有一些hack的方法,但是很难适应多个浏览器,各浏览器内部对于关闭标签页和刷新的实现机制会有所不同;
  3. 你们每次登录进来,为什么要延时10秒,才让坐席签入电话系统啊(我们做的是客服系统)?能不能把这个限制去掉啊,用户体验太不好了!我们也想去掉啊,但是电话系统频繁签入签出会有问题,用户刷新了浏览器,再次签入,如果相隔时间很短的话,电话系统会出现故障,为了避免这个问题,我们才加上了这个限制,但是回过头来思考,就可以进入我们今天讨论的主题了;



区分刷新与关闭标签页

我们无法根据浏览器事件区分刷新还是关闭标签页,进而在相应动作触发前,执行不同的动作,但是对于上文中产品提出的第三点意见,其实还是可以考虑优化一下的,就是只有在刷新的时候延时10秒,新登录或关闭标签页一段时间之后再进来时不延时;

要做到这点其实也很简单,使用浏览器的本地存储机制就可以实现,例如cookie,LocalStorage等,这里就不能使用SessionStorage了,因为本次回话结束后,该缓存就失效了;由于在cookie中存储会增加cookie的字节数,每次请求中相应的网络传输量会增加,因此,我们采用了LocalStorage;其操作很简单,我们使用的前端框架是AngularJS,具体如下:
const MAX_WAIT_TIME = 10;
const currentDate = new Date().getTime();
const lastestLeaveTime = parseInt(this.$window.localStorage.getItem('lastestLeaveTime'), 10) || currentDate;
this.secondCounter = Math.max(MAX_WAIT_TIME - Math.ceil((currentDate - lastestLeaveTime) / 1000), 0);
if (this.secondCounter > 0) {
this.logoutTimeInterval = this.$interval(()=> {
this.secondCounter--;
this.$scope.$digest();
}, 1000, this.secondCounter, false).then(() => {
this.updateByStatus(this.AvayaService.status.OFFLINE);
});
} else {
this.updateByStatus(this.AvayaService.status.OFFLINE);
}
上面代码主要作用是,进入系统后,会先去LocalStorage中获取上次退出时的时间,再获取当前时间,两个时间进行减法,如果值小于10秒,我们就认为这是刷新,如果值大于10秒,我们认为是关闭标签页或新登录,进而可以执行不同的方法,让客服有更好的体验,不用每次进入系统都要等待10秒才能签入电话系统了,产品经理还是很重要的,吼吼,要不是他的疑问,可能我们也不会来优化这个地方了...当然,其实RD也要逐渐培养这种用户体验至上的思维,哪怕有一点可提升客服效率的地方,都值得我们花时间来优化;

下面把相关退出的代码也贴一下吧,前面忘说了,不管是刷新,还是关闭标签页,只要是页面销毁,我们都会去执行登出电话系统的操作,所以每次进来后需要重新签入;
//刷新页面或者关闭页面
$window.onbeforeunload = () => {
return '操作将会导致页面数据清空,请谨慎操作...';
};
//每次页面unload时,设置LocalStorage时间;
$window.onunload = () => {
$window.localStorage.setItem('lastestLeaveTime', new Date().getTime());
};
我们可能还注意到一些问题,那就是刷新,关闭页面,前进后退,你需要跳出浏览器默认二次确认框,但是用户点击退出系统按钮,则必须弹出自己组件库中的Dialog了,还必须不能两个都弹出,具体代码如下:
onStatusClick(index, name) {
if (name === '退出') {
this.mgDialog.openConfirm({
showClose: false,
template: 'app/header/logoutDialog.html',
controller: 'HeaderDialogController as dialog',
data: {
'title': '您确定要退出系统吗?'
}
}).then(() => {
this.$window.location.href = '/logout';
this.$window.onbeforeunload = null;
});
} else {
// 内部操作,大家不用管
...
}
}
3
评论

【产品快递】WebIm V1.1.0发布,网页端新增聊天室功能 聊天室 产品快递 webim

beyond 发表了文章 • 2983 次浏览 • 2016-04-11 19:18 • 来自相关话题

版本:V1.1.0 2016-4-6​:
功能改进:

1. 将表情包移除sdk,变为可自定义导入配置。
2. 增加XMPP连接多resource支持的参数。
3. 对于不支持wss,如qqX5内核浏览器,自动降级为https long polling。
4. 增加聊天室功能,在线聊天室列表,加入聊天室,退出聊天室等接口 
5. 与之前版本sdk部分api已不兼容,添加shim.js,做降级支持
6. 新增消息发送的成功失败回调
7. 重整目录结构,优化代码,bug fix
 
 
easemob webim sdk已支持如下功能:
1.sdk本身已支持IE8+、FireFox、Chrome、Safari之间文本、表情、图片、音频消息相互发送
2.sdk支持web端之间,web端与app端相互添加、删除好友功能
3.sdk支持与ios、android sdk见相互发送文本、图片、音频消息
4.sdk提供部分公共方法,具体参见quickstart.md
5.sdk对于消息的处理方式如下:
   1)文本消息,直接发送,接收方接收到为文本消息
   2)表情消息,sdk得到表情对应的编码后,发送的文本消息,接收方接收到后处理根据编码还原表情
   3)图片消息,sdk上传图片到聊天服务器,然后发送图片基本信息消息,消息中带有发送方上传的图片url等,接收方根据图片url、secret和自身的登录信息,以流的形式从服务器上下载图片到本地显示
   4)音频消息,sdk上传音频到聊天服务器,然后发送音频基本消息消息,消息中含有发送方上传的音频url等,接收房根据音频url、secret和自身的登录信息,以流的形式从服务器上下载音频到本地播放
6.跟随sdk会有简单的demo,方便大家参考,已实现简单的聊天添加删除好友功能。
7.对于amr格式音频FF、Chrome、IE、Safari已实现接收方对收到后音频下载,调用本地播放器实现播放。
8.支持群组线聊天功能,显示群组成员列表
9.支持陌生人聊天功能

测试环信WebIM请访问 https://webim.easemob.com

登录可以使用环信UIDemo的账号和密码(见http://www.easemob.com/demo)

环信WebIM快速入门文档请见:https://github.com/easemob/web-im/blob/master/static/sdk/quickstart.md

更多关于环信的开发文档请见:https://docs.easemob.com 
 
WebIm V1.1.0 下载
 
       ↓↓↓
  查看全部
24958PICwjQ_1024.jpg

版本:V1.1.0 2016-4-6​:

功能改进:

1. 将表情包移除sdk,变为可自定义导入配置。
2. 增加XMPP连接多resource支持的参数。
3. 对于不支持wss,如qqX5内核浏览器,自动降级为https long polling。
4. 增加聊天室功能,在线聊天室列表,加入聊天室,退出聊天室等接口 
5. 与之前版本sdk部分api已不兼容,添加shim.js,做降级支持
6. 新增消息发送的成功失败回调
7. 重整目录结构,优化代码,bug fix

 


 
easemob webim sdk已支持如下功能:

1.sdk本身已支持IE8+、FireFox、Chrome、Safari之间文本、表情、图片、音频消息相互发送
2.sdk支持web端之间,web端与app端相互添加、删除好友功能
3.sdk支持与ios、android sdk见相互发送文本、图片、音频消息
4.sdk提供部分公共方法,具体参见quickstart.md
5.sdk对于消息的处理方式如下:
   1)文本消息,直接发送,接收方接收到为文本消息
   2)表情消息,sdk得到表情对应的编码后,发送的文本消息,接收方接收到后处理根据编码还原表情
   3)图片消息,sdk上传图片到聊天服务器,然后发送图片基本信息消息,消息中带有发送方上传的图片url等,接收方根据图片url、secret和自身的登录信息,以流的形式从服务器上下载图片到本地显示
   4)音频消息,sdk上传音频到聊天服务器,然后发送音频基本消息消息,消息中含有发送方上传的音频url等,接收房根据音频url、secret和自身的登录信息,以流的形式从服务器上下载音频到本地播放
6.跟随sdk会有简单的demo,方便大家参考,已实现简单的聊天添加删除好友功能。
7.对于amr格式音频FF、Chrome、IE、Safari已实现接收方对收到后音频下载,调用本地播放器实现播放。
8.支持群组线聊天功能,显示群组成员列表
9.支持陌生人聊天功能



测试环信WebIM请访问 https://webim.easemob.com

登录可以使用环信UIDemo的账号和密码(见http://www.easemob.com/demo)

环信WebIM快速入门文档请见:https://github.com/easemob/web-im/blob/master/static/sdk/quickstart.md

更多关于环信的开发文档请见:https://docs.easemob.com 
 
WebIm V1.1.0 下载
 
       ↓↓↓
 
0
评论

环信直播课堂第一期 知识点干货分享和项目代码 环信直播 webim

beyond 发表了文章 • 1897 次浏览 • 2016-03-02 12:19 • 来自相关话题

以下为直播中记录的干货笔记,视频中写的webim集成项目在文章末尾附件下载Q:心跳的支持
A:连接成功的回调里面启动心跳

Q:环信发消息是否需要好友关系呢
A:不需要的 ,知道对方id就可以直接聊天
var options = {
//to : to,
to:'msgto',
msg : msg,
type : "chat"
};

Q:输入空消息的判断
A: var sendText = function() {
// if (textSending) {
// return;
//}

Q:自动登陆的 实现
A:$(function()
{
login();
}

)

Q:用户token 的登陆
A://根据用户名密码登录系统
conn.open({
apiUrl : Easemob.im.config.apiURL,
user : user,
// pwd : pass,
accessToken : "YWMtV8DgQt97EeWInF-xEd80TgAAAVRl-FixEr0I5NWLkYFefpM919W5-JU1Uvc",
//连接时提供appkey
appKey : Easemob.im.config.appkey
});

Q:多网页的共存
A:var resource_value = Math.floor(Math.random()*1000);
// var resource_value = "webim";

Q:刷新或者退出网页的时候提示
A: $(function() {
$(window).bind('beforeunload', function() {
if (conn) {
conn.close();
if (navigator.userAgent.indexOf("Firefox") > 0)
return ' ';
else
return '';
}
});
});

Q:低版本ie是否支持
A:支持ie789+,在调试的过程中需要本地配置服务

集成移动客服的时候,IM 服务号是干嘛的呢
A:
1:在客服后台绑定一个关联
指定一个im服务号

2:客户端联系客服的时候,写个按钮“联系客服”
调用了发消息的方法,接收对象 to=关联里面的 im服务号
消息发送过去之后 会到客服后台,根据分配策略分配给对应的客服

Q:网站集成环信移动客服
A:在</body>标签前加入这段代码
<script src='//kefu.easemob.com/webim/easemob.js?tenantId=327&hide=false' async='async'></script>

Q:这个按钮进行自定义
A:首先,将已嵌入网站中的JS插件代码中的hide=false修改为hide=true:(确保tenantId为自己的)
<a href="javascript:;" onclick="easemobIM()" tenantId=0000>自定义按钮</a>

Q:自定义联系客服的界面
A:[url]https://github.com/easemob/kefu-webim[/url]
 
直播中写的项目代码下载 ↓ ↓ 查看全部
以下为直播中记录的干货笔记,视频中写的webim集成项目在文章末尾附件下载
Q:心跳的支持
A:连接成功的回调里面启动心跳

Q:环信发消息是否需要好友关系呢
A:不需要的 ,知道对方id就可以直接聊天
var options = {
//to : to,
to:'msgto',
msg : msg,
type : "chat"
};

Q:输入空消息的判断
A: var sendText = function() {
// if (textSending) {
// return;
//}

Q:自动登陆的 实现
A:$(function()
{
login();
}

)

Q:用户token 的登陆
A://根据用户名密码登录系统
conn.open({
apiUrl : Easemob.im.config.apiURL,
user : user,
// pwd : pass,
accessToken : "YWMtV8DgQt97EeWInF-xEd80TgAAAVRl-FixEr0I5NWLkYFefpM919W5-JU1Uvc",
//连接时提供appkey
appKey : Easemob.im.config.appkey
});

Q:多网页的共存
A:var resource_value = Math.floor(Math.random()*1000);
// var resource_value = "webim";

Q:刷新或者退出网页的时候提示
A: $(function() {
$(window).bind('beforeunload', function() {
if (conn) {
conn.close();
if (navigator.userAgent.indexOf("Firefox") > 0)
return ' ';
else
return '';
}
});
});

Q:低版本ie是否支持
A:支持ie789+,在调试的过程中需要本地配置服务

集成移动客服的时候,IM 服务号是干嘛的呢
A:
1:在客服后台绑定一个关联
指定一个im服务号

2:客户端联系客服的时候,写个按钮“联系客服”
调用了发消息的方法,接收对象 to=关联里面的 im服务号
消息发送过去之后 会到客服后台,根据分配策略分配给对应的客服

Q:网站集成环信移动客服
A:在</body>标签前加入这段代码
<script src='//kefu.easemob.com/webim/easemob.js?tenantId=327&hide=false' async='async'></script>

Q:这个按钮进行自定义
A:首先,将已嵌入网站中的JS插件代码中的hide=false修改为hide=true:(确保tenantId为自己的)
<a href="javascript:;" onclick="easemobIM()" tenantId=0000>自定义按钮</a>

Q:自定义联系客服的界面
A:[url]https://github.com/easemob/kefu-webim[/url]
 
直播中写的项目代码下载 ↓ ↓
26
评论

webim自动登录 多网页共存 输入框空消息判断 webim

beyond 发表了文章 • 7003 次浏览 • 2015-12-21 17:40 • 来自相关话题

集成环信webim ,发现需要输入账号密码才能登陆,如果需要实现打开页面就直接登陆该怎么办?

以webdemo为例(demo下载地址http://www.easemob.com/downloads),打开index ,demo 的登陆是写了一个login方法调用的conn.open。只需要在这个方法前写一个页面加载函数 ,直接调用login就可以实现我们需要的打开页面登陆功能
 




就是这么酷炫,小伙伴们快去试一下吧!
 
接下来我们来看第二个问题,怎么实现多网页共存?还是老样子,先讲一下原理吧,
-conn.open的时候多传递参数,resource:随机值,每个tab中随机值不能一样,一样则会把前一个登录的踢出,默认都是webim
如果觉得看不懂也没关系,这个在环信webimsdk里已经写好了的,打开easemob.im-1.0.7.js 
把截图里圈出来的地方注释打开,下面resource_value注释掉(这下是不是明白了呢)





 
 
在使用webdemo 的时候发现打开会话界面不输入消息,点击发送按钮(也就是发送一条空消息)这样会导致后续发不出去消息,这个应该怎么处理呢?
 
把这个判断注释掉即可





 
上面说的三个技能都掌握了吗?附件为一份简单集成的demo,可以拿去参考下。

有关于环信集成问题或者想了解哪方面移动互联网知识,可以在下方评论留言,我们就计划更新出来。
  查看全部
集成环信webim ,发现需要输入账号密码才能登陆,如果需要实现打开页面就直接登陆该怎么办?

以webdemo为例(demo下载地址http://www.easemob.com/downloads),打开index ,demo 的登陆是写了一个login方法调用的conn.open。只需要在这个方法前写一个页面加载函数 ,直接调用login就可以实现我们需要的打开页面登陆功能
 
QQ截图20151221173013.png

就是这么酷炫,小伙伴们快去试一下吧!
 
接下来我们来看第二个问题,怎么实现多网页共存?还是老样子,先讲一下原理吧,
-conn.open的时候多传递参数,resource:随机值,每个tab中随机值不能一样,一样则会把前一个登录的踢出,默认都是webim
如果觉得看不懂也没关系,这个在环信webimsdk里已经写好了的,打开easemob.im-1.0.7.js 
把截图里圈出来的地方注释打开,下面resource_value注释掉(这下是不是明白了呢)

QQ截图20151221173151.png

 
 
在使用webdemo 的时候发现打开会话界面不输入消息,点击发送按钮(也就是发送一条空消息)这样会导致后续发不出去消息,这个应该怎么处理呢?
 
把这个判断注释掉即可

QQ截图20151221173324.png

 
上面说的三个技能都掌握了吗?附件为一份简单集成的demo,可以拿去参考下。

有关于环信集成问题或者想了解哪方面移动互联网知识,可以在下方评论留言,我们就计划更新出来。
 
0
评论

用户的H5 APP接这个WEBIM的SDK,可行吗?能否给个建议? webim 环信商务问题

环信专业服务 发表了文章 • 1510 次浏览 • 2015-09-18 15:26 • 来自相关话题

手机端用可以。但强烈不建议,因为webim设计时是没有考虑移动终端的弱网络环境的,在自动重连,不丢失消息等方面都没有做特别的处理。也没有考虑省电省流量的需求。因为桌面的浏览器没有要求省电省流量。所以结论就是能用。但可能不好用 。
手机端用可以。但强烈不建议,因为webim设计时是没有考虑移动终端的弱网络环境的,在自动重连,不丢失消息等方面都没有做特别的处理。也没有考虑省电省流量的需求。因为桌面的浏览器没有要求省电省流量。所以结论就是能用。但可能不好用 。
0
评论

webIM明文传输,安全性不够吧? webim 环信_WebIM

环信专业服务 发表了文章 • 1412 次浏览 • 2015-09-16 14:52 • 来自相关话题

webim支持https
webim支持https
7
评论
0
评论

请教个webim问题,报错“同源策略禁止读取位于http://im-api.easemob.com/http-bind/的无程资源”,请问怎么解决? webim 环信_WebIM

环信专业服务 发表了文章 • 2092 次浏览 • 2015-09-06 20:22 • 来自相关话题

设置 apiurl 为https。
设置 apiurl 为https。
0
评论

把 webIM弄到微信公众号里面去。在里面的网页进行聊天。会不会被微信干掉? webim 环信商务问题

环信专业服务 发表了文章 • 1749 次浏览 • 2015-09-04 07:24 • 来自相关话题

应该不会。微信也没法监视到网页里在做什么,有环信上的app把webim嵌入到微信上的网页上的案例。
应该不会。微信也没法监视到网页里在做什么,有环信上的app把webim嵌入到微信上的网页上的案例。
0
评论

webIM如果直接关闭聊天窗口,那当前登录人的状态还是在线? webim 在线 在线状态 环信_WebIM

环信专业服务 发表了文章 • 1929 次浏览 • 2015-08-31 20:15 • 来自相关话题

有个缓冲时间,如果是点击退出,应该是立刻;如果要是直接关闭浏览器,服务器没法立刻知道,需要有个缓冲时间。
有个缓冲时间,如果是点击退出,应该是立刻;如果要是直接关闭浏览器,服务器没法立刻知道,需要有个缓冲时间。
0
评论

1.webim-sdk是依赖jQuery吗?2.webim-sdk可以不依赖 jQuery吗? webim 环信_WebIM

环信专业服务 发表了文章 • 1953 次浏览 • 2015-08-31 08:46 • 来自相关话题

1.webim-SDK 依赖于 jQuery; 2.目前不行,除非jQuery做的完全用js重写。
1.webim-SDK 依赖于 jQuery; 2.目前不行,除非jQuery做的完全用js重写。
0
评论

WEBIM 可以支持IE6,IE7,IE8,IE9部署成功了吗?现在可以支持了吗? webim 环信_WebIM

环信专业服务 发表了文章 • 1562 次浏览 • 2015-08-30 18:43 • 来自相关话题

已经支持IE7,8,9。
已经支持IE7,8,9。
0
评论

webIM 支持发送透传消息吗? webim 透传 透传消息 环信_WebIM

环信专业服务 发表了文章 • 1474 次浏览 • 2015-08-28 22:42 • 来自相关话题

可以调用restapi发送透传消息,查看文档上的介绍 http://docs.easemob.com/doku.p ... sages
可以调用restapi发送透传消息,查看文档上的介绍 http://docs.easemob.com/doku.p ... sages
0
评论

官网下载webIM SDK,没有v1.0.7 版本? webim 环信技术支持

环信专业服务 发表了文章 • 1114 次浏览 • 2015-08-26 03:19 • 来自相关话题

1.0.7版本依赖于服务端的一个功能升级,所以还没有正式发布。
1.0.7版本依赖于服务端的一个功能升级,所以还没有正式发布。
0
评论

web端私信为什么不建议用webIM,而是调用rest接口发送,用轮询是否会对后期服务器造成压力呢? webim 环信_WebIM

环信专业服务 发表了文章 • 1913 次浏览 • 2015-08-26 01:50 • 来自相关话题

这种方案最简单。但不会特别的实时。所以适合实时要求不是特别高的私信,如果用webim改,会非常实时。但工作量大。webim很复杂,用的库也多,ui也复杂。环信的webim是开源的,但工程师要把这些代码读懂,也需要些时间的。用轮询是否会对后期服务器造成压力呢 --这个要看系统以后设计容量是多少。 查看全部
这种方案最简单。但不会特别的实时。所以适合实时要求不是特别高的私信,如果用webim改,会非常实时。但工作量大。webim很复杂,用的库也多,ui也复杂。环信的webim是开源的,但工程师要把这些代码读懂,也需要些时间的。用轮询是否会对后期服务器造成压力呢 --这个要看系统以后设计容量是多少。