在这之前,我要先发个誓:本文绝无帮别人做广告!如过有!那我的笔记本电脑不得好死。
事情是这样的。。。
相信很多同学的朋友圈今天被一张写了一句话,加上一个菊花码,还加上三个数字的图片刷屏了。
这款小程序名字叫「匿名聊聊」,花叔从中午就开始看到这个小程序在朋友圈刷屏,自己也转发了类似的图片,有些网友看到后还问我是不是我做的,很遗憾,不是我做的,但我可以从技术角度给大家解读一下这个小程序的一些实现逻辑。
在说技术细节前,我首先要澄清一个事情:部分网友以为这款小程序是腾讯官方做的,我可以明确地告诉大家:不!是!的!
小程序主体鉴别方法
大家可别以为牛逼的小程序都是腾讯自己做的哈,民间也有很屌的小程序的,至于怎么看出来的呢?今天顺便教大家一个鉴别小程序所属主体的方法,很简单:
进入这个小程序后,点击右上角会弹出一个菜单,然后按照图示就能找到它的主体信息,这个小程序是一家厦门的公司做的,从它的“服务及数据”接口来看的话,你还能发现它有个产品叫“印象朋友”。
这是公司为主体的小程序,小程序还有个人为主体的,花叔的「Nodes」小程序就是个人为主体的,里面会显示个人开发者的姓氏:
于是现在大家都知道我叫“周杰伦”了!哎呦,不错吧?
所以,以后大家看到某个有意思的小程序时就这样子去看它的主体来判断是什么人做的就好,别傻傻地觉得都是腾讯做的哦,虽然腾讯内也有外包给别的公司做小程序的情况,但实际上这种情况很少。
匿名聊聊小程序的技术猜测
创意和产品不是花叔擅长的领域,这里就不细说了。接下来,花叔从专业角度来给大家猜想一下这款小程序的技术细节,以下为花叔个人对这款小程序的技术解读,由于没有源码(人家也不可能给我源码),没法深入理解真正的技术要点,以下只为猜想,大家可以理解为:如果是花叔来实现这个小程序,那么技术架构是怎么搭建的。
首先,根据这个小程序的功能点,我用「Nodes」预想了一下这里头涉及的技术点和小程序API:
附大图:
实际上,这个小程序应用的技术并不难,
主要技术概括起来有三点:
巧妙的地方有一点:
要做到聊天室的唯一并且可传播,有两个做法,第一种做法是:生成带参数的二维码图片;第二种做法是用固定二维码或程序码+密码校验
显然开发者用的是第二种做法,为什么说它巧妙,首先我要给大家科普一个事情,带参数的二维码是有生成次数限制的,按照这款小程序目前的转发量来看,显然二维码是不够用的,
所以开发者选择了第二种方法,他们把小程序码中间的logo挖空,然后用canvas api去把用户的头像和挖空的小程序码图片叠加组合,这么说可能有点抽象,我举个例子,例如Nodes小程序的小程序码是这样的:
通过以下操作,就能变成一个个性化的小程序码,
然后再加上一个随机的三位密码,进行聊天室的校验。
这个设计套路还是蛮有趣的,能借鉴到其他小程序项目中。
但这个小程序也有美中不足的点:
略表愚见,希望大家喜欢,同时大家有觉得好的小程序也可以告诉我,我来帮忙做技术观察。
最后,希望该小程序的开发者看到本文觉得不对的时候不要拆穿我~^_^~
毕竟,我也会卖萌哒吖~耶~