混合应用apicloud纯前端 之微信,扣扣通过scheme打开app的并接受参数;

1.应用场景

一般,手机应用为推广,会在外部h5页面做一个跳转引入的功能,


点击下载,跳转到下载页面;

点击立即参团:

1.如果已经安装app,打开app,并传递参数,到app,然后app再进行相应的操作,比如跳转到该商品的商品详情,

2.如果未安装,就跳转到相应的应用市场进行下载

2.应用框架

我这边app用的是apicloud框架进行app应用的开发,

外部链接,我们叫h5页面可以直接用

window.location.href = "ygm20170715://?goodsId=" + getUrlParacommon("goodsId")

混合应用apicloud纯前端 之微信,扣扣通过scheme打开app的并接受参数;_第1张图片

urlScheme 就是配置在config.xml里面的参数,这样就可以从浏览器跳转到app了

在apicloud里面直接用

api.addEventListener({name:'appintent'},function(ret,err){})

就可以直接监听了

问题:微信,qq里面无法跳转,猜测,被禁止拉~~~23333

2.魔窗


由于,公司没有android,没有ios!只有前端,所以,考虑用第三方sdk,选来选去,选择了一个免费的sdk,魔窗:http://mgnt.magicwindow.cn/(官网)

官网上面有很详细的基础文档,我这里就说下重点,和我趟的坑吧:

首先,集成就分三大部分,第一:外部网页js集成;第二:app内部接收;第三:魔窗官网配置


混合应用apicloud纯前端 之微信,扣扣通过scheme打开app的并接受参数;_第2张图片
关系图

大概就是这么个思路了

1.魔窗官网匹配---产品管理:


混合应用apicloud纯前端 之微信,扣扣通过scheme打开app的并接受参数;_第3张图片
混合应用apicloud纯前端 之微信,扣扣通过scheme打开app的并接受参数;_第4张图片
混合应用apicloud纯前端 之微信,扣扣通过scheme打开app的并接受参数;_第5张图片

这里我说下Team ID:这个是在苹果开发者平台获取的  https://idmsa.apple.com,建议混合app前端开发者好好了解下这个后台,主要是上架app,生成各种证书,当公司没有ios的时候,真的很重要,其实很简单的,就是一个后台,(下次我可以简单简绍下下前端用的到的地方)

URI Scheme:就是前面我说配置在config.xml的配置参数,

----mLink配置


混合应用apicloud纯前端 之微信,扣扣通过scheme打开app的并接受参数;_第6张图片
混合应用apicloud纯前端 之微信,扣扣通过scheme打开app的并接受参数;_第7张图片



分割线,到这里配置算是配置完了,对下一步用得到的参数有

外部链接:mlink:'https://axiydz.mlinks.cc/A05e',//短链地址,参数key(”goodsId“)

app:urlScheme,参数key(”goodsId“),applinks:sxiydz.mlinks.cc(ios,配置在res/UZApp.entitlements文件下面,apicloud官网文档有!



2.外部链接js接入

http://www.magicwindow.cn/doc/mlink-js-api.html(文档)

注意:就想我这样简单配置就行了!。我直接因为那四行注释代码!,怎么都打不开app,排查了一周!!!!!,气晕23333333(因为之前都可以,无缘无故就打不开了)

混合应用apicloud纯前端 之微信,扣扣通过scheme打开app的并接受参数;_第8张图片

3.app内部接受

啊啊,终于要写完了,这一圈流程真的巨大啊,要是出了问题,要排查哭的

好,ios亲测,可以打开,接受参数,

android,打开,接受不到参数,apicloud的官方回答是,还没做???!!

apicloud用的魔窗模块,原件399,实付399;也不是很贵,没有原生开发,只能这样了

----1,配置urlScheme

----2.配置UZApp.entitlements文件(ios)


混合应用apicloud纯前端 之微信,扣扣通过scheme打开app的并接受参数;_第9张图片


混合应用apicloud纯前端 之微信,扣扣通过scheme打开app的并接受参数;_第10张图片

----3.监听代码


混合应用apicloud纯前端 之微信,扣扣通过scheme打开app的并接受参数;_第11张图片




好了,完了,终于完了,再见

下次写客服------融云的接入,也是吐血节奏,之前用的环信,但是环信坑货,用了一年,说:要收费”“”????

这是成品链接

https://www.ygmb2b.com/index.php?act=login&op=gumajiaAppGoodsDetail&goodsId=140878

在wx和qq打开试试吧~~~

你可能感兴趣的:(混合应用apicloud纯前端 之微信,扣扣通过scheme打开app的并接受参数;)