ios h5跳转应用商店 h5跳转到app指定页面

转载

mob6454cc659b12 2024-08-01 09:27:04

文章标签 ios h5跳转应用商店 android 短信 html 跳转 文章分类 iOS 移动开发

最近公司为了增加用户活跃度，新增了许多活动，要求从多种方式可以跳转到App的指定页面。比如闪屏页、首页弹框、首页banner、webView、极光推送消息点击跳转以及通过短信跳转到App。

对此，我们制定了一套专属于公司的liubike协议，统一了三端的跳转，解决了跳转不规范和不全面的情况。
liubike协议和淘宝的taobao://、微信的 weixin://等类似，liubike协议遵循于URL schema。

URL Schema

URL Schema 的属性有 Scheme、Host、port、path、query。
比如

liubike://mine/settings?type=1&&id=7

这里我们可以得知

scheme: liubike  
host:mine  
path:settings
query:type=1&&id=7

这样，我们根据liiubike协议，就拥有了跳转到App任意页面的能力。

可优化的地方: 可以和ARouter的路由进行整合，从而体现路由化的优势

通过短信跳转到App指定页面

前面几个跳转通过liubike协议相对较好实现，但是对于通过短信直接跳转到App，IOS是可以实现的，而Android研究了一圈，发现都是通过先跳转到H5页面，然后再中转跳转到App的。
比如美团

【美团点评】「宁波」今日打车单单最高减20元！上班通勤不用慌，美团打车帮你忙 dpurl.cn/6A5zgkW 回TD退订

跳转到H5后，直接弹出了跳转到App的弹框。

如果点击允许打开，则直接打开App;

如果点击不允许打开，则还可以通过H5中的"已下载App立即打开"按钮，跳转到App中。

ios h5跳转应用商店 h5跳转到app指定页面_短信

又查看了优酷、中国电信等，都是类似的。

故最后决定，也采用此方案。

首先，我们需要先创建一个html

<!DOCTYPE html>
<html>
<head>
  <title>Android跳转测试</title>
</head>
<body>
  <a href="liubike://mine/settings?type=1&&id=7">打开</a></br>
</body>
</html>

然后，在AndroidManifest中，对SplashActivity，添加如下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="liubike"/>
</intent-filter>

data里scheme、path、host都可以指定，但是，由于我们跳转的页面是未知的，此处，我们只指定schema。
接着，我们在SplashActivity的onCreate中，实现跳转数据的接收

val action = intent?.action
if (Intent.ACTION_VIEW == action) {
    L.i(TAGs.SCHEME, "action_view")
    val uri = intent?.data?.toString()
    L.i(TAGs.SCHEME, "uri:$uri")
    if (uri != null) {
        val type = uri.getQueryParameter("type")
        val id = uri.getQueryParameter("id")
        //TODO 在这里可以跳转到指定页面
    }
}

最后，我们通过浏览器打开我们编写的html，点击a标签，就会弹出跳转App的弹框了。

ios h5跳转应用商店 h5跳转到app指定页面_短信_02

小结

至此，通过短信跳转到App的功能就可以实现了。
发送的短信中包含一个url，点击会跳转到h5中，接着通过h5的中转，最终可以跳转到App中。
不过我们demo中使用a标签的形式，还有兼容性问题，试了下QQ浏览器和系统自带浏览器，都是可以弹出跳转对话框的，但是夸克浏览器点击了并没有任何效果。这个就需要H5开发来兼容这些问题了，我们这里就不讨论了。