Clientseitiges JavaScript

Beispiel eines Dialogfelds, in dem der Abonnent aufgefordert wird, sein Abo zu verlinken

Bei Verwendung der Aboverknüpfung ist clientseitiges JavaScript die einzige Möglichkeit, eine neue Verknüpfung zwischen einer PPID und dem Google-Konto eines Lesers herzustellen. Auf einer konfigurierten Seite wird der Leser über ein Dialogfeld aufgefordert, sein Abo zu verknüpfen. Wenn der Leser auf die Schaltfläche „Weiter mit Google“ klickt, kann er ein zu verknüpfendes Konto auswählen und wird nach Abschluss des Vorgangs zur konfigurierten Seite zurückgeleitet.

Die Verknüpfung der PPID mit dem Konto des Lesers erfolgt über die linkSubscription-Methode in swg.js. Die Verwendung ähnelt der vorherigen Kontoverknüpfungsfunktion (Beispiel). Statt ein Promise zu übergeben, akzeptiert die Methode jedoch ein Objekt, das die PPID enthält.

Codebeispiele

Diese clientseitigen Codebeispiele veranschaulichen, wie eine Verknüpfung initiiert wird, wie eine gültige Antwort aussieht und (optional) wie du den swg.js-eventManager verwendest, um Analyseereignisse zu erfassen und entsprechend weiterzuleiten.

Dialogfeld „Aboverknüpfung initiieren“

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

Beispielantwort

Gültige Antworten von einem erfolgreich verknüpften Konto enthalten die bei der Verknüpfung verwendete PPID und einen booleschen success-Status.

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

Die Aboverknüpfung erfordert keine Drittanbieter-Cookies oder eine aktive Google-Sitzung des Lesers. Dadurch kannst du die Verknüpfung jederzeit flexibel vornehmen, nicht nur nach dem Kauf. Wenn ein Leser nicht in einem Google-Konto angemeldet ist, kann er dies während des Ablaufs nachholen.

Vollständiges clientseitiges Beispiel

<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-Client-ID generieren

Ein OAuth-Client ist für die Aboverknüpfung nicht erforderlich. Er kann jedoch verwendet werden, um die Zulassungsliste mit autorisierten Domains für dein Projekt zu erstellen. Autorisierte Domains sind eine Liste von Domains, über die dein clientseitiges JavaScript Aufrufe ausführen darf. Deine Publikation hat wahrscheinlich schon eine OAuth-Client-ID, die im Publisher Center für die Verwendung mit swg.js konfiguriert wurde.

Tests

Um die clientseitige Implementierung der Aboverknüpfung zu testen, muss der Code auf einem Server mit einer autorisierten JavaScript-Quelle ausgeführt werden.

  1. In Produktionsumgebungen können autorisierte Quellen vom konfigurierten OAuth-Client oder aus der Liste der bestätigten Domains in den Publikationseinstellungen im Publisher Center stammen.
  2. In Entwicklungs- oder Staging-Umgebungen mit einer Domain, die nicht bestätigt werden kann (z. B. einem lokalen Host oder einem nicht öffentlichen Server), muss die Domain im konfigurierten OAuth-Client aufgelistet werden.

Fehler beheben

Das häufigste Problem beim Testen von clientseitigem JavaScript ist der Fehler 403 - Not Authorized, der beim Ausführen des Codes ausgegeben wird. Um dieses Problem zu lösen, solltest du dein JavaScript über eine im Publisher Center bestätigte Domain oder auf einem Host ausführen, der zu den autorisierten JS-Quellen des verknüpften OAuth-Clients gehört.