HTML5 App Download Page (H5 App 下载落地页) All In One
<h1 id="html5-app-download-page-h5-app-下载落地页-all-in-one">HTML5 App Download Page (H5 App 下载落地页) All In One</h1><pre><code class="language-html">
</code></pre>
<pre><code class="language-js"> /**
浏览器版本信息
* @type {Object}
* @return {Boolean} 返回布尔值
*/
function browser() {
var u = navigator.userAgent.toLowerCase();
var app = navigator.appVersion.toLowerCase();
return {
txt: u, // 浏览器版本信息
version: (u.match(/.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/) || []), // 版本号
msie: /msie/.test(u) && !/opera/.test(u), // IE内核
mozilla: /mozilla/.test(u) && !/(compatible|webkit)/.test(u), // 火狐浏览器
safari: /safari/.test(u) && !/chrome/.test(u), //是否为safair
chrome: /chrome/.test(u), //是否为chrome
opera: /opera/.test(u), //是否为oprea
presto: u.indexOf('presto/') > -1, //opera内核
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/), //ios终端
android: u.indexOf('android') > -1, //android终端
iPhone: u.indexOf('iphone') > -1, //是否为iPhone
iPad: u.indexOf('ipad') > -1, //是否iPad
webApp: !!u.match(/applewebkit.*mobile.*/) && u.indexOf('safari/') == -1 //是否web应该程序，没有头部与底部
};
}
var timeout;
function open_appstore() {
var b=browser();
if(b.ios||b.iPhone||b.iPad){
window.location="itms-apps://itunes.apple.com/cn/app/qq-2011/id444934666?mt=8";
}else if(b.android){
//
}
}
function try_to_open_app() {
var b=browser();
if(b.ios||b.iPhone||b.iPad){
window.location="mqq:open";
}else if(b.android){
//
}
timeout = setTimeout('open_appstore()', 30);
}
try_to_open_app();
</code></pre>
<pre><code class="language-js">const log = console.log;
window.onhashchange = locationHashChanged;
function locationHashChanged(e) {
log(`location.hash`, location.hash);
log(`e.oldURL, e.newURL`, e.oldURL, e.newURL);
// if (location.hash === "#pageX" ) {
// pageX();
// }
},
const autoOpenApp = () => {
try {
log(`try open installed app!`);
window.location = "mqq:open";
} catch (err) {
log(`open app uninstalled!`, err);
// window.location = "mqq:open";
}
// window.location.addEventListener(`reload`, (e) => {
// log(`window.location reload`, e);
// });
setTimeout(() => {
let ua = navigator.userAgent.toLowerCase();
let env = ua.includes(`mobile`) ? true : false;
if (env) {
log(`app evn`, env);
window.location="itms-apps://itunes.apple.com/cn/app/qq-2011/id444934666?mt=8";
} else {
window.location="http://itunes.apple.com/cn/app/qq-2011/id444934666?mt=8";
log(`browser evn`, env);
}
}, 1000);
};
document.addEventListener(`DOMContentLoaded`, () => {
let alink = document.querySelector(``);
if(alink) {
alink.addEventListener(`click`, (e) => {
e.preventDefault;
autoOpenApp();
});
}
});
</code></pre>
<pre><code class="language-js">
</code></pre>
<p><img src="https://img2020.cnblogs.com/blog/740516/202106/740516-20210624202704510-1080696826.png" alt="" loading="lazy"></p>
<h2 id="demos">demos</h2>
<blockquote>
<p>H5</p>
</blockquote>
<iframe height="332" style="width: 100%; max-width: 376px" scrolling="no" title="" src="https://codepen.io/xgqfrms/embed/ExWqazz?defaultTab=result" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
See the Pen <a href="https://codepen.io/xgqfrms/pen/ExWqazz">
</a> by xgqfrms (<a href="https://codepen.io/xgqfrms">@xgqfrms</a>)
on <a href="https://codepen.io">CodePen</a>.
</iframe>
<p><img src="https://img2020.cnblogs.com/blog/740516/202106/740516-20210624202551490-1626785350.png" alt="" loading="lazy"></p>
<blockquote>
<p>PC</p>
</blockquote>
<iframe height="533" style="width: 100%" scrolling="no" title="" src="https://codepen.io/xgqfrms/embed/GRWVJKr?defaultTab=result" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
See the Pen <a href="https://codepen.io/xgqfrms/pen/ExWqazz">
</a> by xgqfrms (<a href="https://codepen.io/xgqfrms">@xgqfrms</a>)
on <a href="https://codepen.io">CodePen</a>.
</iframe>
<p><img src="https://img2020.cnblogs.com/blog/740516/202106/740516-20210624202635717-1245931905.png" alt="" loading="lazy"></p>
<h2 id="android-deep-link--ios-universal-link--url-scheme">Android Deep Link & iOS Universal Link & URL Scheme</h2>
<p>https://www.cnblogs.com/xgqfrms/tag/Deep Link/</p>
<h2 id="refs">refs</h2>
<p>http://mobile.sptcc.com/mobiledownload/download_pc.html</p>
<p>http://mobile.sptcc.com/event/?from=timeline&isappinstalled=1</p>
<hr>
<div>
</div>
<hr>
<blockquote style="display: flex; flex-flow: column; align-items: center; justify-content: center; text-align: center; border: none">
<h3><strong><span style="font-size: 16pt; color: rgba(0, 255, 0, 1)">©xgqfrms 2012-<span data-uid="copyright-aside">2020</span></span></strong>
<p><span style="font-size: 18pt; color: rgba(0, 255, 0, 1)"><strong>www.cnblogs.com/xgqfrms 发布文章使用：只允许注册用户才可以访问！</strong></span></p>
<p><span style="font-size: 18pt; color: rgba(0, 255, 0, 1)"><strong>原创文章，版权所有©️xgqfrms, 禁止转载 🈲️，侵权必究⚠️！</strong></span></p>
</h3></blockquote>
<hr>
</div>
<div id="MySignature" role="contentinfo">
<div style="display: flex; flex-flow: column nowrap; align-items: center; justify-content: center;">
<p>本文首发于博客园，作者：xgqfrms，原文链接：https://www.cnblogs.com/xgqfrms/p/14928443.html</p>
<p style="color: red; font-size: 23px; margin-top: 5px; margin-botom: 5px;">未经授权禁止转载，违者必究！</P>
</div>
<hr/><br><br>
来源：https://www.cnblogs.com/xgqfrms/p/14928443.html
頁:
[1]