HTML5 sample code to open local app application-H5 Tutorial-php.cn

HTML5 sample code to open local app application

黄舟

Release： 2017-03-14 16:02:01

Original

2774 people have browsed it

This article mainly introduces the HTML5 method of opening a local app application. If you install Alipay on your mobile phone, Alipay will automatically open when you visit the Alipay mobile webpage app, otherwise you will be prompted to download the app on the page. How is this achieved? Interested friends can refer to this article

This article shares with you how to open local app applications in HTML5. The specific content is as follows

First of all, in order to ensure that you can open your app, you must The attribute expression of data in the filter configured in androidManifest.xml. androidManifest.xml code is as follows:

<?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>

Copy after login

##Secondly, you need to visit xttblog://taoge/open in your web page. There are many elements that can be used, such as: script, iframe, img, etc. Using their src attribute, visit xttblog://taoge/open. The html5 code is as follows:

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

Copy after login

The above is the detailed content of HTML5 sample code to open local app application. For more information, please follow other related articles on the PHP Chinese website!