Dengan Penautan Langganan, JavaScript sisi klien adalah satu-satunya cara untuk membuat
atribusi baru antara PPID
dan Akun Google pembaca. Di halaman
yang dikonfigurasi, pembaca akan melihat dialog yang meminta mereka untuk menautkan
langganan mereka. Setelah pembaca mengklik tombol "Lanjutkan dengan Google", mereka
dapat memilih akun yang akan ditautkan, dan akan diarahkan kembali ke halaman yang dikonfigurasi
setelah selesai.
Mengaitkan PPID dengan akun pembaca dilakukan menggunakan
metode linkSubscription di swg.js
. Penggunaannya mirip dengan fitur Penautan Akun
sebelumnya (contoh),
tetapi alih-alih meneruskan promise, metode ini menerima objek yang berisi
PPID.
Contoh kode
Contoh kode sisi klien ini mengilustrasikan cara memulai link, tampilan respons yang valid, dan (opsional) cara menggunakan eventManager swg.js
untuk memproses peristiwa analisis dan merutekannya sebagaimana mestinya.
Memulai dialog Penautan Langganan
const result = await subscriptions.linkSubscription({publisherProvidedId:6789})
Contoh respons
Respons yang valid dari akun yang berhasil ditautkan berisi PPID
yang digunakan
dalam penautan, dan status success
boolean.
console.log(result) //{publisherProvidedId: 6789, success: true}
Penautan Langganan tidak memerlukan penggunaan cookie pihak ketiga atau sesi Google aktif untuk pembaca. Hal ini memungkinkan peluncuran ke pengalaman penautan kapan saja dalam pengalaman pembaca, dan bukan hanya setelah pembelian. Jika pembaca tidak login ke Akun Google, mereka akan diberi kesempatan untuk melakukannya sebagai bagian dari alur.
Contoh sisi klien lengkap
<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>
Membuat client ID OAuth
Meskipun klien OAuth tidak diperlukan untuk Penautan Langganan, klien OAuth
dapat digunakan untuk menulis daftar yang diizinkan dari domain yang diberi otorisasi untuk project Anda.
Domain resmi adalah daftar domain tempat javascript sisi klien Anda
diizinkan untuk melakukan panggilan. Publikasi Anda mungkin sudah memiliki Client ID
OAuth yang dikonfigurasi di Pusat Penerbit, untuk digunakan dengan swg.js
.
- Jika panggilan JavaScript sisi klien Penautan Langganan Anda berasal dari nama domain yang sebelumnya divalidasi, Anda tidak perlu melakukan tindakan apa pun.
- Jika JavaScript Anda berjalan dari nama domain baru, ikuti petunjuk konfigurasi Client ID OAuth SwG.
Pengujian
Untuk menguji implementasi sisi klien Penautan Langganan, kode harus dijalankan dari server dengan origin JavaScript resmi.
- Untuk penggunaan produksi, origin yang diotorisasi dapat berasal dari Klien OAuth yang dikonfigurasi, atau dari daftar domain terverifikasi di setelan publikasi dalam Pusat Penerbit.
- Untuk penggunaan pengembangan atau staging, dengan domain yang tidak dapat diverifikasi (misalnya, localhost atau server non-publik), domain harus tercantum di Klien OAuth yang dikonfigurasi.
Mengatasi error
Masalah paling umum saat menguji JavaScript sisi klien adalah menerima error 403 - Not Authorized
saat mencoba menjalankan JavaScript. Untuk mengatasinya, pastikan Anda menjalankan JavaScript dari domain yang divalidasi di
Publisher Center, atau Anda menjalankan kode di host yang berada di
asal js resmi klien OAuth tertaut.
Langkah berikutnya
Selamat, Anda telah menyelesaikan integrasi JavaScript sisi klien. Sekarang,
Anda dapat melanjutkan ke integrasi sisi server.
Langkah ini diperlukan untuk menyinkronkan hak pembaca Anda. Saat menerapkan dan menggunakan fungsi UpdateReaderEntitlements
sisi server yang diperlukan, Anda memastikan bahwa artikel yang tepat ditandai untuk pelanggan yang tepat.