JavaScript בצד הלקוח

דוגמה לתיבת דו-שיח שמבקשת מהמנוי לקשר את המינוי שלו

באמצעות קישור מינויים, JavaScript בצד הלקוח הוא הדרך היחידה ליצור שיוך חדש בין PPID לחשבון Google של הקורא. בדף שהוגדר, לקורא מוצגת תיבת דו-שיח שבה הוא מתבקש לקשר את המינוי. אחרי שהקוראים לוחצים על הלחצן Continue with Google, הם יכולים לבחור חשבון לקישור, ולחזור לדף שהוגדר בסיום התהליך.

כדי לשייך את ה-PPID לחשבון של הקורא, השיטה linkSubscription משמשת ב-swg.js. השימוש דומה לתכונה הקודמת של קישור לחשבון (דוגמה), אבל במקום להעביר אובייקט לצורך כך, השיטה מקבלת אובייקט שמכיל את PPID.

דוגמאות לקוד

הדוגמאות האלה לקוד בצד הלקוח ממחישות איך להפעיל קישור, איך נראית תגובה תקינה, ואיך להשתמש ב-eventManager swg.js כדי להאזין לאירועים לניתוח נתונים ולנתב אותם בהתאם.

הפעלת תיבת הדו-שיח 'קישור מינויים'

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

דוגמה לתשובה

תשובות חוקיות מחשבון שקושר בהצלחה מכילות סטטוס success בוליאני וגם את הערך PPID שנמצא בשימוש בקישור.

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 של אתר החדשות שלך ב-Publisher Center לשימוש עם swg.js.

בדיקה

כדי לבדוק את ההטמעה בצד הלקוח של Subscription Linking, יש להריץ את הקוד משרת עם מקור JavaScript מורשה.

  1. לשימוש בסביבת ייצור, מקורות מורשים יכולים להגיע מחשבון לקוח OAuth שהוגדר או מרשימת הדומיינים המאומתים בהגדרות אתר החדשות ב-Publisher Center.
  2. לצורך שימוש בפיתוח או בסביבת Staging, עם דומיין שלא ניתן לאימות (למשל localhost או שרת שאינו ציבורי), הדומיין חייב להיות רשום בלקוח OAuth שהוגדר.

פתרון בעיות במקרה של שגיאות

הבעיה הנפוצה ביותר בבדיקת JavaScript בצד הלקוח מתקבלת עם שגיאת 403 - Not Authorized במהלך הניסיון להריץ את JavaScript. כדי לפתור את הבעיה, עליכם לוודא שאתם מריצים את ה-JavaScript מדומיין מאומת ב-Publisher Center, או להפעיל את הקוד במארח שנמצא במקורות ה-js המורשים של לקוח OAuth המקושר.