献给所有技术内容创作者~猿创聚合助手小程序开发难点解析
本文已参与「掘力星计划」,赢取创作大礼包,挑战创作激励金。
前言
- 2020年11月
我重新开始了原创技术内容创作,至今在掘金发表了原创文章60篇,47.7w阅读,1.5w赞。
现在的技术内容作者都不只在单一平台发布内容了,都是文章、长视频,短视频一把抓。 我经过一番摸索和尝试,目前确定主要在以下平台发布原创内容
- 掘金:
技术文章
- B站:
教学视频
- 微信公众号:
个人原创内容标记平台
做着做着我觉得自己需要有一个地方可以方便的将各个平台里的内容聚合起来,让某一载体的读者可以通过这个地方看到我其他载体的内容,未来还可以在这个地方做一些读者互动,比如抽奖,讨论组之类...
并且我希望这个地方
所用到的技术都是我亲手完成的,都是我曾经文章或视频里写到过的技术点
- 2021年8月31日
我开始策划、设计、开发这个小程序,历经30次迭代
这里面踩的坑无数,因为微信的审核是非常严格的,尤其又是个人注册的小程序,很多内容不是你想做就能做的。所以没做过的小程序开发小伙伴可能无法理解有些功能为什么那么设计?就不能怎么怎么样吗?因为真的就是不能。
功能点概览
关键技术点的实现
- 聚合
聚合本身没什么难度,无非是提取数据来源平台的API。但麻烦的地方在于,个人小程序是不允许使用webview,导致为了跳转原网页,我只好采用客服消息的机制来下发网址。
- 客服消息教程原文:http://juejin.cn/post/7002866939026472974
-
高赞文章滑卡组件教程:http://juejin.cn/post/6906143905922678797
-
分享
原本这个小程序只给我自己用的话是不用这么麻烦的。现在要能够给大家用,那么分享的时候就得携带大家的配置信息。在进入小程序后,先检查是否有携带配置信息,如果有,则使用携带的配置信息。
- 引导关注公众号
在微信小程序里,引导关注公众号只能用
<official-account>
组件,并且只能关联和小程序主体相同的公众号。那怎么才能实现引导关注大家自己配置的公众号信息呢?答案还是利用客服消息机制来实现,只是这里下发的是公众号的二维码。
通过微信id
或微信原始id
来生成二维码
~~~javascript http://open.weixin.qq.com/qr/code?username=ezfullstack ~~~
在uniCloud云函数里将二维码图片读取并上传至微信的媒体素材接口
~~~javascript let imageRes = await uniCloud.httpclient.request(url);
let buff = new Buffer(imageRes.data);
let form = new FormData();
form.append('media', buff, {
filename: ${Date.now()}.jpg
,
contentType: 'image/jpeg'
})
const access_token = await getAccessToken();
const res = await uniCloud.httpclient.request("http://api.weixin.qq.com/cgi-bin/media/upload?access_token="+access_token+"&type=image",{ method:"POST", content: form.getBuffer(), headers: form.getHeaders(), dataType:"json" }) ~~~
拿到返回的media_id
就可以利用客服消息发给想要关注的用户了
~~~javascript var res = await sendCustomerServiceMessage({ touser:touser, msgtype:"image", image: { "media_id":media_id } }); ~~~
- 缓存机制
uniCloud免费的云空间性能一般,加上云函数本身冷/热启动
较大的差异,必须要好好设计一下缓存机制。在这个小程序里我总共设计了三种缓存机制。
1. cloudStorage
在云函数中http请求的缓存机制,利用云数据库来做数据缓存,避免每次请求第三方接口数据的时候都重新请求,一段时间内的数据从数据库缓存获得。 2. localStorage 前端的本地数据存储,小程序退出时不销毁。 3. memoryStorage 小程序生命周期之内的数据缓存,避免一段时间内多次请求云函数,退出即销毁。
- 用户隔离
各位技术内容作者的粉丝群体有交集的部分,可以在小程序中切换数据来源,没有交集的也无法得知其他的数据源,充分保障各自粉丝群体的独立性。
为什么我会做这个,我能收获什么?
原本就是我的个人需求,即使没有其他人用,这个工具是能满足我自己需要的。后来做着做着发现也许和我一样的内容创作者们也需要这样的工具,所以做成了开放型配置,大家都可以用。
希望这个工具能为技术内容创作者带来便利,让技术内容作者们更加专注的创作内容,而无须想方设法的引流导流。
如果你和我一样是技术内容创作者,请使用微信搜索"猿创聚合助手
"小程序
为什么数据源只有掘金和B站?
因为我只用掘金和B站...未来也不会更新,我爱掘金,未来如果掘金有视频载体,我再把B站给替换掉...
o(* ̄3 ̄)o
- 2022,38岁,裸辞,自由职业一年实况分享
- 太强了!外国小哥花16个月用Three.JS打造了一个无缝切地图的3D开车游戏
- 细节狂魔,用 JavaScript 复原何同学B站头图的创意
- 码上摸金,用PIXI GSAP仿写vanmoof刹车动效 | 猿创营
- 在uni-app中使用微软的文字转语音服务
- 万马奔腾队的phaser3 战疫小游戏开发历程回顾
- 用uni-app开发一个名为汉兜的游戏
- 浅谈对贪食蛇游戏的一点微创新
- 手把手教你做iOS逆向分析,突破微信的群发多选数量限制
- 产品经理:你能不能用div给我画条龙?
- 这个榜单我不服!终究还是错付了这个绿茶掘金
- 前端摸鱼神器,设计稿一键导出 「小程序/Vue/Uni-app」代码
- 请收下这份源码,用Vue开发的一个“蚂蚁森林浇水偷菜”游戏
- 微信小程序统一分享,全局接管页面分享消息的一些技巧
- 这45道面试可能被问到的JS判断题!你能答对几道?
- CSS边玩边学,这五个游戏让你对CSS的掌握更进一步!
- Web网站扫【小程序码】登录的技术实现!记得收藏,要用时别找不到!
- 献给所有技术内容创作者~猿创聚合助手小程序开发难点解析
- 花60秒给Vue3提的PR,竟然被尤大亲自Merge了~
- 使用Vue开发“蚂蚁森林浇水偷菜”游戏的心得体会