test log_complete.md

项目测试文档

前端测试

1. 在设计导航栏(Tabbar)时，首先使用官方的普通Tabbar样式，虽然满足功能需求，但太单调，没有特色，不够美观；然后学习官方提供的自定义Tabbar功能，但仍然比较普通。

   • 深入学习微信小程序的组件(Component)后，将自定义的Tabbar封装为一个组件，并学习通过CSS实现页面的动画效果，完成了基本的导航栏动画。
   • 每个页面(page)的json文件中设置页面属性，调用自定义Tabbar组件，结果发现页面之间的互相切换和导航栏动画不能同步进行，而是有先后顺序。
   • 经过学习官方文档后，了解到需要在每个页面的生命周期函数onShow()中设置页面在导航栏中对应的index值，成功实现Tabbar动画，增加了页面的美观程度。

2. 实现保存修改图片功能时发现，显示上传图片的 image 组件的 src 属性是同时支持本地和远程 url 的。但是当实现保存功能时，最开始的想法是直接调用image组件的 api ：wx.saveImageToPhotosAlbum(Object object)。可是发现对于生成的表情包无法保存，通过查阅官方开发文档得知，该 api 的 filePath 支持临时文件路径或永久文件路径 (本地路径) ，不支持网络路径。

   • 解决方法是将生成的表情包暂存于本地，此时文件路径是本地的临时文件路径，同时定时清除缓存即可。

3. 实现接口时发现无法获取服务器的返回值，一直报 undefined 。开始以为是没有传输成功，但是发现后端服务器返回的是200且后端本地测试通过，前端本地部署服务器依旧报相同的错。后面怀疑是 wx.request 这个 api 的问题，便尝试了更换 api ，部署云函数等各种方式，均没有成功。

   • 最后在官方开发者社区找到一篇帖子得知可能是没有遵循 Promise 风格，修改代码后便解决了。

4. 在实现“仅输入文本生成梗图”的功能并设计相应的页面时，考虑到部分梗图存放文字的空间有限，需要限制输入文字的量，或者提示输入文字的样式，因此需要在用户选择样式后提供部分提示性文字。

   • 考虑到的解法是直接在输入文本框(textarea)中嵌入提示性文本，经过学习了解后修改了占位符(placeholder)属性。

后端测试

1. 在确定后端需要提供 RESTful 接口后，首先尝试使用经典 Flask 框架，尝试使用 @app.route，然后指定 POST 方法来实现，发现这种方法不能接受框架以外的请求。
   • 经过调研后，采用 Flask 框架的升级包 flask_restful，实现将接口暴露到外网。
2. 小程序前后端图片数据传输，由于 POST 请求采用 JSON 文件进行数据传输，且 JSON 文件不支持二进制流直接传输。
   • 决定使用 Base64 将二进制流编码为 ASCII 字符串，在后端以 BytesIO 进行读写，实现图片数据通过 JSON 文件在前后端的正确传输。
3. 尝试对小程序进行微信云托管部署，由于云托管平台对资源限制，经过仔细检查，确定平台只接受 Alphine 等镜像，对 Numpy 等数学类包不适配，无法满足小程序后端需求。
   • 使用阿里云进行部署。
4. 使用 Pillow、OpenCV、mediapipe 库对传入图片实现人像分割处理时，出现多次输出图片颜色有误、透明通道丢失的情况；
   • 针对具体问题进行仔细排查，保证 PIL.Image 类型数据处理时的 RGBA 通道正确性和 cv2 处理图片数据时的 BGRA 通道正确性。
   • mediapipe 部分方法通过将图片传入预训练模型进行人像分割处理，经查阅官方文档，部分模型要求输入图片必须为 RGB 三通道。