I received a wireless request two days ago, and I, a novice, have been busy for several days... There is a link on the page. If the user has installed the APP, click to open the corresponding APP. If the user has not installed it, click to open the corresponding APP. Set up the connection. I searched online and basically said it can be achieved, but the actual situation is not optimistic.
Of course, it is just one of the requirements. There are also various H5 pages shared by various apps now, usually with an "Open immediately" button, if the app is installed locally, it will directly call up the local app. If it is not installed, it will jump to the download. This is a very normal strategy for promotion and traffic diversion. Recently, the product manager has put forward such a demand, making a download bar with the app open like Toutiao function, etc., and I won’t talk about the rest!
Now let’s get to the main topic today, how does H5 open or call up local apps on mobile phones? Looking at the answers on Baidu and Google, there are only two types:
First way:
Configure the Android-side scheme directly in the href in the a tag of HTML. Of course, if there are other host configurations, just follow them. The Android-side configuration and code are as follows:
android side configuration:
<activity android:name = ".MainActivity">
<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.DEFAULT"/>
<category android:name="android.intent.category.BROWSABLE"/>
<data android:host="jingewenku.com"
android:scheme="abraham"/>
</intent-filter>
</activity>
Note: If this is configured on the startup page, it must be placed side by side with the label, otherwise there will be no icon of the mobile app after running; note that the scheme protocol must be lowercase, otherwise there will be an exception that cannot respond!
html code:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<a href="abraham://jingewenku.com/?pid=1">打开app</a><br/>
</body>
</html>
Here we take a look at the format of the scheme splicing protocol:
< a href="[scheme]://[host]/[path]?[query]">启动应用程序< /a>
The meaning of each item is as follows:
scheme: identify the started App. ※Details described later
host: appropriate description
path: necessary key when passing value ※It is ok if it is not available
query: Get the Key and Value of the value ※It’s ok if you don’t have it
The above can be used to open the local app, of course, when the app exists, otherwise there will be no response.
You may ask, isn’t the scheme protocol configured in android configured in the above html code? I obviously didn't configure the pid, why should I write this? This is because sometimes when we invoke the local app, we may pass some parameters to the app. We can configure these parameters here. We only need to get them in oncreate. The code is as follows:
Intent intent = getIntent();
Uri uri = intent.getData();
if (uri != null) {
String pid = uri.getQueryParameter("pid");
}
If you also want to get the scheme protocol configured in Android, you can also do this:
Uri uri = getIntent().getData();
if(uri != null) {
// 完整的url信息
String url = uri.toString();
Log.e(TAG, "url: " + uri);
// scheme部分
String scheme = uri.getScheme();
Log.e(TAG, "scheme: " + scheme);
// host部分
String host = uri.getHost();
Log.e(TAG, "host: " + host);
//port部分
int port = uri.getPort();
Log.e(TAG, "host: " + port);
// 访问路劲
String path = uri.getPath();
Log.e(TAG, "path: " + path);
List<String> pathSegments = uri.getPathSegments();
// Query部分
String query = uri.getQuery();
Log.e(TAG, "query: " + query);
//获取指定参数值
String goodsId = uri.getQueryParameter("goodsId");
Log.e(TAG, "goodsId: " + goodsId);
}
How to determine whether a Scheme is valid:
PackageManager packageManager = getPackageManager();
Intent intent = newIntent(Intent.ACTION_VIEW, Uri.parse("abraham://jingewenku.com:8888/goodsDetail?goodsId=10011002"));
List<ResolveInfo> activities = packageManager.queryIntentActivities(intent, 0);
booleanisValid = !activities.isEmpty();
if(isValid) {
startActivity(intent);
}
This method is also the one I see most on Baidu, but it brings a problem. The above requirement says "there is a connection on the page. If the user installs the APP, click to open the corresponding APP; if If the user has not installed it, click to open the corresponding setting connection." This obviously does not meet the needs and can only be used for some individual needs.
Second way:
Since configuring the scheme protocol in href does not work, it can only be achieved through js code. Only in this way can the app be opened based on judgment when it is available, and jump to the download link to download when not.
We know that js cannot determine whether a certain app is installed on the phone, so we can only save the country through curves. We can get the time. If the app cannot be called up for a long time, it will default to the app not being installed, and then jump to download. Page. Of course, this is not what I came up with, it is what the big guys on the Internet think. Here we have to subdivide it into two situations.
1. Wake up directly
Note: You can change the app through h5. For example, visit a URL, click the button, and open the application. If the application APP is not installed, then jump directly to the APP download page of the App Store. The compatibility is better by clicking. If installed With the app, it can be awakened in major mobile browsers (360 browser, uc browser, Sogou browser, QQ browser, Baidu browser) and QQ client. WeChat, Sina Weibo client, and Tencent Weibo client cannot be awakened.
code show as below:
<html xmlns=http://www.w3.org/1999/xhtml>
<head>
<meta http-equiv=Content-Type content="text/html;charset=utf-8">
<head>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<title>点击唤醒demo</title>
</head>
<body>
<style>
#zjmobliestart{font-size:40px;}
</style>
<!--
说明：通过h5可换醒app，如访问一个URL，点击按钮，打开应用，如果该应用APP没有安装，那么直接跳转到App Store的APP下载页面，通过点击的方式。兼容性较好，如果安装了app，在手机各大浏览器(360浏览器 uc浏览器 搜狗浏览器 QQ浏览器 百度浏览器 )和QQ客户端中，能唤醒。微信 新浪微博客户端 腾讯微博客户端无法唤醒。
-->
<a href="zjmobile://platformapi/startapp" id="zjmobliestart" target="_blank">唤醒浙江移动手机营业厅！</a>
<script type="text/javascript">
function applink(){
return function(){
var clickedAt = +new Date;
setTimeout(function(){
!window.document.webkitHidden && setTimeout(function(){
if (+new Date - clickedAt < 2000){
window.location = 'https://itunes.apple.com/us/app/zhe-jiang-yi-dong-shou-ji/id898243566#weixin.qq.com';
}
}, 500);
}, 500)
};
}
document.getElementById("zjmobliestart").onclick = applink();
</script>
</body>
</html>
2. Click to wake
Note: You can wake up the app through h5. If you visit a URL, you can directly open the application. If the application APP is not installed, then jump directly to the APP download page of the App Store. General compatibility: It can be awakened in major mobile phone browsers (360 browser, uc browser, Sogou browser, QQ browser, and Baidu browser). WeChat, QQ client, Sina Weibo client, and Tencent Weibo client cannot be awakened.
code show as below:
<!Doctype html>
<html xmlns=http://www.w3.org/1999/xhtml>
<head>
<meta http-equiv=Content-Type content="text/html;charset=utf-8">
<head>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<title>直接唤醒demo</title>
</head>
<body>
<style>
#zjmobliestart{font-size:40px;}
</style>
<!--
说明：通过h5可换醒app，如访问一个URL就能直接打开应用，如果该应用APP没有安装，那么直接跳转到App Store的APP下载页面
兼容性一般：在手机各大浏览器(360浏览器 uc浏览器 搜狗浏览器 QQ浏览器 百度浏览器 )能唤醒。微信 QQ客户端 新浪微博客户端 腾讯微博客户端无法唤醒。
-->
<p id="zjmobliestart">唤醒浙江移动手机营业厅！</p>
<script type="text/javascript">
function applink(){
window.location = 'zjmobile://platformapi/startapp';
var clickedAt = +new Date;
setTimeout(function(){
!window.document.webkitHidden && setTimeout(function(){
if (+new Date - clickedAt < 2000){
window.location = 'https://itunes.apple.com/us/app/zhe-jiang-yi-dong-shou-ji/id898243566#weixin.qq.com';
}
}, 500);
}, 500)
}
applink();
</script>
</body>
</html>
In this way, our needs have been completed. During this process, we also encountered many enthusiastic people's explanations. I will record them here. At first, some people did not understand my needs and thought that I was implementing it on the Android side. They asked me to pass the package name. To check whether the app is installed, record the method here, the code is as follows:
For more methods, please check out my tool class : CommonUtilLibrary
Others think that I want to invoke the local app by loading the webview in the app. I will also record it here. The code is as follows:
webView.setWebViewClient(new WebViewClient(){
@Override public boolean shouldOverrideUrlLoading(WebView view, String url) {
Uri uri=Uri.parse(url);
if(uri.getScheme().equals("abraham")&&uri.getHost().equals("jingewenku.com")){
String arg0=uri.getQueryParameter("arg0");
String arg1=uri.getQueryParameter("arg1");
}else{
view.loadUrl(url);
} return true;
}});
It should also be noted that if the local app is invoked in WeChat, the WeChat on the mobile phone uses the built-in browser of WeChat (you can send the address of the previously obtained page on the server to any of your contacts, click Send message to open the web page) Open that simple HTML page. Note: It is not feasible to directly open scheme://host/datastring. WeChat will not parse this string of characters into a URL. It must be packaged into a web page to browse with WeChat. The device is turned on. After entering, you will see the page we just designed. At this time, directly clicking "Launch Application" will not wake up the previously installed APP, because WeChat has blocked it. You need to select "Open in browser" from the menu in the upper right corner. At this time, some browsers can wake up, but some browsers cannot. For example, if the built-in browser on the author's test machine MX4 does not work, UC Browser can wake up. Some browsers cannot be woken up. I have consulted a lot of information and cannot completely solve it. The only thing I can think of now is to let the front-end make a judgment on the browser that encounters the problem. It will prompt that it is not supported and what browser should be used. If any reader has a solution, please leave a message, thank you!
Postscript:
Why can't I wake up the App in WeChat and need to "open it with a browser"?
Because WeChat has implemented scheme shielding on all sharing connections, that is to say, all calls to scheme in the sharing connections have been blocked by WeChat.
So why are some applications evocative, such as Dianping and Didi Taxi?
From a non-technical perspective, because of Dianping and Didi Taxi, they are both godsons and biological sons of WeChat. He has special care for his son.
From a technical perspective, WeChat has a whitelist, and scheme calls will not be blocked for shared connections in the whitelist.
do not understand? Let's give an example.
For example, Dianping's sharing link is http://dazhongdianping.share.1.com,
which corresponds to http://dazhongdianping in the WeChat whitelist. All sharing originating from this link will not block the scheme. ,
such as http://dazhongdianping.share.2.com
http://dazhongdianping.share.3.com
Even a subsidiary of Dianping can use http://zigongsi.dazhongdianping.share.3.com. The root domain name is also in the whitelist, so it can be used.
At this point, everyone should understand that it is impossible to bypass this problem by borrowing Dianping's scheme unless your sharing link can be linked to Dianping's root domain name.
This question should be explained clearly. In addition, WeChat blocks any application such as downloading apk, and sons are no exception. So if you want to provide a download link, no matter whether you are a son or not, you cannot escape using a browser to open it. Among the low methods.
Appendix: URL Schemes for Common Applications
1. System default application
| name | URL Scheme | Bundle identifier |
|---|---|---|
| Safari | http:// | |
| maps | http://maps.google.com | |
| Phone | tel:// | |
| SMS | sms:// | |
| mailto:// | ||
| iBooks | ibooks:// | |
| App Store | itms-apps://itunes.apple.com | |
| Music | music:// | |
| Videos | videos:// |
2. Commonly used third-party software
| name | URL Scheme | Bundle identifier |
|---|---|---|
| mqq:// | ||
| weixin:// | ||
| Tencent Weibo | TencentWeibo:// | |
| Taobao | taobao:// | |
| Alipay | happy // | |
| sinaweibo:// | ||
| weico Weibo | weico:// | |
| QQ browser | mqqbrowser:// | com.tencent.mttlite |
| uc browser | dolphin:// | com.dolphin.browser.iphone.chinese |
| Open Browser | ohttp:// | com.oupeng.mini |
| Sogou Browser | SogouMSE:// | com.sogou.SogouExplorerMobile |
| Baidu map | baidumap:// | com.baidu.map |
| Chrome | googlechrome:// | |
| Youku | youku:// | |
| Jingdong | openapp.jdmoble:// | |
| everyone | renren:// | |
| Meituan | imeituan:// | |
| Shop No. 1 | wccbyihaodian:// | |
| Let me check | wcc:// | |
| Youdao Dictionary | dictproapp:// | |
| Know almost | zhihu:/ | |
| Review | dianping:// | |
| flash disk | sinavdisk:// | |
| Doubanfm | doubanradio:// | |
| NetEase open class | ntesopen:// | |
| All-round business card king | camcard:// | |
| QQ Music | qqmusic:// | |
| Tencent Video | tenvideo:// | |
| Douban Movies | doubanmovie:// | |
| NetEase Cloud Music | orpheus:// | |
| Netease News | newsapp:// | |
| NetEase application | apps:// | |
| NetEase Lottery | ntescaipiao:// | |
| YouDao Cloud Note | youdaonote:// | |
| look more | duokan-reader:// | |
| National Air Quality Index | dirtybeijing:// | |
| Baidu music | baidumusic:// | |
| Go to the kitchen | xcfapp:// |
See the links for more:
http://blog.csdn.net/swift_vip/article/details/51727321
http://blog.csdn.net/feiyang02/article/details/49862401
http://blog.csdn.net/wm9028 /article/details/49995329
Reprinted from:
http://blog.csdn.net/u014727709/article/details/78770422
Welcome to start, comments and corrections welcome
