使用uni-app打包APK全过程(简单)记录

一、准备工作:
前往官网https://uniapp.dcloud.io/先了解一下
下载开发工具:https://www.dcloud.io/hbuilderx.html
安装完成打开(如:下图1)使用uni-app打包APK全过程(简单)记录_第1张图片
uni-app 是一个使用 Vue.js 开发所有前端应用的框架,语法和结构与vue.js相似,并参和了小程序的东西(如:下图2)
使用uni-app打包APK全过程(简单)记录_第2张图片
二、编译测试
1.可编译到浏览器(测试时需要跨域配置跟之前的vue配置方式差不多)和手机真机模拟器以及各小程序开发工具等进行测试(如:下图3)
使用uni-app打包APK全过程(简单)记录_第3张图片
2.之前我是直接用360助手和华为手机助手进行真机测试。链接上手机时需要重新打开hbuilderx让后进行运行测试

3.真机测试默认使用hbuilderx的基座,在使用其基座时不能进行消息推送,但HBuilder基座不支持调用uni-app原生插件。
更多内容:https://www.jianshu.com/p/b4b970011188

4.自定义基座(打包发布不能使用该基座)(如:下图4、5)
使用uni-app打包APK全过程(简单)记录_第4张图片使用uni-app打包APK全过程(简单)记录_第5张图片
5.自定义基座需要apk的证书和密钥密码,证书别名,这些需要自己去配置生成,流程具体如下:
https://ask.dcloud.net.cn/article/35777

三、推送功能使用

前期准备:
1.仔细查阅官方文档(UniPush):
https://ask.dcloud.net.cn/article/35622
2.开通开通UniPush推送服务(还需要资质认证才能使用)
开通服务地址: https://dev.dcloud.net.cn
2.1新建应用此处的appid要与开发包的appid保持一致(如:下图6、7)使用uni-app打包APK全过程(简单)记录_第6张图片
使用uni-app打包APK全过程(简单)记录_第7张图片
点击图6的app名称可以看到推送后台服务了(如:下图8)使用uni-app打包APK全过程(简单)记录_第8张图片
然后客户端在App.vue的 onLaunch()中贴这代码(注意:测试过程请用自定义基座进行真机测试,或者云打包发布测试)

 // #ifdef APP-PLUS  
        const _self = this;  
        const _handlePush = function(message) {  
            /**  
             * 通过 vuex 来同步页面的数据,仅做演示。  
             * 实际开发中,这里可能是跳转到某个页面等操作,请根据自身业务需求编写。  
             */  
            _self.updatePushMessage(message);  
        };  
        plus.push.addEventListener('click', function(message) {  
            plus.nativeUI.toast('push click');  
            _handlePush(message);  
        });  
        plus.push.addEventListener('receive', function(message) {  //传透可用到
            plus.nativeUI.toast('push receive');  
            _handlePush(message);  
        });  
        // #endif  

还有一个H5API相关文档
https://www.html5plus.org/doc/zh_cn/push.html

还有一步就是配置一下应用信息(如:下图9)

使用uni-app打包APK全过程(简单)记录_第9张图片

AppID:由IGetui管理页面生成,是您的应用与SDK通信的标识之一,每个应用都对应一个唯一的AppID。

AppSecret:第三方客户端个推集成鉴权码,用于验证第三方合法性。在客户端集成SDK时需要提供。

AppKey:预先分配的第三方应用对应的Key,是您的应用与SDK通信的标识之一。

MasterSecret:个推服务端API鉴权码,用于验证调用方合法性。在调用个推服务端API时需要提供。(请妥善保管,避免通道被盗用)。

再配置一下manifest.json文件(如:下图10)
使用uni-app打包APK全过程(简单)记录_第10张图片

最后可以在推送服务后台进行测试啦(如:下图11)
使用uni-app打包APK全过程(简单)记录_第11张图片
后端需要做的操作简单介绍一下

UniPush是dcloud和个推合作的所有服务的的文档页是个推的文档(注意:个推这边的后台账号无须再注册);
服务端集成时首先需要获取AppId、AppKey、MasterSecret参数(在 https://dev.dcloud.net.cn后台获取)(在图9中可看)
然后跟着文档来写业务就好了:http://docs.getui.com/getui/server/csharp/template/

完~,此记录还不够完善,但大体记录了一下

你可能感兴趣的:(vue,uin-app)