Клиентский JavaScript

An example of the dialog asking the subscriber to link their subscription

При связывании подписки JavaScript на стороне клиента — единственный способ создать новую связь между PPID и учетной записью Google читателя. На настроенной странице читателю открывается диалоговое окно с просьбой связать свою подписку. После того, как читатель нажмет кнопку «Продолжить с Google», он сможет выбрать учетную запись для связи и вернуться на настроенную страницу после завершения.

Связывание PPID с учетной записью читателя осуществляется с помощью метода linkSubscription в swg.js Использование аналогично предыдущей функции связывания учетных записей ( пример ), но вместо передачи обещания метод принимает объект, содержащий PPID.

Примеры кода

Эти примеры кода на стороне клиента показывают, как инициировать ссылку, как выглядит действительный ответ и (необязательно) как использовать диспетчер событий swg.js для прослушивания событий аналитики и их соответствующей маршрутизации.

Откройте диалоговое окно привязки подписки.

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

Пример ответа

Действительные ответы от успешно связанной учетной записи содержат как PPID , используемый в ссылке, так и логический статус success .

console.log(result) //{publisherProvidedId: 6789, success: true}

Привязка подписки не требует использования сторонних файлов cookie или активного сеанса Google для читателя. Это позволяет гибко использовать ссылку в любой момент взаимодействия читателя, а не только после покупки. Если читатель не вошел в учетную запись Google, ему предоставляется возможность сделать это в рамках потока.

Полный пример клиентской стороны

<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

Хотя клиент OAuth не требуется для связывания подписки, клиент OAuth можно использовать для создания белого списка авторизованных доменов для вашего проекта. Авторизованные домены — это список доменов, из которых вашему клиентскому JavaScript разрешено совершать вызовы. Вероятно, для вашей публикации уже настроен идентификатор клиента OAuth в Центре издателей для использования с swg.js .

Тестирование

Чтобы протестировать реализацию привязки подписки на стороне клиента, код необходимо запустить с сервера с авторизованным источником JavaScript.

  1. Для производственного использования авторизованные источники могут поступать либо из настроенного клиента OAuth, либо из списка проверенных доменов в настройках публикации в Центре издателей.
  2. Для разработки или промежуточного использования с непроверяемым доменом (например, localhost или частным сервером) домен должен быть указан в настроенном клиенте OAuth.

Устранение ошибок

Наиболее распространенной проблемой при тестировании JavaScript на стороне клиента является получение ошибки 403 - Not Authorized при попытке запустить JavaScript. Чтобы решить эту проблему, убедитесь, что вы запускаете JavaScript из проверенного домена в Центре издателей или что вы запускаете код на хосте, который находится в авторизованном источнике js связанного клиента OAuth.