javascript h5唤起原生app的方法

这里用的是 callapp-lib插件 我看了网上一些跳转操作 也可以有location.href 和iframe

1. 这个插件在定义callback时候就不再执行fallback了 但appStore还是会打开 还有超过了timeout定义的时间还是会打开 所以这里安卓和ios是分开做的
2. 所以 timeout设置合理的时间 只要超时就会打开fallback 或者appstore

// "callapp-lib": "^3.5.3"
import CallApp from "callapp-lib";
// 定义什么端
export const isNav = (() => {
    const userAgent = navigator.userAgent.toLowerCase();
    const isWechat = userAgent.indexOf('micromessenger') !== -1;
    const isIos = /iphone|ipod|ipad/.test(userAgent);
    const isAndroid = /android/.test(userAgent);
    return { isWechat, isIos, isAndroid }
})()
const iosOption: any = {
    scheme: { protocol: '' }, // ios的scheme 必填
    fallback: ''  // 这个是调用失败跳转的链接
}
const andOption: any = {
    scheme: { protocol: 'app://xxxx', host: 'xxxx' }, // android的scheme  app://这个可能是必要的前缀 我是web 不太理解安卓和苹果的东西 必填
    fallback: '', // 这个是调用失败跳转的链接
}
export const handleOpenApp = (_props = { form: '' }) => {
    if (isNav.isWechat) {
        alert('请在浏览器中打开');
    } else {
        const isOp = isNav.isIos ? iosOption : isNav.isAndroid ? andOption : {}
        const callLib = new CallApp({
            timeout: 2000, // 超时
            appstore: '', // 这个是必填的 不管是and还是ios 
            ...isOp
        });
        if (isNav.isIos) {
            callLib.open({
                param: { ..._props }, // 携带参数
                path: _props?.form // 跳转到原生app路径
            });
        } else if (isNav.isAndroid) {
            callLib.open({
                param: { ..._props },
                path: _props?.form
            });
        }
    }
}