关联用户账号(客户端 JavaScript)

要求订阅者关联其订阅的对话框示例

借助订阅关联功能,您只能通过客户端 JavaScript 在 PPID 与读者的 Google 账号之间建立新的关联。在配置的页面上,系统会向读者显示一个对话框,要求他们关联自己的订阅。读者点击“使用 Google 账号继续”按钮后,可以选择要关联的账号,并在关联完成后返回到配置的页面。

订阅关联功能不需要使用第三方 Cookie,也不要求读者登录 Google 账号。这样,读者就可以在体验过程中的任何时间(而不仅仅是在购买后)灵活地启动关联体验。如果读者未登录 Google 账号,系统会在流程中提供登录机会。

代码示例

这些客户端代码示例说明了如何发起关联、有效响应是什么样的,以及(可选)如何使用 swg.js eventManager 监听分析事件并相应地路由这些事件。

如需将 PPID 与读者的账号关联到单个发布内容,请使用 swg.js 中的 linkSubscription 方法。 此方法的使用方式与之前的账号关联 功能(示例)类似, 但此方法接受包含 PPID 的对象,而不是传递 Promise。

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 可以从中发出调用的网域列表。您的出版物可能已在 Publisher Center 中配置了 OAuth 客户端 ID,以供 swg.js 使用。

测试

如需测试订阅关联功能的客户端实现,必须从具有授权 JavaScript 来源的服务器运行代码。

  1. 对于生产用途,授权来源可以来自配置的 OAuth 客户端,也可以来自 Publisher Center 内发布内容设置中的已验证网域列表。
  2. 对于开发或预演用途,如果使用无法验证的网域(例如 localhost 或非公开服务器),则必须在配置的 OAuth 客户端中列出该网域。

排查错误

测试客户端 JavaScript 时最常见的问题是,在尝试运行 JavaScript 时收到 403 - Not Authorized 错误。如需解决此问题,请确保您是从 Publisher Center 内经过验证的网域运行 JavaScript,或者您是在关联的 OAuth 客户端的授权 JavaScript 来源中的主机上运行代码。

下一步

恭喜您完成客户端 JavaScript 集成。现在 您可以继续进行服务器端集成。 这是同步读者使用权所必需的步骤。当您实现并使用所需的服务器端 UpdateReaderEntitlements 函数时,可以确保为合适的订阅者突出显示合适的文章。