連結使用者帳戶 (用戶端 JavaScript)

注意： 如果您的出版品使用「透過 Google 訂閱」的其他功能，swg.js 用戶端的使用方式會假設出版品已按照「透過 Google 訂閱」開發人員網站所示，設定及初始化資料庫。您可以自行決定是否要使用「透過 Google 訂閱」功能搭配訂閱連結功能。

使用訂閱連結功能時，用戶端 JavaScript 是唯一可在 PPID 和讀者的 Google 帳戶之間建立新關聯的方式。在已設定的頁面上，讀者會看到對話方塊，要求他們連結訂閱項目。讀者按一下「使用 Google 帳戶繼續」按鈕後，可以選擇要連結的帳戶，並在連結完成後返回設定的頁面。

訂閱連結功能不需要使用第三方 Cookie，也不需要讀者有有效的 Google 工作階段。這項功能可讓讀者在購買後隨時啟動連結體驗，提供更彈性的使用體驗。如果讀者未登入 Google 帳戶，系統會在流程中提供登入帳戶的選項。

程式碼範例

這些用戶端程式碼範例說明如何啟動連結、有效回應的樣貌，以及 (選用) 如何使用 swg.js eventManager 監聽及相應轉送數據分析事件。

注意： 如果使用者已連結訂閱項目或最近拒絕連結，請勿提示他們連結訂閱項目。

連結單一出版品

如要將 PPID 與單一出版物的讀者帳戶建立關聯，請使用 swg.js 中的 linkSubscription 方法。使用方式與先前的帳戶連結功能 (示例) 類似，但方法會接受包含 PPID 的物件，而非傳遞承諾。

const result = await subscriptions.linkSubscription({publisherProvidedId:6789})

回應範例 (介面)

已成功連結的帳戶傳回的有效回應，會包含連結中使用的 PPID 和布林值 success 狀態。

{
  publisherProvidedId: 6789,
  success: true
}

將多個出版品打包

您可以將物件做為引數傳遞至 linkSubscriptions 函式，一次為訂閱連結綁定多個刊物。linkTo 屬性是物件陣列，其中每個物件都代表要連結的特定 publicationId 及其對應的 publisherProvidedId (PPID)。

const result = await subscriptions.linkSubscriptions({linkTo: [
  { publicationId: 'pubId1', publisherProvidedId: 'ppid1' },
  { publicationId: 'pubId2', publisherProvidedId: 'ppid2' },
  …
]});

回應範例 (介面)

anyFailure (布林值) 和 anySuccess (布林值) 欄位會指出套裝組合訂閱連結嘗試是否成功或失敗。links 欄位包含每個刊物結果的詳細資料。

已成功連結至所有出版品

{
  "anyFailure": false,
  "anySuccess": true,
  "links": [{
    "publicationId": "CAowqfCKCw",
    "publisherProvidedId": "370720",
    "success": true
  },
  {
    "publicationId": "CAow5rTUCw",
    "publisherProvidedId": "171385",
    "success": true
  }]
}

未連結任何出版品

{
  "anyFailure": true,
  "anySuccess": true,
  "links": [{
    "publicationId": "CAowqfCKCw",
    "publisherProvidedId": "370720",
    "success": false
  },
  {
    "publicationId": "CAow5rTUCw",
    "publisherProvidedId": "171385",
    "success": true
  }]
}

linkSubscription 的完整用戶端範例

<script
  async
  type="application/javascript"
  subscriptions-control="manual"
  src="https://news.google.com/swg/js/v1/swg.js">
</script>

<script>

  function linkSubscription(ppid) {
    self.SWG.push(async (subscriptions) => {
      try {
        const result = await subscriptions.linkSubscription({
          publisherProvidedId: ppid,
        })
        console.log(result)
      } catch(e) {
        console.log(e)
      }
    })
  }

  document.addEventListener('DOMContentLoaded', function () {
    (self.SWG = self.SWG || []).push(subscriptions => {
      subscriptions.init("PUBLICATION_ID");

      //Configure the event manager for analytics integration
      subscriptions.getEventManager().then(manager => {
        manager.registerEventListener((event) => {
            // Add code here to send the event to your analytics
            // sendToAnalytics(event);
          console.log(event);
        });
      });
    });

    document
      .querySelector("SELECTOR")
      .addEventListener('click', function(){
        linkSubscription(PPID)
      })
  });
</script>

建立 OAuth 用戶端 ID

雖然訂閱連結功能不需要 OAuth 用戶端，但您可以使用 OAuth 用戶端為專案建立授權網域的許可清單。授權網域是允許用戶端 JavaScript 發出呼叫的網域清單。您的出版品可能已在新聞發布者中心設定 OAuth 用戶端 ID，以便與 swg.js 搭配使用。

• 如果訂閱連結用戶端 JavaScript 呼叫來自先前驗證過的網域名稱，則無須採取任何行動。
• 如果 JavaScript 是從新網域名稱執行，請按照 SwG OAuth 用戶端 ID 設定操作說明操作。

注意： 只有在啟用「使用 Google 訂閱」後，才可為發布商建立及使用 OAuth 用戶端。

測試

如要測試訂閱連結的用戶端實作項目，您必須透過具有授權 JavaScript 來源的伺服器執行程式碼。

1. 如要用於正式版，授權的來源可以來自已設定的 OAuth 用戶端，或是來自 Publisher Center 內的已驗證網域清單中的網域。
2. 如果是開發或測試環境，且使用無法驗證的網域 (例如 localhost 或非公開伺服器)，則該網域必須列在已設定的 OAuth 用戶端中。

注意：將網域新增至 OAuth 用戶端的允許來源清單，可能需要超過 30 分鐘才能開始使用。

重點：如要持續使用相同的訂閱帳戶進行測試，您可以使用 Google 的「我的帳戶」頁面手動取消連結帳戶。

排解錯誤

測試用戶端 JavaScript 時最常見的問題，就是在嘗試執行 JavaScript 時收到 403 - Not Authorized 錯誤。如要解決這個問題，請確認您是在發布者中心中從已驗證的網域執行 JavaScript，或是在已連結 OAuth 用戶端的授權 js 來源中執行代碼。

下一步

恭喜您完成用戶端 JavaScript 整合作業。您現在可以進行伺服器端整合。這是同步讀者授權的必要步驟。實作並使用必要的伺服器端 UpdateReaderEntitlements 函式，即可確保系統會為適當的訂閱者醒目顯示適當的文章。