当前位置: 首页 > 工具软件 > html5lib > 使用案例 >

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

汪明德
2023-12-01

首先引入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>

 类似资料: