uniapp开发完成的微信小程序转app的问题汇总
目前公司已有成型的uniapp开发的微信小程序项目,本次记录uniapp开发的成熟的微信小程序转为app的坑点
1. 开发app时,首先考虑的是app的应用场景: Android和iOS,需要生成对应的APK供用户安装,因此开发工具由vscode转为hbuilderx(因为hbuilderx有运行发行功能,直接能走DCloud的打包)
生成apk时,在Android上可以选公共证书直接打包,但iOS需要有iOS证书,而证书的申请需要有iOS的开发者权限,因此需要去申请开发者权限
2. Android打包时,需要dcloudio依赖包与hbuilderx的相同,因此直接更新hbuilderx和依赖即可(都升级成最新的,再有问题就能去官网去骂他了)
3. uniapp开发的app有页面下拉上划的回弹效果,即正常的页面也可以下拉,有抖动的效果,对于页面编写的底部有固定操作区的页面十分不友好,官方提供了个页面级的关闭页面回弹功能,在pages.json的对应页面下的style的app-plus下设bounce为none即可(暂时未找到全局性的关闭回弹方法,只能一个一个加,有点low吧???)
---- 2022.4.28记录 ----
---- 2022.5.10 更新 ----
4. 消息推送:
消息推送目前使用的是极光推送,极光推送还可以,在uniapp的插件市场能直接下载极光的依赖包,然后借助hbuilderx,对manifest.json文件更新。
在使用极光推送的过程中,目前的效果是app在开启的情况下可以正常推送消息,但当app不在后台运行的情况下,手机无法接收到消息,经过了解,这个问题不是极光的问题,而是需要手机厂商的支持(相当于开发的app要能够有权利进不同厂商的商店),因此要继续向下进行,就必须要申请手机厂商的开发者权限,而且大多数都需要以企业开发者身份进行注册。所以,想要能够离线接收消息,就必须要申请开发者权限,并以开发者身份注册/申请,来拿到一些数据(---- 具体花不花钱暂不清楚)
---- 2022.5.13 更新 ----
5. 富文本渲染 -- 文字、图片、视频:
当前app有个文章详情页,展示的内容是由web端的富文本输入框编辑的内容,因为涉及到视频的播放,包括app的图片点击预览等等功能,因此没有使用uniapp自带的rich-text标签,而是引入了一个插件 u-parse 进行文章内容的渲染。
但是, u-parse 插件的属性解释的并不大清楚, 比方,自定义parser函数, startHandler、endHandler、 charsHandler,这都是啥啊0.0,属性的传值还是个函数, 不大会玩
遇到的问题: 我们项目在全局使用怪异盒模型设置padding预留两侧距离,然后内部引入u-parse组件,此时的图片,宽度还是375px,经核查代码,发现传入的node节点的$screen属性的width值一直为375px(屏幕宽度),并没有把左右两侧的padding给去掉,以致图片的右侧超出屏幕,后经调研,网上的解决方案主要有两种: 1. 设置css, 给class为wxparse设置样式(个人测试无效); 2. 直接改组件,在组件计算图片宽度的时候,直接把两侧的padding值减掉(个人不大喜欢这种改法,毕竟是引入的插件,但暂时没更好的解决方案,只能凑合用了)。
插入视频出现的问题: 因为web端和app端一起设计,因此在我设计完成后,随便从百度上找了个video的链接,放上去之后,发现黑色的背景上一直显示的红色的刷新图标,点击后出现loading,大概0.5秒后又变回红色刷新图标。经调查,发现uniapp的video标签的src属性参数有限制,App平台: 支持本地视频(mp4/flv)、网络视频地址(mp4/flv/m3u8)及流媒体(rtmp/hls/rtsp) ,怀疑是因为这个,但又验证不了,因为网上随便扒的video链接,啥也看不出来(举个例子: https://haokan.baidu.com/v?vid=13314829886295453873&tab=recommend&sfrom=recommend,你能看出这个视频是什么格式的嘛),没办法,先整个本地视频试一下,用手机随便录一个发给电脑,然后扔进项目里,引入本地路径(注: 如果使用的视频路径为本地路径,需要配置资源为释放模式:在 manifest.json 文件内 app-plus 节点下新增 runmode 配置,设置值为liberate)。试了下,没有红色的刷新图标,且能够正常播放,等web端的同事做到此处,直接商量返回的视频地址及对应的uparse渲染格式,试了下,web端富文本内上传的视频是用的iframe渲染的,这个不行,但生成的url没问题,直接写死,放到video标签内,没问题。