他山之石可以攻玉善涨。
參考方案：
1.http://www.reibang.com/p/575c6184bbe9
2.https://www.cnblogs.com/chaoyuehedy/p/9004224.html
解決公眾號跳轉(zhuǎn)APP的問題，其實要先搞清楚各個平臺之間的關(guān)系，這里面涉及到三個端屁桑，微信公眾號，h5,和APP栏赴，所以這三個端的任務(wù)是：
1.公眾號的話要按照微信那邊來弄蘑斧，只能提供網(wǎng)址，這個網(wǎng)址也就是h5頁面的網(wǎng)址须眷，也就是下載或者跳轉(zhuǎn)頁面（或者說叫蒙板）竖瘾。
2.這個蒙板也就是h5頁面，在這個頁面寫邏輯花颗，做判斷捕传，判斷是android還是ios，能否喚起APP扩劝，如果不能顯示下載的按鈕給他下載庸论。
3.APP端，這個相對簡單棒呛，h5頁面喚起聂示，需要知道喚起哪個APP，也就是APP的scheme簇秒，這個scheme也就是用來喚起的名字鱼喉。
下面給出具體代碼：
1.公眾號：略
2.h5頁面：
import?{?LockOutlined,?MailOutlined?}?from?'@ant-design/icons';
import?{?Button,?Divider,?message,?Row,?Col,?Result,?Image,?Alert?}?from?'antd';
import?React,?{?useState,?useRef,?useEffect?}?from?'react';
import?ProForm,?{?ProFormCaptcha,?ProFormCheckbox,?ProFormText?}?from?'@ant-design/pro-form';
import?{?getWeChatMsgCode,?injectOpenId?}?from?'@/services/h5Auth';
import?'./index.less';
import?androidBack?from?'@/assets/androidBack.png';
import?rightArrow?from?'@/assets/rightArrow.png';
import?{?Component?}?from?'react';
const?baseScheme?=?'taobao://';
//?微信?H5?下載
class?WeChatDown?extends?Component?{
????constructor(props)?{
????????super(props);
????}
????state?=?{
????????buttonShow:?false,
????};
????componentDidMount()?{
????????this.isWeixinBrowser();
????????let?BrowserStatus?=?this.isWeixinBrowser();
????????console.log('是否為微信內(nèi)置瀏覽器：'?+?BrowserStatus);
????????if?(BrowserStatus?===?true)?{
????????????this.setState({
????????????????buttonShow:?false,
????????????});
????????}?else?if?(BrowserStatus?===?false)?{
????????????this.setState({
????????????????buttonShow:?true,
????????????});
????????????this.openApp();
????????}
????}
????//?創(chuàng)建iframe
????createIframe?=?()?=>?{
????????let?iframe;
????????this.createScheme();
????????return?function?()?{
????????????if?(iframe)?{
????????????????return?iframe;
????????????}?else?{
????????????????iframe?=?document.createElement('iframe');
????????????????iframe.style.display?=?'none';
????????????????document.body.appendChild(iframe);
????????????????return?iframe;
????????????}
????????};
????};
????//?定義App的scheme?測試使用淘寶的schemeconst?baseScheme?=?"taobao://";
????createScheme?=?(options,?isLink)?=>?{
????????let?urlScheme?=?baseScheme;
????????for?(let?item?in?options)?{
????????????urlScheme?=?urlScheme?+?item?+?'='?+?encodeURIComponent(options[item])?+?'&';
????????}
????????urlScheme?=?urlScheme.substring(0,?urlScheme.length?-?1);
????????return?encodeURIComponent(urlScheme);
????};
????openApp?=?()?=>?{
????????window.location.href?=?'smarttransport://';
????};
????downLoadApp?=?()?=>?{
????????let?u?=?navigator.userAgent;
????????let?isAndroid?=?u.indexOf('Android')?>?-1?||?u.indexOf('Linux')?>?-1;?//android終端
????????let?isIOS?=?!!u.match(/\(i[^;]+;(?U;)??CPU.+Mac?OS?X/);?//ios終端
????????if?(isAndroid)?{
????????????window.location.href?=?'https://a.app.qq.com/o/simple.jsp?pkgname=com.lucky.luckyclient';
????????}
????????if?(isIOS)?{
????????????message.info('IOS版本尚未完成開發(fā)，敬請期待',?0);
????????}
????};
????isWeixinBrowser()?{
????????var?agent?=?navigator.userAgent.toLowerCase();
????????if?(agent.match(/MicroMessenger/i)?==?'micromessenger')?{
????????????return?true;
????????}?else?{
????????????return?false;
????????}
????}
????render()?{
????????return?(
????????????<div?style={{?height:?'100%'?}}?className='wrapper'>
????????????????<div?className='imgBack'>
????????????????????{this.state.buttonShow???(
????????????????????????<Button
????????????????????????????className='downLoadFun'
????????????????????????????onClick={()?=>?{
????????????????????????????????this.downLoadApp();
????????????????????????????}}
????????????????????????>
????????????????????????????<div?className='downText'>下載發(fā)發(fā)貨</div>
????????????????????????</Button>
????????????????????)?:?null}
????????????????</div>
????????????</div>
????????);
????}
}
export?default?WeChatDown;
3.APP的android配置
在AndroidManifest.xml中加入如下代碼
<intent-filter>
????????????????<action?android:name="android.intent.action.VIEW"/>
????????????????<category?android:name="android.intent.category.DEFAULT"/>
????????????????<category?android:name="android.intent.category.BROWSABLE"/>
????????????????<data?android:scheme="smarttransport"/>
????????????</intent-filter>
具體位置在
<activity
????????????android:name=".MainActivity"
? ? ? ? ? ? >
????????????<intent-filter>
????????????????<action?android:name="android.intent.action.MAIN"?/>
????????????????<category?android:name="android.intent.category.LAUNCHER"?/>
????????????</intent-filter>
????????????<intent-filter>
????????????????<action?android:name="android.intent.action.VIEW"/>
????????????????<category?android:name="android.intent.category.DEFAULT"/>
????????????????<category?android:name="android.intent.category.BROWSABLE"/>
????????????????<data?android:scheme="smarttransport"/>
????????????</intent-filter>
????????</activity>
