HTML5打开本地app应用的示例代码

来源：铧拓汽车网

这篇文章主要介绍了HTML5打开本地app应用的方法，如果你的手机上安装有支付宝，那么在访问支付宝手机网页时就会自动打开支付宝app，否则在页面上会提示你进行下载app，这是如何实现的？感兴趣的小伙伴们可以参考本文

本文为大家分享了HTML5打开本地app应用的方法，具体内容如下

首先为了保证能够打开你的app，你必须要在androidManifest.xml中配置的filter中data的属性表述。<data android:pathprefix="/taoge/open" android:scheme="xttblog"></data> androidManifest.xml代码如下：

<?xml version="1.0" encoding="utf-8"?> 
<manifest xmlns:android="http://schemas.android.com/apk/res/android" 
 package="com.taoge" 
 android:versionCode="2" 
 android:versionName="3.24.03" > 
 <uses-sdk 
 android:minSdkVersion="8" 
 android:targetSdkVersion="17" /> 
 <application 
 android:allowBackup="true" 
 android:configChanges="orientation|screenSize" 
 android:icon="@drawable/logo" 
 android:label="@string/app_name" 
 android:logo="@drawable/logo" 
 android:sharedUserId="android.uid.system" 
 android:theme="@android:style/Theme.Light.NoTitleBar" > 
 <activity 
 android:name="xttblog.WelcomeActivity" 
 android:excludeFromRecents="true" 
 android:screenOrientation="portrait" 
 android:theme="@android:style/Theme.Light.NoTitleBar" > 
 <intent-filter> 
 <action android:name="android.intent.action.MAIN" /> 
 <category android:name="android.intent.category.LAUNCHER" /> 
 </intent-filter> 
 <intent-filter> 
 <action android:name="android.intent.action.VIEW" /> 
 <category android:name="android.intent.category.BROWSABLE" /> 
 <category android:name="android.intent.category.DEFAULT" /> 
 <data android:pathPrefix="/taoge/open" 
 android:scheme="xttblog" /> 
 </intent-filter> 
 </activity> 
 <activity 
 android:name="xttblog.AntRepairActivity" 
 android:label="@string/title_activity_ant_repair" > 
 </activity> 
 </application> 
</manifest>

其次，你要在你的网页中访问xttblog://taoge/open。可以使用的元素有很多，如：script，iframe，img等。使用它们的src属性，访问xttblog://taoge/open。html5代码如下：

<!DOCTYPE HTML> 
<html> 
<script> 
 function openapp(){ 
 document.getElementById('xttblog').innerHTML='<iframe src="xttblog://taoge/open"></iframe>'; 
 } 
</script> 
<body> 
 <p style="display:none;" id="xttblog"></p> 
 <input type="button" value="打开app" onclick="openapp();"> 
</body> 
</html>

显示全文

全部频道

HTML5打开本地app应用的示例代码