hbuilder 开发5+ APP采坑记录
开发一款APP产品需要在安卓和苹果2大平台发布,同时开发团队也需要有安卓和IOS。
HTML5 Plus移动App,简称5+App,是一种基于HTML、JS、CSS编写的运行于手机端的App,这种App可以通过扩展的JS API任意调用手机的原生能力,实现与原生App同样强大的功能和性能。
通过5+App可以降低APP开发的门槛,让一般的前端开发人员也可以进行APP的开发,同时能为公司节约很大的成本,只需要一个前端团队即可。
最近我司为了快速发布一个APP产品,也选择了5+App这种方式,由于本人主要是做后端开发的,前端这块不是很熟,在开发过程中遇到了很多的问题,特别是一些IOS证书的申请流程,搞的晕头转向,为了 避免后面的同学采坑,在这里将采坑的内容分享出来。
dcloud官网:http://dcloud.io/
APP图标问题?
在真机调试环境下,hbuilder会把APP内容同步到我们的手机中,这个时候图标显示的是hbuilder的图标,不是我们在启动页设置好了的自己的图标,这个需要将APP打包后装在手机上才可以显示出来。
启动页图片问题?
启动页图片有2个问题,一个是和上面图标一样的问题,在真机调试环境下是没效果的,还有个问题就是不能去掉,很多APP都会在启动时候加载一些广告内容,这是一个很常见的需求,hbuilder中只能配置静态的本地图片然后打包到APP中,不能做成动态的,当时我想的是能不能直接配一个图片地址,然后就可以达到动态的效果,事实证明是不行的,打包不了。
那么如何解决这个问题呢?
既然启动页不能更改,也去不掉,那就制作一张自己公司logo的启动页面,在启动页面加载完成之后自己实现一个广告页面,广告页面后就是我们的APP首页,通过这种方式来达到动态启动广告页的效果,由于我本人没做过原生的移动开发,不知道在原生的开发中能不能将启动页去掉,我们这边用的是别人的框架,这个就只能妥协了,当然启动页面也是有必要的,可以让APP在启动时将一些资源提前加载好。
我看了一些其他的APP,比如微店买家版,也是有自己的启动图片,然后再跳转到广告页面,最后到首页的。
APP中用百度地图定位问题?
我们之前在网页中也是用的地图来定位的,也有一个key,在做APP的时候看到也是需要配置SDK内容的,当时以为就用网页中用的百度的key就可以了,配上去之后就发现出问题了,有的时候可以定位成功,有的时候定位不了,后面看了文档:http://ask.dcloud.net.cn/article/29,发现地图的appkey还分安卓和IOS的版本,所以又重新申请了不同系统下不同的key。
微信登录问题?
首先你得有账号,账号没问题之后就得建应用了,应用需要等微信团队审批之后才可以使用第三方登录的功能,微信申请地址:https://open.weixin.qq.com/
在创建应用的时候需要分别填写安卓和IOS的信息
IOS需要注意的是Bundle ID的填写,一个是正式的,一个是测试环境下使用的,Bundle ID通常都是公司的包名称,比如com.cxytiandi.app,测试的就可以使用com.cxytiandi.app.test
安卓没有Bundle ID这个说法,安卓的叫应用包名,而且不区分正式和测试环境,只需要填写一个就可以了,比如com.cxytiandi.app
还有一个很重要的就是应用的签名,这个是安卓这边需要的,这个签名可以通过微信提供的签名获取工具获取,地址:https://open.weixin.qq.com/cgi-bin/readtemplate?t=resource/app_download_android_tmpl&lang=zh_CN
前提是你得将你的APP用签名文件进行签名打包,然后安装到你的手机上,最后下载微信提供的签名获取工具安装到手机上,通过这个工具获取签名然后填写到微信开发平台的账号申请信息中即可。
最重要的问题来了,我的APP怎么签名打包呀?
在jdk的bin文件中,输入以下命名进行文件生成:
keytool -genkey -alias 别名 -keyalg RSA -validity 10000 -keystore 文件名.keystore
- alias是你要填写的别名
- 文件名.keystore 是文件保存的名称
回车之后会让你填写一些基本的证书信息还有密码,密码一定要记住
如果大家不是Java开发人员,本地可能没有按照jdk,这个时候你可以用hbuilder开发包中自带的jre的bin目录去生产证书。
打包的话就可以选择使用自己的证书,然后填写下图的信息,最后打包安装到自己的手机中获取签名:
等微信那边审核通过之后,你会得到一个appid和appsecret,直接在SDK配置中进行配置即可使用微信登录的功能。
登录示例可以参考官方给的demo,记得在注销微信登录的时候调用下面的退出登录方法:
function logout(auth){auth.logout(function(){outLine("注销\""+auth.description+"\"成功");},function(e){outLine("注销\""+auth.description+"\"失败:"+e.message);});
}
如果不调用logout方法会导致当你手机中的微信切换成另一个账号的时候,你微信登录获取的还是之前的微信信息,有缓存。
推送问题?
hbuilder开发APP时默认集成了一些第三方的推送功能,比如个推。当然在使用的过程中也踩过一些坑。
1.IOS使用普通消息模板进行推送时会弹出一个很丑的框,效果图如下:
那么怎么去掉这个比较丑的框呢,在推送的时候我们用透传消息模版来推送就不会出现这个框了,这个时候就需要自己用代码监控消息过来,当收到消息的时候你可以自己创建一个本地消息或者用系统消息提示框来代替。
本地消息创建:
function createLocalPushMsg(){var options = {cover:false};var str = dateToStr(new Date());str += ": 欢迎使用HTML5+创建本地消息!";plus.push.createMessage( str, "LocalMSG", options );outSet( "创建本地消息成功!" );outLine( "请到系统消息中心查看!" );if(plus.os.name=="iOS"){outLine('*如果无法创建消息,请到"设置"->"通知"中配置应用在通知中心显示!');}
}
系统提示框:
plus.nativeUI.alert()
2.IOS离线推送收不到?
安卓的APP如果被杀死了,想要做离线推送是不可能的,只能通过手机厂商来实现离线推送,IOS中也是通过苹果提供的APNS服务来实现离线消息的推送功能。
在个推的文档中也有使用方式,文档地址:http://docs.getui.com/getui/server/java/template/
通过setAPNInfo(ApnPayload payload);来设置推送信息,但是按照这样的做法改了代码之后还是死活收不到消息,在线的就可以了,搞了好久最后怀疑是评估证书的问题,在个推中创建推送应用是需要传证书的,最开始之前我传的.p12证书是通过ios_development.cer生成的,这个证书打包时要用到,当时也没什么问题,到后来发现离线推送不行了,才去找原因,发现苹果开发者中心还有一个推送的证书类型,我去,这么麻烦,又单独申请了一个推送的证书
然后通过下面的方式生成了一个推送的.p12文件,上传到个推,最后才能收到离线消息。
生成p12需要3个文件:1,本机在https://developer.apple.com/ios/manage/certificates/team/index.action生成certifacates时上传的本机证书:CertificateSigningRequest.certSigningRequest2,从https://developer.apple.com/ios/manage/overview/index.action的app IDs里拿到的Push SSLCertificate,命名为:aps.cer3,在本机双击aps.cer会自动加载到本机的Keychain中,在keychain中找到该证书,展开,导出其下的private key为:key.p12将以上3个文件放在同一个文件夹中,并用terminal打开,一次输入下面命令(需要输入密码时均填写123456):1,openssl x509 -in aps.cer -inform DER -out aps.pem -outform PEM2,openssl pkcs12 -nocerts -out key.pem -in key.p123,openssl pkcs12 -export -in aps.pem -inkey key.pem -certfile CertificateSigningRequest.certSigningRequest -name "push" -out push.p12即可生成需要的p12
在生成IOS证书的时候如果遇到.cer 文件添加到钥匙串报错:不能修改“System Roots”钥匙串的问题请参考这篇文章的做法,有效:https://www.jianshu.com/p/ab3193236a68
hbuilder 开发5+ APP采坑记录相关推荐
- uniapp开发聊天APP踩坑记录
最近工作重心转移到了uniapp上,有一说一,这个框架跨端确实牛逼,一套代码能一次编译到多端使用.但随之而来的兼容性问题也是层出不穷,同样的在面临APP底层的改动也显得力不从心.同时,uniapp的性 ...
- uni-app 开发安卓app踩坑记录
uni-app离线打包android -- 官方文档 Android studio打包apk后弹窗提示"打包时未添加ui模块" 在工程应用目录的build.gradle文件中bui ...
- 微信支付采坑记录(java后端 一:微信支付调用从哪一步开始)
普通商户模式微信支付之APP支付统一下单: 前言: 最近项目开发到微信支付的模块,经过一周的不懈努力,虽然微信支付流程跑通了,但当时的那些坑是真的烦,为了避免自己以后犯同样的错误,当然还有各位新接触微 ...
- iOS 微信SDK1.8.6后需要UniversalLink解决方案及采坑记录
项目最初因审核原因,一直使用iOS原生分享, 最近因项目需求要求, 接入微信分享, 以为和原来的没有区别, 但是接入时才发现改动的地方还是挺多的, 主要是需要配置UniversalLink和提包时的一 ...
- php给微信公众号接入聊天机器人程序+采坑记录
php给微信公众号接入聊天机器人程序 今天逛了下我的公众号,突然心血来潮,想添加个自动聊天功能,于是-动手-!! 主要用到的api: 图灵机器人api 青云客智能聊天机器人API 茉莉机器人API 至 ...
- H5拍照、预览、压缩、上传采坑记录
H5拍照.预览.压缩.上传采坑记录 公司项目前段时间需要实现手机拍照上传的功能,本来以为用createObjectURL和canvas可以很轻松的实现,结果发现问题多多,特此记录下来. DEMO预览( ...
- mysql8.0.19.0_分享MySql8.0.19 安装采坑记录
上篇文章给大家介绍了MySql8.0.19 安装过程,需要的朋友可以点击查看.https://www.jb51.net/article/178988.htm 1.ERROR 1820 (HY000): ...
- 混合App开发,HBuilder开发移动App
使用HBuilder开发混合App: Hbuilder:是一个在线打包工具,不需要在本地配置开发环境:直接将做好的网站,通过一些简单的操作,就能在线打包为一个App: 混合APP开发常见技术:Html ...
- mysql8.0依赖_分享MySql8.0.19 安装采坑记录
上篇文章给大家介绍了MySql8.0.19 安装过程,需要的朋友可以点击查看.https://www.jb51.net/article/178988.htm 1.ERROR 1820 (HY000): ...
最新文章
- CKfinder2.0.2版本破解
- oracle dba_seg,Oracle DBA 应知应会 -- PGA自动管理
- 杨凌农业自贸区谋定功能-万祥军:对话农民丰收节交易会
- 博本 微型 电脑 linux,博本电脑下载与安装Windows7iso镜像系统教程
- 实验二:进程的创建与可执行程序的加载
- jQuery获取所有父级元素及同级元素及子元素的方法
- Beginning SDL 2.0(4) YUV加载及渲染
- 【ArcGIS遇上Python】python批量获取栅格数据四至(top,bottom,left,right)坐标代码
- Linux kernel中常见的宏整理
- sessionstorage ie8下跨页面_前端页面布局困难?教你用盒子模型一招解决
- 基于SSM的停车位收费系统
- 由电梯紧急按钮,谈用户体验
- 数据仓库--数据分层(ETL、ODS、DW、APP、DIM)
- go语言遍历目录中的文件
- 关于华为S27000交换机在局域网中的一些简单配置
- 市场上常见饮用水种类
- Note: further occurrences of HTTP header parsing errors will be logged at DEBUG level.
- 网站流量模型(1)介绍
- 宝塔php不能上传大文件,解决BT宝塔无法上传大文件的方法,请收藏
- 适用于QMK的键值修改软件VIA