Cómo vincular cuentas de usuario (JavaScript del cliente)

Ejemplo del diálogo que le solicita al suscriptor que vincule su suscripción

Con la Vinculación de suscripciones, el código JavaScript del cliente es la única forma de crear una nueva asociación entre un PPID y la Cuenta de Google de un lector. En una página configurada, se le presenta un diálogo al lector en el que se le pide que vincule su suscripción. Luego de que el lector hace clic en el botón "Continuar con Google", puede elegir una cuenta para vincular y, una vez que completa el proceso, regresa a la página configurada.

La asociación del PPID con la cuenta del lector se realiza a través del método linkSubscription en swg.js. El uso es similar a la función anterior de Vinculación de suscripciones (ejemplo), pero, en lugar de pasar una promesa, el método acepta un objeto que contiene el PPID.

Ejemplos de código

Estos ejemplos de código del cliente muestran cómo iniciar un vínculo, cómo se ve una respuesta válida y (opcionalmente) cómo usar el eventManager de swg.js para escuchar los eventos de estadísticas y enrutarlos según corresponda.

Cómo iniciar el diálogo de la Vinculación de suscripciones

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

Respuesta de muestra

Las respuestas válidas de una cuenta vinculada contienen el PPID utilizado en el vínculo y el estado success booleano.

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

La Vinculación de suscripciones no requiere el uso de cookies de terceros o de una sesión de Google activa para el lector. Esta flexibilidad permite iniciar la experiencia de vinculación en cualquier momento de la experiencia del lector, y no solo después de una compra. Si un lector no accedió con una Cuenta de Google, se le ofrece hacerlo como parte del flujo.

Ejemplo del cliente completo

<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>

Crea un ID de cliente de OAuth

Si bien un cliente de OAuth no es necesario para la Vinculación de suscripciones, se lo puede usar para crear la lista de entidades permitidas de dominios autorizados para tu proyecto. Los dominios autorizados son una lista de dominios desde los que tu código JavaScript del cliente puede realizar llamadas. Es probable que tu publicación ya tenga configurado un ID de cliente de OAuth en el Publisher Center para usarlo con swg.js.

Pruebas

Para probar la implementación de la Vinculación de suscripciones del cliente, el código debe ejecutarse desde un servidor con un origen de JavaScript autorizado.

  1. Para la producción, los orígenes autorizados pueden provenir de un cliente de OAuth configurado o de una lista de dominios verificados en la configuración de la publicación dentro del Centro para editores.
  2. Para el desarrollo o la etapa de pruebas, con un dominio sin verificar (p. ej., localhost o un servidor que no sea público), el dominio debe estar incluido en el cliente de OAuth configurado.

Solucionar errores

El problema más común al momento de probar el código JavaScript del cliente es recibir el error 403 - Not Authorized al intentar ejecutarlo. Para resolver eso, asegúrate de estar ejecutando el código JavaScript desde un dominio validado en Publisher Center, o bien de estar ejecutando el código en un host que esté en los orígenes js autorizados del cliente de OAuth vinculado.

Paso siguiente

Felicitaciones por completar la integración de JavaScript del cliente. Ahora puedes continuar con la integración del servidor. Este paso es obligatorio para sincronizar los derechos de tus lectores. Cuando implementes y uses la función UpdateReaderEntitlements obligatoria del servidor, asegúrate de que estén destacados los artículos correctos para los suscriptores correspondientes.