鏈接

介紹

每個(gè)好的網(wǎng)站都以前綴為前綴https://，https這就是所謂的URL方案患整。不安全的網(wǎng)站以URL?為前綴http://拜效，http是URL方案。我們簡(jiǎn)稱為計(jì)劃各谚。

要從一個(gè)網(wǎng)站導(dǎo)航到另一個(gè)網(wǎng)站紧憾，您可以<a>在網(wǎng)絡(luò)上使用錨標(biāo)記（）。您也可以使用window.history和等的JavaScript API?window.location昌渤。

除此之外https赴穗，您可能也熟悉該mailto方式。當(dāng)您打開帶有該mailto方式的鏈接時(shí)膀息，您的操作系統(tǒng)將打開已安裝的郵件應(yīng)用程序般眉。如果您安裝了多個(gè)郵件應(yīng)用程序，那么您的操作系統(tǒng)可能會(huì)提示您選擇一個(gè)履婉。同樣煤篙，有撥打電話和發(fā)送短信的方案。閱讀下面有關(guān)內(nèi)置URL方案的更多信息毁腿。

https并http通過瀏覽器來處理辑奈，但它可以通過使用不同的URL方案鏈接到其他應(yīng)用程序。例如已烤，當(dāng)您從Slack收到“Magic Link”電子郵件時(shí)鸠窗，“Launch Slack”按鈕是一個(gè)帶有href的錨標(biāo)簽，類似于：slack://secret/magic-login/other-secret胯究。與Slack一樣稍计，您可以告訴操作系統(tǒng)您要處理自定義方案。閱讀有關(guān)配置方案的更多信息裕循。當(dāng)Slack應(yīng)用程序打開時(shí)臣嚣，它會(huì)收到用于打開它的URL，然后可以對(duì)通過URL提供的數(shù)據(jù)進(jìn)行操作 - 在這種情況下剥哑，是一個(gè)將用戶登錄到特定服務(wù)器的秘密字符串硅则。這通常被稱為深度鏈接。詳細(xì)了解如何在您的應(yīng)用中處理深層鏈接株婴。

?深層鏈接不是唯一可用的鏈接工具怎虫。常規(guī)HTTPS鏈接通常需要在移動(dòng)設(shè)備上打開您的應(yīng)用程序。例如，如果您要發(fā)送有關(guān)記錄更改的通知電子郵件大审，則不希望在電子郵件中的鏈接中使用自定義URL方案蘸际，因?yàn)檫@樣會(huì)在桌面上斷開鏈接。相反徒扶，您希望使用常規(guī)HTTPS鏈接粮彤，例如https://www.myapp.io/records/123，在移動(dòng)設(shè)備上姜骡，您希望該鏈接打開您的應(yīng)用驾诈。iOS將此概念稱為“通用鏈接”，Android將其稱為“深層鏈接”;?Expo在兩個(gè)平臺(tái)上都支持這些鏈接（有一些配置）溶浴。Expo還支持與Branch的延遲深度鏈接。

從您的應(yīng)用鏈接到其他應(yīng)用

內(nèi)置URL方案

正如介紹中所提到的管引，每個(gè)平臺(tái)上都存在一些核心功能的URL方案士败。以下是非詳盡列表，但涵蓋了最常用的方案褥伴。

mailto打開郵件應(yīng)用程序谅将，例如：?mailto: support@expo.io??

tel打開手機(jī)應(yīng)用，例如：?tel:+123456789??

sms打開短信應(yīng)用重慢，例如：?sms:+123456789??

https?/?http打開網(wǎng)絡(luò)瀏覽器應(yīng)用饥臂，例如：?https://expo.io??

從您的應(yīng)用中打開鏈接

React Native中沒有錨標(biāo)記，所以我們不能寫<a >似踱，而是我們必須使用Linking.openURL隅熙。

import{Linking}from'react-native';

Linking.openURL('https://expo.io');

通常，如果沒有用戶請(qǐng)求核芽，您就不會(huì)打開URL - 這是一個(gè)簡(jiǎn)單Anchor組件的示例囚戚，它會(huì)在按下時(shí)打開URL。

import{Linking,Text}from'react-native';exportdefaultclassAnchorextendsReact.Component{_handlePress=()=>{Linking.openURL(this.props.href);this.props.onPress&&this.props.onPress();};render(){return(<Text{...this.props}onPress={this._handlePress}>{this.props.children}</Text>);}}// <Anchor >Go to Google</Anchor>// <Anchor href="mailto://support@expo.io">Email support</Anchor>

使用Expo.WebBrowser而不是Linking打開Web鏈接

以下示例說明了打開Web鏈接與Expo.WebBrowser.openBrowserAsyncReact Native?之間的區(qū)別Linking.openURL轧简。通常WebBrowser是一個(gè)更好的選擇驰坊，因?yàn)樗悄膽?yīng)用程序中的模式，用戶可以輕松地關(guān)閉它并返回到您的應(yīng)用程序哮独。

打開其他應(yīng)用的鏈接

如果您知道另一個(gè)應(yīng)用程序的自定義方案拳芙，您可以鏈接到它。有些服務(wù)提供深層鏈接的文檔皮璧，例如Lyft深層鏈接文檔描述了如何直接鏈接到特定的拾取位置和目的地：

lyft://ridetype?id=lyft&pickup[latitude]=37.764728&pickup[longitude]=-122.422999&destination[latitude]=37.7763592&destination[longitude]=-122.4242038

用戶可能沒有安裝Lyft應(yīng)用程序舟扎，在這種情況下，您可能想要打開App / Play商店恶导，或讓他們知道他們需要先安裝它浆竭。對(duì)于這些情況，我們建議使用庫react-native-app-link。

在iOS上邦泄，Linking.canOpenURL需要其他配置來查詢其他應(yīng)用的鏈接方案删窒。您可以使用ios.infoPlist密鑰app.json來指定應(yīng)用程序需要查詢的方案列表。例如：

"infoPlist": {"LSApplicationQueriesSchemes": ["lyft"]}

如果未指定此列表顺囊，Linking.canOpenURL則false無論設(shè)備是否安裝了應(yīng)用程序肌索，都可能會(huì)返回。請(qǐng)注意特碳，此配置只能在獨(dú)立應(yīng)用程序中進(jìn)行測(cè)試诚亚，因?yàn)樗枰贓xpo Client中進(jìn)行測(cè)試時(shí)不會(huì)應(yīng)用的本機(jī)更改。

鏈接到您的應(yīng)用

在Expo CLI中

在繼續(xù)之前午乓，值得花點(diǎn)時(shí)間學(xué)習(xí)如何在Expo客戶端中鏈接到您的應(yīng)用程序站宗。Expo客戶端使用該exp://方案，但如果我們exp://之后沒有任何地址鏈接益愈，它將打開應(yīng)用程序到主屏幕梢灭。

在開發(fā)過程中，您的應(yīng)用會(huì)像網(wǎng)址一樣生活exp://wg-qka.community.app.exp.direct:80蒸其。當(dāng)它被部署時(shí)敏释，它將在一個(gè)URL上exp://exp.host/@community/with-webbrowser-redirect。如果您創(chuàng)建一個(gè)包含類似鏈接的網(wǎng)站<a href="exp://expo.io/@community/with-webbrowser-redirect">Open my project</a>摸袁，然后在您的設(shè)備上打開該網(wǎng)站并單擊該鏈接钥顽，它將在Expo客戶端中打開您的應(yīng)用。您也可以使用其他應(yīng)用程序鏈接到它Linking.openURL靠汁。

在一個(gè)獨(dú)立的應(yīng)用程序中

要鏈接到獨(dú)立應(yīng)用蜂大，您需要為應(yīng)用指定方案。您可以app.json通過在scheme密鑰下添加字符串來注冊(cè)您的方案：

{"expo": {"scheme": "myapp"}}

構(gòu)建獨(dú)立應(yīng)用程序并將其安裝到設(shè)備后膀曾，您就可以通過鏈接打開它myapp://县爬。

如果您的應(yīng)用程序被彈出，請(qǐng)注意添谊，與其他部分一樣app.json财喳，scheme在應(yīng)用程序已經(jīng)彈出后更改密鑰將無法獲得所需的效果。如果您想要在彈出的應(yīng)用中更改深層鏈接方案斩狱，請(qǐng)參閱本指南耳高。

Expo.Linking?

為了省去根據(jù)您所處的環(huán)境和硬編碼網(wǎng)址插入一堆條件的麻煩，我們?cè)贚inking模塊的擴(kuò)展中提供了一些輔助方法所踊。當(dāng)您想要提供一個(gè)需要重定向回應(yīng)用程序的網(wǎng)址的服務(wù)時(shí)泌枪，您可以調(diào)用Expo.Linking.makeUrl()它，它將解析為以下內(nèi)容：

在Expo客戶中發(fā)布的應(yīng)用：exp://exp.host/@community/with-webbrowser-redirect

獨(dú)立發(fā)布的應(yīng)用程序：myapp://

發(fā)展：exp://wg-qka.community.app.exp.direct:80

您還可以通過傳遞可選參數(shù)來更改返回的URL?Expo.Linking.makeUrl()秕岛。您的應(yīng)用將使用這些來接收數(shù)據(jù)碌燕，我們將在下一節(jié)中討論這些數(shù)據(jù)误证。

處理鏈接到您的應(yīng)用程序

有兩種方法可以處理打開您的應(yīng)用的網(wǎng)址。

1.如果應(yīng)用程序已經(jīng)打開修壕，應(yīng)用程序?qū)⒈活A(yù)先啟用并觸發(fā)鏈接事件

你可以用這些事件處理Linking.addEventListener('url', callback)愈捅。

2.如果應(yīng)用程序尚未打開，則會(huì)打開該應(yīng)用程序并將URL作為initialURL傳入

您可以使用Linking.getInitialURL- 它返回一個(gè)Promise解析為url的事件（如果有的話）慈鸠。

請(qǐng)參閱以下示例以查看這些示例蓝谨。

通過URL將數(shù)據(jù)傳遞到您的應(yīng)用

要將某些數(shù)據(jù)傳遞到您的應(yīng)用中，您可以將其作為路徑或查詢字符串附加到您的網(wǎng)址上青团。Expo.Linking.makeUrl(path, queryParams)將自動(dòng)為您構(gòu)建一個(gè)工作URL譬巫。你可以像這樣使用它：

letredirectUrl=Expo.Linking.makeUrl('path/into/app',{hello:'world',goodbye:'now'});

這將返回類似于myapp://path/into/app?hello=world&goodbye=now獨(dú)立應(yīng)用程序的東西。

使用深層鏈接打開應(yīng)用程序時(shí)督笆，您可以解析鏈接Expo.Linking.parse()以獲取傳入的路徑和查詢參數(shù)芦昔。

當(dāng)處理用來打開/前景您的應(yīng)用程序的URL，它會(huì)是這個(gè)樣子：

_handleUrl=url=>{this.setState({url});let{path,queryParams}=Expo.Linking.parse(url);alert(`Linked to app with path: ${path} and data: ${JSON.stringify(queryParams)}`);};

如果您打開了類似的URL?myapp://path/into/app?hello=world&goodbye=now娃肿，則會(huì)發(fā)出警報(bào)Linked to app with path: path/into/app and data: {hello: 'world', goodbye: 'now'}烟零。

示例：從WebBrowser鏈接回您的應(yīng)用程序

示例項(xiàng)目examples / with-webbrowser-redirect演示了如何處理WebBrowser查詢字符串中的重定向和從中獲取數(shù)據(jù)。在世博會(huì)上試一試咸作。

示例：使用鏈接進(jìn)行身份驗(yàn)證

鏈接到您的應(yīng)用程序的常見用例是在打開WebBrowser后重定向回應(yīng)用程序。例如宵睦，您可以打開登錄屏幕的Web瀏覽器會(huì)話记罚，當(dāng)用戶成功登錄后，您可以使用該方案將您的網(wǎng)站重定向回您的應(yīng)用程序壳嚎，并將身份驗(yàn)證令牌和其他數(shù)據(jù)附加到URL桐智。

注意：如果嘗試使用Linking.openURL打開Web瀏覽器進(jìn)行身份驗(yàn)證，那么Apple可能會(huì)因?yàn)橛脩趔w驗(yàn)不佳或令人困惑而拒絕您的應(yīng)用烟馅。WebBrowser.openBrowserAsync以模態(tài)打開瀏覽器窗口说庭，看起來感覺很好并且獲得Apple批準(zhǔn)。

要查看使用WebBrowserFacebook進(jìn)行身份驗(yàn)證的完整示例郑趁，請(qǐng)參閱examples / with-facebook-auth刊驴。目前Facebook身份驗(yàn)證要求您部署一個(gè)小型網(wǎng)絡(luò)服務(wù)器以重定向回您的應(yīng)用程序（如示例中所述），因?yàn)镕acebook不允許您重定向到自定義方案寡润，Expo正在制定一個(gè)解決方案捆憎，以使您更容易。在世博會(huì)上試一試梭纹。

WebBrowser可以在expo / auth0-example中找到用于身份驗(yàn)證的另一個(gè)示例躲惰。

通用/深層鏈接（沒有自定義方案）

常規(guī)HTTPS鏈接（沒有自定義URL方案）通常需要在移動(dòng)設(shè)備上直接打開您的應(yīng)用。這允許您發(fā)送通知電子郵件变抽，其中包含在桌面上的Web瀏覽器中按預(yù)期工作的鏈接础拨，同時(shí)在移動(dòng)設(shè)備上打開應(yīng)用程序中的內(nèi)容氮块。iOS將此概念稱為“通用鏈接”，而Android將其稱為“深層鏈接”（但在本節(jié)中诡宗，我們專門討論不使用自定義URL方案的深層鏈接）滔蝉。

iOS上的通用鏈接

要在iOS上實(shí)施通用鏈接，您必須先設(shè)置您擁有自己域名的驗(yàn)證僚焦。這是通過從您的網(wǎng)絡(luò)服務(wù)器提供Apple App Site Association（AASA）文件來完成的锰提。AASA必須由/apple-app-site-association或/.well-known/apple-app-site-association（沒有延期）提供。AASA包含JSON芳悲，用于指定您的Apple應(yīng)用程序ID以及您的域中應(yīng)由移動(dòng)應(yīng)用程序處理的路徑列表立肘。例如，如果您希望https://www.myapp.io/records/123移動(dòng)應(yīng)用程序打開該格式的鏈接名扛，則您的AASA將具有以下內(nèi)容：

{"applinks": {"apps": [],"details": [{"appID": "LKWJEF.io.myapp.example","paths": ["/records/*"]}]}}

這告訴iOS?https://www.myapp.io/records/*應(yīng)該由您的移動(dòng)應(yīng)用程序直接打開任何指向（與記錄ID的通配符匹配）的鏈接谅年。有關(guān)AASA格式的更多詳細(xì)信息，請(qǐng)參閱Apple的文檔肮韧。Branch提供了一個(gè)AASA驗(yàn)證器融蹂，可以幫助您確認(rèn)您的AASA已正確部署并具有有效格式。

請(qǐng)注意弄企，iOS會(huì)在您首次安裝應(yīng)用程序時(shí)以及從App Store安裝更新時(shí)下載您的AASA超燃，但不會(huì)再頻繁刷新。如果您希望更改AASA中的生產(chǎn)應(yīng)用程序路徑拘领，則需要通過App Store發(fā)布完整更新意乓，以便所有用戶的應(yīng)用程序重新獲取AASA并識(shí)別新路徑。

部署AASA后约素，您還必須配置應(yīng)用以使用關(guān)聯(lián)的域届良。首先，您需要將associatedDomains?配置添加到您的app.json圣猎。其次士葫，您需要在Apple開發(fā)人員門戶上編輯您的App ID并啟用“Associated Domains”應(yīng)用程序服務(wù)。將服務(wù)添加到App ID后送悔，您還需要重新生成配置文件慢显。

此時(shí)，打開移動(dòng)設(shè)備上的鏈接現(xiàn)在應(yīng)該打開您的應(yīng)用程序欠啤！如果沒有鳍怨，請(qǐng)重新檢查前面的步驟以確保您的AASA有效，路徑在AASA中指定跪妥，并且您已在Apple開發(fā)人員門戶中正確配置了您的App ID鞋喇。一旦您的應(yīng)用程序打開，請(qǐng)轉(zhuǎn)到處理鏈接到您的應(yīng)用程序部分眉撵，以獲取有關(guān)如何處理入站鏈接的詳細(xì)信息侦香，并向用戶顯示他們請(qǐng)求的內(nèi)容落塑。

Android上的深層鏈接

在Android上實(shí)現(xiàn)深層鏈接（沒有自定義URL方案）比在iOS上更簡(jiǎn)單。您只需添加intentFilters到Android的部分你的app.json罐韩。以下基本配置將使您的應(yīng)用程序在標(biāo)準(zhǔn)Android對(duì)話框中顯示為處理任何記錄鏈接的選項(xiàng)myapp.io：

"intentFilters": [{"action": "VIEW","data": [{"scheme": "https","host": "*.myapp.io""pathPrefix": "/records"},],"category": ["BROWSABLE","DEFAULT"]}]

您的域的鏈接可能需要始終打開您的應(yīng)用程序（不向用戶顯示可以選擇瀏覽器或其他處理程序的對(duì)話框）憾赁。您可以使用Android應(yīng)用鏈接實(shí)現(xiàn)此功能，Android應(yīng)用鏈接使用與iOS上的Universal Links類似的驗(yàn)證流程散吵。首先龙考，您必須在/.well-known/assetlinks.json指定應(yīng)用ID時(shí)發(fā)布JSON文件，以及應(yīng)由您的應(yīng)用打開哪些鏈接矾睦。有關(guān)格式化此文件的詳細(xì)信息晦款，請(qǐng)參閱Android的文檔。第二枚冗，添加"autoVerify": true到你的意圖過濾器app.json;?這告訴Android檢查您assetlinks.json的服務(wù)器并將您的應(yīng)用程序注冊(cè)為指定路徑的自動(dòng)處理程序：

"intentFilters": [{"action": "VIEW","autoVerify": true,"data": [{"scheme": "https","host": "*.myapp.io""pathPrefix": "/records"},],"category": ["BROWSABLE","DEFAULT"]}]

何時(shí)不使用深層鏈接

這是設(shè)置深入鏈接到您的應(yīng)用的最簡(jiǎn)單方法缓溅，因?yàn)樗枰钌倭康呐渲谩?/p>

主要問題是，如果用戶沒有安裝您的應(yīng)用程序并且使用其自定義方案跟隨指向您應(yīng)用程序的鏈接赁温，則他們的操作系統(tǒng)將指示該頁面無法打開但不提供更多信息坛怪。這不是一次很棒的經(jīng)歷。無法在瀏覽器中解決此問題股囊。

此外袜匿，許多消息傳遞應(yīng)用程序不會(huì)使用自定義方案自動(dòng)鏈接URL - 例如，exp://exp.host/@community/native-component-list可能只是在瀏覽器中顯示為純文本而不是鏈接（exp：//exp.host/@community/native-component-list） 稚疹。

一個(gè)例子是Gmail從大多數(shù)應(yīng)用程序的鏈接中刪除href屬性沉帮，使用的技巧是鏈接到常規(guī)https url而不是應(yīng)用程序的自定義方案，這將打開用戶的Web瀏覽器贫堰。瀏覽器通常不會(huì)剝離href屬性，因此您可以在線托管文件待牵，將用戶重定向到應(yīng)用程序的自定義方案其屏。

因此，您可以鏈接到https://example.com/redirect-to-app.html而不是鏈接到example：// path / into / app缨该，并且redirect-to-app.html將包含以下代碼：

<script>window.location.replace("example://path/into/app");</script>