日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

RELATEED CONSULTING
相關(guān)咨詢
選擇下列產(chǎn)品馬上在線溝通
服務(wù)時(shí)間:8:30-17:00
你可能遇到了下面的問題
關(guān)閉右側(cè)工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營(yíng)銷解決方案
網(wǎng)頁(yè)端「應(yīng)用跳轉(zhuǎn)」技術(shù)實(shí)現(xiàn)演變

由于網(wǎng)頁(yè)傳播的便捷性,從網(wǎng)頁(yè)向app導(dǎo)流幾乎是所有APP廠商都會(huì)采用的推廣手段,具體來(lái)說(shuō)就是在網(wǎng)頁(yè)上提供一些觸發(fā)點(diǎn)(例如按鈕、鏈接),用于跳轉(zhuǎn)到APP。 

創(chuàng)新互聯(lián)10多年企業(yè)網(wǎng)站制作服務(wù);為您提供網(wǎng)站建設(shè),網(wǎng)站制作,網(wǎng)頁(yè)設(shè)計(jì)及高端網(wǎng)站定制服務(wù),企業(yè)網(wǎng)站制作及推廣,對(duì)成都純水機(jī)等多個(gè)方面擁有豐富的網(wǎng)站設(shè)計(jì)經(jīng)驗(yàn)的網(wǎng)站建設(shè)公司。

URL Scheme

早期的應(yīng)用跳轉(zhuǎn)只能通過「URL Scheme」實(shí)現(xiàn)。例如通過下面這個(gè)「URL Scheme」,就可以跳轉(zhuǎn)到「貝聊APP」:

ibeiliao://

在網(wǎng)頁(yè)中調(diào)用「URL Scheme」也有多種方法:


打開貝聊


打開貝聊


打開貝聊

 

原本「方案三」是***的,因?yàn)樵跊]有安裝對(duì)應(yīng)APP的情況下,另外兩個(gè)方案在iOS Safari下都會(huì)出現(xiàn)「瀏覽器無(wú)法打開網(wǎng)頁(yè)」的彈框。

然而,「方案三」是***“陣亡”的,最早是在iOS 9中的Safari失效,后來(lái)在某些安卓機(jī)的瀏覽器也不行了,所以目前只能用「方案一」和「方案二」,而iOS Safari下的那個(gè)彈框也就無(wú)法避免了。

理論上,「URL Scheme」可以在任何瀏覽器以及APP中的WebView使用,但實(shí)際上卻是被大量APP封殺,幾乎是只能在瀏覽器類的APP中使用。因?yàn)榇蟛糠謴S商都不希望用戶離開自己的APP。

打開還是下載?

前文提到了一個(gè)問題,萬(wàn)一設(shè)備上沒有安裝要跳轉(zhuǎn)的APP,那怎么辦呢?正常來(lái)說(shuō),應(yīng)該要跳到該APP的下載頁(yè)。然而,這里面***的難題是:網(wǎng)頁(yè)端基本上無(wú)法獲知當(dāng)前設(shè)備是否已安裝某個(gè)APP(之所以加上“基本”二字,是因?yàn)榫W(wǎng)頁(yè)在微信內(nèi)運(yùn)行時(shí),可通過調(diào)用微信內(nèi)部的JS API實(shí)現(xiàn)此功能,但該API只對(duì)騰訊的“關(guān)系戶”開放)。

后來(lái),人們想出了一種解決方案:在使用「URL Scheme」跳轉(zhuǎn)的同時(shí),通過定時(shí)器在一定時(shí)間之后跳轉(zhuǎn)到下載頁(yè)。倘若設(shè)備上有安裝APP,就會(huì)跳到APP,否則在一定時(shí)間后就會(huì)跳到下載頁(yè)。

打開貝聊

這么做基本上是達(dá)到了目的,但是有兩處體驗(yàn)問題仍然無(wú)法解決:

  • 即便已經(jīng)安裝APP,瀏覽器也會(huì)跳到下載頁(yè)。用戶從APP返回瀏覽器時(shí)會(huì)發(fā)現(xiàn)莫名其妙地出現(xiàn)了下載頁(yè)。
  • 在沒有安裝APP的情況下,iOS Safari的彈框還是無(wú)法避免,但是跳到下載頁(yè)之后會(huì)消失。

應(yīng)對(duì)封殺

前文有提及,「URL Scheme」被大量APP封殺,其中就包括常用的QQ和微信,但是沒有誰(shuí)會(huì)放棄這兩個(gè)重要渠道,所以還是得想轍。

最無(wú)奈的解決方案就是提示用戶「用瀏覽器打開網(wǎng)頁(yè)」,繼而讓用戶在瀏覽器中打開APP。然而,這對(duì)非IT人士來(lái)說(shuō),操作起來(lái)還是有一點(diǎn)繁雜的。

另一種好一點(diǎn)的做法是,先跳轉(zhuǎn)到騰訊的「應(yīng)用寶」,「應(yīng)用寶」會(huì)根據(jù)設(shè)備是否已裝APP去執(zhí)行打開或者下載操作。當(dāng)然,這種做法需要把APP傳到「應(yīng)用寶」,而且只對(duì)騰訊系的APP有效;對(duì)于其他APP,仍然只能提示「用瀏覽器打開網(wǎng)頁(yè)」。

***一個(gè)解決方案就是下文要講述的「Universal Links」。

Universal links

「Universal links」,中文翻譯為「通用鏈接」,從iOS 9開始支持,僅通過普通的https請(qǐng)求就能跳轉(zhuǎn)到指定的應(yīng)用。

開發(fā)者可以把應(yīng)用的下載頁(yè)地址配置為一條通用鏈接,這樣,用戶在進(jìn)入下載頁(yè)時(shí):

  • 如果設(shè)備上已安裝APP,則進(jìn)入APP;
  • 如果設(shè)備上沒有安裝APP,則進(jìn)入下載頁(yè),再也沒有那個(gè)煩人的彈框了。

最重要的是,通過「通用鏈接」,即使在微信、QQ內(nèi),也能如絲般順滑地跳到自家APP。大家都以為這是系統(tǒng)級(jí)別的處理,無(wú)法被任何APP封殺,直到不久前的一天,它在微信下跪了。根據(jù)某大神的分析,蘋果還是給「通用鏈接」留下了“后門”可以讓其失效。

而在Android系統(tǒng)下,也有類似的技術(shù),即App Links,從Android M開始支持。但由于國(guó)內(nèi)安卓版本碎片化比較嚴(yán)重,所以應(yīng)用還不怎么廣泛。

小結(jié)

講到這,先小結(jié)一下應(yīng)用跳轉(zhuǎn)的實(shí)現(xiàn)方案。

Android:

  • 微信、QQ:「URL Scheme」不可用,可通過「應(yīng)用寶」中轉(zhuǎn)。
  • 瀏覽器:「URL Scheme」可用。
  • 其他APP:提示用瀏覽器打開。

iOS>=9(支持「Universal Links」):

  • 微信:「URL Scheme」和「Universal Links」均不可用,通過「應(yīng)用寶」中轉(zhuǎn)。
  • QQ:「Universal Links」尚且可用。
  • QQ瀏覽器:「Universal Links」不可用,但「URL Scheme」可用。
  • 其他APP:「Universal Links」可用。

iOS<9(不支持「Universal Links」):

  • 微信、QQ:「URL Scheme」不可用,提示用瀏覽器打開。
  • 各瀏覽器:「URL Scheme」可用。
  • 其他APP:提示用瀏覽器打開。

要注意的是,所謂的「其他APP」是無(wú)法準(zhǔn)確檢測(cè)的,只能根據(jù)APP在User Agent中增加的特殊關(guān)鍵字(例如新浪微博的「Weibo」)逐個(gè)判斷。

打開APP的指定頁(yè)

需求是無(wú)止境的,能從網(wǎng)頁(yè)進(jìn)入APP只是開始,下一步就是跳轉(zhuǎn)到指定頁(yè)面。這里所說(shuō)的指定頁(yè)面,可能是原生的頁(yè)面,也可能是某個(gè)網(wǎng)頁(yè)。這個(gè)過程的關(guān)鍵在于打開APP時(shí)如何把頁(yè)面路徑傳過去。

先從「URL Scheme」說(shuō)起。我們可以給「URL Scheme」加上路徑和參數(shù),例如:

my-app://open?url=https%3A%2F%2Fcn.bing.com%2F

APP端只要解析參數(shù),繼而打開對(duì)應(yīng)的頁(yè)面即可。對(duì)于「Universal Links」來(lái)說(shuō),也是同理:

https://my-app.com/download?url=https%3A%2F%2Fcn.bing.com%2F

正如上文所說(shuō),「URL Scheme」和「Universal Links」都被微信封殺了。如果通過「應(yīng)用寶」中轉(zhuǎn),上述url參數(shù)是無(wú)法傳到APP的。在這種情況下,就得尋找一個(gè)微信WebView和APP都可以共同讀寫的空間來(lái)傳遞數(shù)據(jù),例如剪貼板。下面這個(gè)JS函數(shù)可以實(shí)現(xiàn)對(duì)剪貼板的寫入:

function copyToClipboard(content) {
var textarea = document.createElement('textarea');
textarea.style.position = 'absolute';
textarea.style.left = '-1000px';
textarea.style.top = '-1000px';
textarea.value = content;
textarea.readOnly = true;
document.body.appendChild(textarea);

textarea.select();
textarea.setSelectionRange(0, textarea.value.length);

var result = false;
try {
result = document.execCommand('copy');
} catch (e) {

}

document.body.removeChild(textarea);
textarea = null;

return result;
}

跳轉(zhuǎn)到APP的應(yīng)用寶地址之前,把要打開的頁(yè)面地址以約定好的格式寫入剪貼板:

copyToClipboard('my-app:open?url=https%3A%2F%2Fcn.bing.com%2F');
location.href = 'my-app的應(yīng)用寶地址';

通過「應(yīng)用寶」打開APP后,APP端按照約定格式解析剪貼板內(nèi)容打開對(duì)應(yīng)的頁(yè)面即可。

這里有一個(gè)細(xì)節(jié):為什么不直接以完整的「my-app://open?url=」寫入剪貼板,而要特意去掉「//」?這是因?yàn)樵贏ndroid系統(tǒng)下,某些瀏覽器APP會(huì)把剪貼板中的「URL Scheme」識(shí)別為網(wǎng)址,然后提示用戶是否打開。對(duì)于用戶來(lái)說(shuō),點(diǎn)擊「打開APP」出現(xiàn)這個(gè)提示,就有點(diǎn)莫名其妙了。

當(dāng)然,「剪貼板方案」也存在一些問題:

  • 會(huì)覆蓋用戶的剪貼板內(nèi)容。
  • 部分Android系統(tǒng)的原生瀏覽器不支持通過JS訪問剪貼板,不過這不是問題,因?yàn)樵跒g覽器中大可以用「URL Scheme」。

如果不想用「剪貼板方案」,還是可以提示用戶用瀏覽器打開頁(yè)面的。具體如何取舍,就看各自產(chǎn)品經(jīng)理的決定了。


本文標(biāo)題:網(wǎng)頁(yè)端「應(yīng)用跳轉(zhuǎn)」技術(shù)實(shí)現(xiàn)演變
標(biāo)題路徑:http://www.5511xx.com/article/ccddjis.html