开发 | 我的小程序开发「踩坑血泪史」

小程序

2017-08-09 14:00

文 | 沈锐

高晓松说,人生不止眼前的苟且,还有诗和远方。

我说,码农的世界不止 0 和 1,还有红黄蓝。

大概就是这样的一种信念,催生了我的微信小程序 ——「码农也涂鸦之 dA 版」吧。

不同于其他的一些实用性娱乐性很强的小程序,我的这款小程序更像是一种「私人定制」,因为它唯一功能,就是用来方便大家浏览我在 deviantArt 上的 CG 作品。

下面,我来回顾一下,在这个小程序开发过程中所「踩」的坑,以及一些点滴的心得体会。

希望今天我在知晓程序(微信号 zxcx0101)分享的这篇文章,会对大家有所帮助。

关注「知晓程序」公众号,在微信后台回复「开发」,获取小程序开发技巧文章精选。

开发环境

对于我来说,首当其冲的「大坑」,是开发环境。因为,微信小程序开发工具仅支持 Windows 和 macOS 系统,但我的日常操作系统是 Linux。

起初在网上找到的方法,是虚拟机加 Samba 共享,但是这种方法不仅使用麻烦、浪费资源,而且预览的样式也无法完全准确。

之后,我在 GitHub 上找到了一个微信 web 开发者工具的移植,能够真正在 Linux 下开发了。可惜,好景不长,随着小程序组件的一次更新,移植版出现了奇怪的错误。

提交 issue 两天后无人理睬的情况下(怀疑该作者已弃坑),我不得不开始搜索其他可替代方案。幸好,发现另一个移植版是可以用的。

关注「知晓程序」微信公众号,回复「源码」,获取文中提及的开发者工具移植版下载地址。

评论功能

显示评论的功能,是在小程序第二次更新时加的。起初,没觉得是个难事,后来发现不太对——deviantArt 的 API 返回的评论内容是 HTML,但小程序无法直接解析它。

通过一番搜索,我找到了 wxParse 框架。使用过后,发现评论里的图片长宽有问题,透明图片的背景居都是白色。

好吧,我只能将它 fork 下来,然后读源代码、查原因、改代码、提交 PR,问题终于解决了。评论区效果如下图。

虽然有些艰难,但这个过程不也正好体现了开源的好处吗?:D

底部标签栏

我将小程序第一个版本形容成是在「裸奔」,因为它没有底部标签栏。

在第二个版本中,我决定为小程序添加自实现的底部标签栏。经过了日夜奋战, 我哼哧哼哧地把它实现了,觉得还挺顺畅的。

测试的时候,发现点了五次就不能点了,我不得不再次查阅资料。结果发现,底部标签栏居然是微信小程序提供的一个功能组件!噗…… 一口鲜血就喷了出来!

好吧,这是一个经验教训,下次开始前,一定要熟悉官方文档,要好好做功课。

关注「知晓程序」微信公众号,回复「解读」,获取官方文档最全解读文章。

这里想顺便谈谈小程序的模板,因为实现底部标签栏大量用到了模板功能。

小程序中的模板功能是用来定义可重用组件的。这功能还不错,但有一点:模板的事件函数,必须定义在调用它的页面对象上(即便这个事件是只局限于模板内部的)。

正因如此,我现在不得不在每个页面的 onLoad 函数开头,将模板里需要的函数都运行一遍。

随着小程序的不断改进,我相信这个问题会得到解决。

图片下载

原本我想在小程序添加的,是把图片下载到用户指定的本地目录的功能。

查看了每个作品的图片链接,发现每张图片的子域名都不同。小程序的下载服务器域名是要提前设置的,这么多的子域名怎么设置?这事困扰了几天。

突然有一天,我想,deviantArt 这么做该不会只是为了「分流」吧?试了试,果然如此。于是我加了段逻辑,用来替换子域名为同一个子域名,问题解决了。

接着,我就顺着文档,开始写下载功能。我调用了小程序 saveFile API,小程序提示文件下载成功了,但是却没有在系统中找到。文件下载到哪儿去了呢?

后来我才知道,原来小程序是把文件保存到它自己的一个「秘密目录」,并且提供了 API,可以加载这个「秘密目录」的文件,这跟我想的「下载」,完全不是一回事啊。

说到这个问题,想到小程序的另一个限制:小程序内无法打开外部链接。本来想让用户可以用外部浏览器直接打开图片,这下也没辙了。

关于这些限制,后来在微信小程序的社区也见到有人吐槽,希望以后能够改进吧。

写在最后

回顾整个开发过程,挺折腾的。这个期间,我碰到了很多问题,也解决了很多问题。不过,最后看到自己的小程序发布的那一刻,还是挺兴奋的。

微信小程序的出现的确大大降低了手机应用的开发门槛。我希望,每个开发者都可以来试试开发微信小程序,体验一下小程序开发的乐趣。

「码农也涂鸦之 dA 版」小程序使用链接
https://minapp.com/miniapp/1423/

关注「知晓程序」公众号,在微信后台回复「开发」,获取小程序开发技巧文章精选。

zxcx_0208

登录,参与讨论前请先登录

评论在审核通过后将对所有人可见

正在加载中

小程序商店 minapp.com,一扫即用的小程序大全。微信公众号「知晓程序」,做中国最好的小程序报道。

本篇来自栏目

解锁订阅模式,获得更多专属优质内容