有需求说要通过页面按钮唤醒app,或者手机上没有这款app跳转到商店,然后刚开始也是查了资料的,结果发现一头雾水,不过最后还是捣鼓出来了,当然也参考了前人分享的经验,下面我就将方法整理一下:

首先明确一下目的,是要在分享出去的html页面,通过js操作唤醒app或者打开商店,那么第一步就应该先判断当前的环境,这里我附上详细的判断方法,通用的

var browser = {

versions: function() {

var u = navigator.userAgent,

app = navigator.appVersion;

return {

trident: u.indexOf('Trident') > -1,

presto: u.indexOf('Presto') > -1,

webKit: u.indexOf('AppleWebKit') > -1,

gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1,

mobile: !!u.match(/AppleWebKit.*Mobile.*/),

ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),

android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1,

iPhone: u.indexOf('iPhone') > -1,

iPad: u.indexOf('iPad') > -1,

webApp: u.indexOf('Safari') == -1,

souyue: u.indexOf('souyue') > -1,

superapp: u.indexOf('superapp') > -1,

weixin:u.toLowerCase().indexOf('micromessenger') > -1,

Safari:u.indexOf('Safari') > -1

};

}(),

language: (navigator.browserLanguage || navigator.language).toLowerCase()

};

这里用到两个判断,一个ios一个安卓

if (browser.versions.ios) {

//你的代码

}else if (browser.versions.android){

//你的代码

}

那么接下来就应该判断当前手机上是否有安装某款应用,但是要知道js是无法判断手机上是否安装了哪款app的,所以有app打开app,没有app跳转到商店就可以这么做,js打开ios系统app的方法是这样的,拿淘宝为例:

taobao://

那么同理安卓的方法也是一样的,只不过打开app的协议不同,这个对应的打开app的协议是你们ios和安卓开发的小伙伴提供给你的,接下来的原理就是尝试发起打开app的请求,如果有提示是否在某款app中打开,那就可以直接打开了,如果打不开那么我们就要做另外一件事情了

if (browser.versions.ios) {

window.location.href = "taobao://";

setTimeout(function(){

window.location.href = "你的app在商店中的地址";

window.location.href = "你的app在商店中的地址";  //为什么要加两遍我下面会说到

},2000)

}else if (browser.versions.android){

window.location.href = "taobao://**";

setTimeout(function(){

window.location.href = "你的app的下载地址";

},2000)

}

当然为什么要加定时器,相信大家也都知道,因为打开app是需要时间的,而js代码瞬间就执行完毕了,当然这里还有几个坑,ios系统第一次window.location.href尝试打开app有时候会弹一下是否在某款app中打开之后马上跳到商店,为了解决这个问题我加了两遍window.location.href。

通过JS唤醒app(安卓+ios)的更多相关文章

  1. 史上最简单JS复制功能,兼容安卓ios!

    1.JS复制原理: 被复制内容的元素不能被其他元素遮盖,否则无效.  (设置opacity透明为0,不可以设置display:none); 2.常规的复制方法 function copyUrl2() ...

  2. 手机浏览器_安卓_苹果手机Webview 中唤醒APP

    Url scheme是iOS,Android平台都支持,只需要原生APP开发时注册scheme, 那么用户点击到此类链接时,会自动跳到APP.比如 <!-- 打开考拉APP首页 --> & ...

  3. iOS universallinks唤醒app

    从iOS9之后,苹果就推出了这个功能,用来唤醒外部app.这个功能在那些电商app上使用尤其广泛,当你打开对应的h5网页后,上面跳出一个是否跳转app的按钮. 现在iOS11已经基本覆盖,iOS12也 ...

  4. ios下微信浏览器如何唤醒app?app已上架应用宝

    android下可以通过在应用宝微下载地址后面加参数&android_schema='应用schema'来实现,ios下如何实现? ios下微信浏览器如何唤醒app?app已上架应用宝 > ...

  5. 利用ios safari浏览器生成桌面快捷方式并唤醒app的示例代码

    html 内容: //通过a链接唤醒app  <a href="app约定好的scheme" id="qbt" style="display:n ...

  6. H5唤醒app,第三方开源库

    在微信浏览器内,安卓打开应用宝,ios跳进appstore,基本都可以成功在外部浏览器内,已安装可进入应用内,未安装进入应用宝提示下载,需客户端支持.<!DOCTYPE html> < ...

  7. js调用app启动页

    第一步:添加js $(function () { var ua = window.navigator.userAgent.toLowerCase(); //微信 if(ua.match(/MicroM ...

  8. 从浏览器或者Webview 中唤醒APP

    本文来自网易云社区 作者:刘新奇 移动互联时代,很多互联网服务都会同时具备网站以及移动客户端,很多人认为APP的能帮助建立更稳固的用户关系,于是经常会接到各种从浏览器.webview中唤醒APP的需求 ...

  9. H5网页唤醒app,判断app安装

    在阅读本文之前你首先应该对js有基本对掌握,并且对Scheme,intent有一定的理解.更多的是代码 上午给朋友做了一个产品引导页,但是需要判断ios系统的TestFlight是否安装,进行了goo ...

随机推荐

  1. .NET 复制A对象值到B对象

    1.最基础的ModelCopy using System; using System.Collections.Generic; using System.ComponentModel; public ...

  2. &quot;未能载入文件或程序集“XXX”或它的某一个依赖项。系统找不到指定的文件&quot;的解决方式

    今天在写反射调用的时候失败了,经过调试和分析,终于攻克了,以下我就详细说明. 一,报错的现象 未能载入文件或程序集"DalSQL"或它的某一个依赖项.系统找不到指定的文件. 说明: ...

  3. 关于C语言指针的一些新认识(1)

    Technorati 标签: 指针,数组,汇编,C语言 前言 指针是C语言的精华,但我对它一直有种敬而远之的感觉,因为一个不小心就可能让你的程序陷入莫名其妙的麻烦之中.所以,在处理字符串时,我总是能用 ...

  4. wordpress 配置(ubuntu)---修改 linux hostname

    使用阿里云服务器的 ubuntu 系统时的 hostname 太扭曲,而且有些命令会受 hostname 的影响不能正常使用,所以,一定要改掉它! 永久修改 hostname: 使用 nano 命令: ...

  5. jenkins对接gitlab和git

    1 需要的插件 jenkins的git插件和jenkins的gitlab插件. 2 对接gitlab 在系统配置中,随便起一个连接的名字,设置url,可以直接用ip地址,端口号默认是80,不需要写明. ...

  6. IT痴汉的工作现状22-由Dalvik虚拟机引发的口水战

    Dalvik是啥呢? 从未知道冰岛有Dalvik这么一个重要的村庄.直到Dan Bornstein将自己为Android系统编写的进程虚拟机命名为Dalvik后才被我所知. 它是Android系统独有 ...

  7. hadoop hbase 快速启动 关闭 配置:

    vim ~/.bashrcexport JAVA_HOME=/usr/lib/jvm/java-8-openjdk-amd64   //JDK安装路径export HADOOP_HOME=/usr/l ...

  8. 作业训练------通过读取c.txt文件中的内容等号右值,并将右值的最大值、最小值、平均值打印到屏幕上。

    这篇博客是学习传智播客c++教程的作业,通过在网上进行搜集来完成,但是网上有相似的代码,但是结果总是有点问题,所以本文写了这篇记录下. #include <stdio.h> #includ ...

  9. 使用display:flex;实现两栏布局和三栏布局

    一.使用display:flex;实现两栏布局 body,div{margin:0px;padding:0px;} .flex-container{display:flex;height:300px; ...

  10. python抢票开发——设备预约助手实现

    女朋友是药学院的,做实验时需要在特定的网站上进行设备预约,由于预约人数过多,从而导致从浏览器登录不进去或者登录进去预约失败等情况,所以我用python帮她写了一个抢位助手,让程序自动去进行位置预定,实 ...