Android Note：App Links

發表於 更新於 分類於 ， 閱讀次數： Disqus： 文章字數： 927 所需閱讀時間 ≈ 3 分鐘

特殊的 Deep Links 可讓網站網址開啟 Android App 中的對應內容，照著官方文檔跟工具實踐通常不會有什麼問題，但在公司開發常常會發生莫名插曲。

建置流程

  1. 依照 官方文檔 使用 Android Studio 的 App Links Assistant 設定 Digital Asset Links 並取得 assetlinks.json 檔案
  2. 後端或網頁端需要將 assetlinks.json 檔案置於網頁根目錄的 /.well-known/assetlinks.json 路徑，並且能透過網址 https://www.example.com/.well-known/assetlinks.json 獲取 assetlinks.json 檔案內容

[注意事項]
問題通常發生在 assetlinks.json 檔案的部署，因為後端或網頁端常常會有一些理由想要方便一下，然而 Android 這邊要求的比較嚴格（跟 iOS 類似功能的設定比較），強烈建議後端或網頁端把官方文檔仔細看，畢竟部署這件事通常不是 App 端負責處理，這裡列出幾個踩過的雷：

  1. 不能透過重新導向來獲取 assetlinks.json 檔案，這可能會發生在後端或網頁端想取巧時
  2. 不能設置需要透過 VPN 才到得了的網站 domain，這很麻煩，因為很多公司的網頁測試版都只能用內網連，如果其實可以做到的話拜託告訴我🙏🏼
  3. server response 必須為 HTTP 200 否則都視為錯誤，這則是沒注意就會錯
  4. assetlinks.json 檔案必須在 HTTP headers 設定為 Content-Type: application/json，這也是沒注意就會錯

常規測試方式

網頁工具

Statement List Generator and Tester

1
https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://domain.name:optional_port&relation=delegate_permission/common.handle_all_urls

將 domain.name:optional_port 換成自己網站的 domain

於 Android 專案中使用指令

1
adb shell am start -a android.intent.action.VIEW -c android.intent.category.BROWSABLE -d "https://www.example.com"

將其中網址 https://www.example.com 換成正確的
若建置成功，系統會發出正確 intent 叫起 app，失敗則會開啟瀏覽器前往該網頁

本地測試

若後端或網頁端沒辦法將 assetlinks.json 檔案放到正確的網頁位置時，或是使用非公開網域進行測試時可以透過建立本地環境來模擬，並使用測試指令來進行驗證

裝置設定中手動設定 App 開啟連結

進入裝置的 設定 > 應用程式 > YOUR_APP > 應用程式資訊 > 進階 > 預設為開啟 > 開啟連結 設定，前提是該連結需要先在 App 的 AndroidManifest.xml 中加入
設定完後就能使用測試指令測試該連結

在本地建立網站 server 並透過第三方服務（ngrok）將本地網站臨時暴露給外部連線測試

建立本地網站 server（以 Node.js Express 框架為例）

  1. 開啟新的專案資料夾並進入
  2. 若沒裝過 express，使用指令安裝：npm install express
  3. 建立一個 server.js 文件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
const express = require('express');
const app = express();
const port = 3000;

// 基本的 Hello World 路由
app.get('/', (req, res) => {
  res.send('Hello World!');
});

// 處理 .well-known/assetlinks.json 的請求
app.get('/.well-known/assetlinks.json', (req, res) => {
  res.json(
    // 填入 assetlinks.json 內容
    [{
        "relation": ["delegate_permission/common.handle_all_urls"],
        "target": {
          "namespace": "android_app",
          "package_name": "YOUR_PACKAGE_NAME",
          "sha256_cert_fingerprints":
          ["YOUR_SHA256_CERT_FINGERPRINTS"]
        }
      }]
  );
});

// 啟動伺服器
app.listen(port, () => {
  console.log(`Server running at http://localhost:${port}`);
});
  1. 啟動 server：node server.js
  2. 使用瀏覽器前往 http://localhost:3000/.well-known/assetlinks.json 檢查是否有看到 assetlinks.json 檔案內容

使用 ngrok 將本地網站臨時暴露給外部

  1. ngrok 官網 註冊 ngrok 帳號，隨後取得 token
  2. 安裝 ngrok：brew install ngrok/ngrok/ngrok
  3. 加入 token：ngrok config add-authtoken YOUR_TOKEN
  4. 啟動 ngrok 服務，因為前述本地 server 的 port 設為 3000，所以者裡也要填 3000：ngrok http 3000
  5. 由 Forwarding 取得這次的臨時公開網址（每次啟動都會換）
  6. 將這網址拿去設定 Digital Asset Link API 就能照正常流程進行 app link 測試