欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术!
  扯淡的前情提要(赶时间的小伙伴直接ctrl+f“正文”,开始阅读)
 
  最近公司业务需要上一个在线聊天的功能,老板说“这个应该不难吧,用户那边需求挺大,我们15号(一周后)给它上线吧”,我。。。心理虽然慌的一批,但是老板第一次直接给工作,要留个好印象呐,得当个有情商的码农是吧。结果情商拉满的瞬间,智商就没了,一个“好”字回复的轻松,可是该咋整呢,我是一脸懵逼
 
  事态发展
 
  倒叙下,说下结果,最后功能按期上线,且没有出任何bug,普天同庆,还获得老板表扬。在此得特别感谢一个第三方服务产品——GoEasy,简直是特效药,用它的当晚我就感觉自己吹出去的牛逼有救了。
 
  咳咳,言归正传,给大家说下我解决这个问题的思路。
 
  大量关键词搜索
 
  IM,是我第一个想到的词,后来一看各大厂的方案解决方案都很齐全,但是一看文档我就懵逼了,api过于丰富,完全就是做社交的方案,打包出来的sdk也贼大,东西一大做起来一是坑多,二是体积太大加载慢,用户体验不好又得反过来想办法优化,所以抛弃之。
 
  Websocket,这是在看一些关于聊天和消息推送的博文中,都出现的词,我顺藤摸瓜,果然这是大多数IM的底层实现,底层意味着很轻,实现应该也不复杂。事实证明,我猜对了一半,轻确实轻,大量文章关于如何定制成我想要的功能,思路很清晰,但是我碰到了另一个问题,就是性能和优化的问题。因为多数文章虽然都实现了部分功能,但是貌似离可稳定上Live环境需求的都差之甚远。我们虽然公司小,但是在线用户高峰期还是有400多个,而且我们对消息时效性要求比较高,并发+时效,我擦这优化估计我研究1个月都不知道能不能出山。
 
  JavaWebsocket,随后我开始直接聚焦自己编程语言下的具体实现了,大java人才济济,一定会有大佬拯救我的。可我是越看越慌,有的demo我一跑还行,可一测。。。问题百出。迫不得已,我开始看第三方服务产品了,翻了一下,把大厂的广告都忽略了,这时候就瞧到GoEasy了,很朴素的自我介绍“更简单的Websocket”,我靠,找的就是你啊。
 
  一小时搞定Demo(正文开始)
 
  一上来我大先概瞅了一眼首页,内容和排版都算是简约风格。时间不等人,我马上点“快速入门”开始整。官方说9分钟可以搞定,我7分钟跑通。
 
  还真是tmd简单啊,我激动的准备跟前端说一起搞个小demo测试下,结果环顾四周,就我一个傻逼10点还在办公室。好吧,写点小html自己搞一手嘛。一阵百度过后,嘿嘿,虽然UI丑陋,js也不规范,但“实现多人在线群聊的功能已经实现了!”,下面给大家看下截图和代码,代码是纯html,“50行纯html实现的哦”,光这一点,你就知道这个GoEasy把websocket封装的有多好了。
 
  <html>
 
  <head>
 
  <title>GoEasyTest</title>
 
  <scripttype="text/javascript"src="https://cdn-hangzhou.goeasy.io/goeasy.js"></script>
 
  <scripttype="text/javascript">
 
   vartextarea_value=document.getElementById("textarea");
 
  if(typeofGoEasy!=='undefined'){
 
  vargoEasy=newGoEasy({
 
  appkey:'**********'
 
  });
 
  }
 
  //页面一加载就订阅
 
  goEasy.subscribe({
 
  channel:'demo_channel',
 
  onMessage:function(message){
 
   if(!textarea_value){
 
   textarea_value="";
 
   }
 
   textarea_value=textarea_value+message.content+"\n";
 
  //console.log('Meessagereceived:'+message.content);
 
   //alert('收到:'+message.content);
 
   document.getElementById("textarea").value=textarea_value;
 
  
 
  }
 
  });
 
  //推送消息
 
  functionpublishMessage(){
 
  goEasy.publish({
 
  channel:'demo_channel',
 
  message:document.getElementById("message").value
 
  });
 
  }
 
  //取消订阅的页面不会再收到信息
 
  functionunsubscribe(){
 
  goEasy.unsubscribe({
 
  channel:"demo_channel"
 
  });
 
  }
 
  </script>
 
  </head>
 
  <body>
 
   <textareaid="textarea"rows="20"cols="50">
 
   </textarea>
 
   <br/>
 
   <inputtype="text"id="message"/>
 
  <inputtype="button"value="推送消息"onclick="publishMessage()"/>
 
  <inputtype="button"value="取消订阅"onclick="unsubscribe()"/>
 
  </body>
 
  </html>
 
  事后总结
 
  互联网发展到现在已经是相当成熟了,造轮子真是非常吃力不讨好的事了,至少对于我这些种初级的码农来说。平时都是写业务,但为了更好的解决问题,学会使用第三方服务,也是一种新的必要能力了,能解决问题才有核心竞争力,对前辈们做出的产品深度体验后,通过api也会了解他们的coding设计理念,api的精妙设置背后肯定是他们架构经验的体现。
 
  最后帮GoEasy打个广告,除了产品好用,他们现在的技术支持也超级给力,那天晚上11点还给说了实现功能的思路,瞬间把我点透。
 
  来咯,GoEasy更简单的WebSocket,让我们专注coding,WebSocket就交给他们解决吧。加油!

如需转载,请注明文章出处和来源网址:http://www.divcss5.com/html/h56898.shtml