Avec l'association d'abonnement, JavaScript côté client est le seul moyen d'associer un PPID avec le compte Google d'un lecteur. Sur une page configurée, une boîte de dialogue s'affiche invitant le lecteur à associer son abonnement. Lorsque celui-ci clique sur le bouton "Continuer avec Google", il peut choisir le compte à associer, avant d'être renvoyé vers la page configurée.
L'association du PPID au compte du lecteur s'effectue via la méthode linkSubscription de swg.js. L'utilisation est semblable à l'ancienne fonctionnalité d'association de comptes (exemple), si ce n'est qu'au lieu de transmettre une promesse, la méthode accepte un objet contenant le PPID.
Exemples de code
Ces exemples de code côté client montrent comment créer un lien, ce à quoi ressemble une réponse valide et, le cas échéant, comment utiliser l'eventManager swg.js pour écouter les événements d'analyse et les rediriger en conséquence.
Afficher la boîte de dialogue d'association d'abonnement
const result = await subscriptions.linkSubscription({publisherProvidedId:6789})
Exemple de réponse
Les réponses valides d'un compte correctement associé contiennent le PPID utilisé dans le lien ainsi qu'un état success booléen.
console.log(result) //{publisherProvidedId: 6789, success: true}
L'association d'abonnement ne nécessite pas l'utilisation de cookies tiers ni d'une session Google active pour le lecteur. Cette flexibilité permet de déclencher l'association à tout moment dans l'expérience d'un lecteur, et pas seulement après un achat. Si un lecteur n'est connecté à aucun compte Google, il aura la possibilité de le faire lors du processus.
Exemple complet côté client
<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>
Créer un ID client OAuth
Bien qu'aucun client OAuth ne soit requis pour l'association d'abonnement, vous pouvez en utiliser un pour créer la liste des domaines autorisés de votre projet.
Les domaines autorisés sont ceux à partir desquels votre code JavaScript côté client peut passer des appels. Un ID client OAuth est probablement déjà configuré pour votre publication dans Publisher Center. Vous pouvez l'utiliser avec swg.js.
- Si l'appel JavaScript côté client de l'association d'abonnement provient d'un nom de domaine déjà validé, aucune action n'est requise.
- S'il s'exécute depuis à partir d'un nouveau nom de domaine, suivez les instructions de configuration de l'ID client OAuth S'abonner avec Google.
Tests
Pour tester l'implémentation côté client de l'association d'abonnement, le code doit s'exécuter sur un serveur avec une origine JavaScript autorisée.
- Dans le cas d'une utilisation en production, les origines autorisées peuvent provenir du client OAuth configuré ou de la liste de domaines validés dans les paramètres de la publication dans Publisher Center.
- Dans le cas d'une utilisation en développement ou en préproduction, si le domaine n'est pas vérifiable (localhost ou serveur non public, par exemple), il doit figurer dans la liste de domaines validés du client OAuth configuré.
Résoudre les erreurs
Le problème le plus fréquent lors du test du code JavaScript côté client est la réception d'une erreur 403 - Not Authorized lorsque vous tentez d'exécuter ce code. Pour le résoudre, assurez-vous que vous l'exécutez depuis un domaine validé dans Publisher Center ou sur un hôte qui figure dans la liste des origines JavaScript autorisées du client OAuth associé.
Étape suivante
Félicitations ! Vous avez terminé l'intégration JavaScript côté client. Vous pouvez maintenant passer à l'intégration côté serveur.
Cette étape est obligatoire pour synchroniser les droits d'accès de vos lecteurs. En implémentant et utilisant la fonction UpdateReaderEntitlements côté serveur requise, vous vous assurez que les bons articles sont mis en avant pour chaque abonné.