html5使用 callapp-lib 唤起app （教程）+ 踩坑系列

首先引入callapp-lib vue 项目

npm install --save callapp-lib

纯html

<!-- 及时下载未压缩的最新版本 Js -->
<script src="https://unpkg.com/callapp-lib"></script>

or

<!-- 具体某一版本，本例中是 3.1.2 ，下载速度较上面快一些，因为上面的地址会有 302 -->
<script src="https://unpkg.com/callapp-lib@3.1.2/dist/index.umd.js"></script>

import CallApp from 'callapp-lib'; 引入  callapp-lib 用到的地方不多可以在单页面引入

openApp(url) { //打开app的方法
        const options = {
          scheme: {
            protocol: 'TianDuAlipayVerify' //这个要和你们ios的工程师 沟通下拿到这个标识 才可以打开
          },
          yingyongbao: 'https://a.app.qq.com/o/simple.jsp?pkgname=com.isoftstone.quancai', //应用宝的下载链接去应用宝分享出来即可 这一点很方便给老马点赞
          appstore: 'https://itunes.apple.com/cn/app/id1435254064', 这个是ios的下载地址 打不开app就会去appstore
          fallback: 'https://share.fcw-china.com/share.html?telnum=13381597096', 这个是app的跳转失败去的页面
          timeout: 5000,//坑来了 这里我必须写的时间长一点不然ios打开会出问题，现在ios 已经禁止了获取本地app的接口了所以现在只能通过app打开的时长来判断是否app已经下载ps:刚开始没有设置时间然后就一直打开app 后跳appstore 看了好久文档才知道是这个原因
        }
        const callLib = new CallApp(options)
        console.log(url);
        callLib.open({
          param: url.param,
          path: url.path
        })
      },

这里是纯html页面的了个人觉得用vue项目做嵌入/推广页面方便点

1. <script>

2. const option = {

3. scheme: {

4. protocol: 'ykshortvideo',

5. },

6. outChain: {

7. protocol: 'ykshortvideo',

8. path: 'temporary',

9. key: 'url',

10. },

11. intent: {

12. package: 'com.youku.shortvideo',

13. scheme: 'ykshortvideo',

14. },

15. universal: {

16. host: 'flash-link.youku.com',

17. pathKey: 'action',

18. },

19. appstore: 'https://itunes.apple.com/cn/app/id1383186862',

20. yingyongbao: '//a.app.qq.com/o/simple.jsp?pkgname=com.youku.shortvideo',

21. fallback: 'https://dianliu.youku.com/service/download',

22. timeout: 2000,

23. };

24. const lib = new CallApp(option);

25. const callButton = document.querySelector('#call-button');

26. callButton.addEventListener('click', () => {

27. lib.open({

28. path: 'profile',

29. });

30. });

31. </script>