זהה משתמשים מחוברים ב-Notiondesk מסנג'ר

Notiondesk מסנג'ר יכול לזהות משתמשים המחוברים לאפליקציה שלך.

הזיהוי משתמש באסימון משתמש קצר מועד שנוצר על ידי השרת האחורי שלך. השרת הקדמי שלך מעביר אסימון זה ל-Notiondesk Messenger SDK כאשר Messenger מאותחל.

זה מונע חשיפת פרטי אימות רגישים בקוד הדפדפן.

לפני שאתם מתחילים

אתה צריך:

• Notiondesk מסנג'ר מותקן עם חבילת @notiondesk-so/messenger-js-sdk

• אימות כבר מיושם ביישום שלך

• קצה אחורי שיכול לייצר אסימון משתמש Notiondesk

• סוד האפליקציה שלך Notiondesk

לעולם אל תחשוף את סוד האפליקציה Notiondesk שלך ב-JavaScript ממשק קדמי, רכיבי React, משתני סביבה שנשלחים לדפדפן או מאגרים ציבוריים.

כיצד פועל זיהוי המשתמש

זרימת האימות היא:

1. משתמש נכנס לאפליקציה שלך

2. הקצה הקדמי שלך מבקש אסימון משתמש Notiondesk מהקצה הקדמי שלך

3. הקצה האחורי שלך חותם על אסימון קצר מועד עבור אותו משתמש מאומת

4. ה-backend שלך מחזיר את האסימון החתום לדפדפן

5. האתר או האפליקציה שלך מעבירים את האסימון ל-Notiondesk מסנג'ר

6. המסנג'ר מזהה את המבקר כמשתמש המתאים

השרת האחורי שלך אמור לקבוע את זהות המשתמש על סשן האפליקציה המאומת שלך. אל תסמוך על מזהה משתמש שסופק ישירות על ידי הדפדפן.

שלב 1: צור סוד אפליקציה

עבור אל הגדרות ← גישה ב-Notiondesk וצור סוד אפליקציה.

אחסן את הסוד במשתנה סביבה בצד השרת, לדוגמה:

NOTIONDESK_APP_SECRET

סוד האפליקציה מוצג פעם אחת בלבד בעת יצירתו. יש להעתיק אותו ולאחסן אותו בצורה מאובטחת לאחר הופעתו.

ניתן לנהל ולסובב את סודות האפליקציה שלך דרך הגדרות ← גישה .

לעולם אל תוסיף את סוד האפליקציה ל:

• ג'אווה סקריפט ממשק קצה

• רכיבי לקוח React או Vue

• משתני סביבה ציבוריים

• חבילות דפדפן

• מאגרים ציבוריים

שלב 2: חתימה על אסימון משתמש בשרת האחורי שלך

צור את אסימון המשתמש מה-backend שלך לאחר שהאפליקציה שלך אימתה את המשתמש הנוכחי.

אסימוני משתמש Notiondesk משתמשים ב-HS256 וחייבים להכיל את התביעות הבאות:

השתמש ב-user_id כמזהה המשתמש. אין להשתמש ב-sub במקום ב-user_id.

ניתן גם לספק מידע על המשתמש כגון:

• email

• name

שמרו על אסימונים קצרי מועד וצרו אותם רק בשרת שלכם.

Notiondesk מספק דוגמאות חתימה ספציפיות לשפה בהגדרת Messenger שלך עבור שפות כגון Node.js, Python, PHP ו-Ruby. השתמש בדוגמה המופיעה בלוח המחוונים של Notiondesk במקום לחתום על טוקנים בקוד הדפדפן.

שלב 3: העבר את האסימון למסנג'ר

לאחר שהשרת האחורי שלך יצר את הטוקן, העבירו אותו להתקנת המסנג'ר שלך.

התקנת אתר אינטרנט סטנדרטית

אם התקנת את Messenger באמצעות הסקריפט הסטנדרטי, ספק את האסימון החתום עם data-user-token:

לְהַחלִיף:

<script
  async
  src="https://static.notiondesk.help/messenger/widget.js"
  data-messenger-id="YOUR_MESSENGER_ID"
  data-user-token="YOUR_SIGNED_TOKEN">
</script>

• YOUR_MESSENGER_ID עם מזהה המסנג'ר שלך

• YOUR_SIGNED_TOKEN עם הטוקן שנוצר על ידי השרת האחורי שלך עבור המשתמש הנוכחי

אין לקודד אסימון של משתמש בתבנית אתר סטטית. יש ליצור את האסימון עבור המשתמש המאומת הנוכחי.

ערכת פיתוח תוכנה של JavaScript / TypeScript

אחזר את האסימון החתום מהשרת האחורי שלך והעבר אותו ל-initNotiondesk:

נקודת הקצה /api/notiondesk-token היא דוגמה. השתמש בנתיב ה-backend שמתאים ליישום שלך.

React ו-Next.js

העבר את האסימון החתום אל NotiondeskProvider:

ניתן לאחזר את הטוקן מהשרת האחורי שלך לאחר שהמשתמש ביצע אימות.

אסור שסוד האפליקציה Notiondesk יהיה זמין לעולם לרכיב הלקוח.

שלב 4: אימות האסימון

לפני העלייה לאוויר, השתמש בכלי אימות האסימונים הזמין בהגדרת Notiondesk Messenger שלך.

הדבק אסימון שהשרת האחורי שלך יצר זה עתה.

Notiondesk בודק את האסימון מול סודות האפליקציה הפעילים שלך ומציג את פרטי המשתמש ש-Messenger יכול לקרוא ממנו.

האסימון המשמש לאימות נבדק אך לא מאוחסן.

אימות שימושי לגילוי:

import { initNotiondesk } from "@notiondesk-so/messenger-js-sdk";

const userToken = await fetch("/api/notiondesk-token").then((response) =>
  response.ok ? response.text() : null,
);

const notiondesk = await initNotiondesk({
  messengerId: "YOUR_MESSENGER_ID",
  userToken,
});

<NotiondeskProvider
  messengerId="YOUR_MESSENGER_ID"
  userToken={userToken}
>
  {children}
</NotiondeskProvider>

• טענות נדרשות חסרות

• user_id שגוי

• site_uuid שגוי

• אסימונים שפג תוקפם

• אסימונים חתומים עם סוד שגוי

• חתימות לא חוקיות

רענון אסימון משתמש

אסימוני משתמש צריכים להיות קצרי מועד.

אם האפליקציה שלך מקבלת אסימון רענן בזמן ש-Messenger כבר אותחל, עדכן את תצורת Messenger:

אינך צריך ליצור מופע נוסף של Messenger רק כדי לעדכן את אסימון המשתמש.

טיפול ביציאה

נקה את המשתמש המזוהה כאשר מישהו מתנתק מהאפליקציה שלך.

ניתן להסיר את הטוקן הנוכחי:

או להשמיד את מופע המסנג'ר לחלוטין:

ודא שזהות המשתמש הקודם נוקתה לפני שמשתמש אחר מתחיל סשן באותו דפדפן.

טען את Messenger רק עבור משתמשים מאומתים

זיהוי משתמש והחלטה האם מסנג'ר צריך להיות זמין הן דאגות נפרדות.

אם המסנג'ר אמור להיטען רק עבור משתמשים מחוברים, שמור את בדיקת ההרשאה בתוך האפליקציה שלך.

לדוגמה, עם ריאקט:

ניתן להישאר פעיל בשימוש ב-Anonymous Messenger אם חוויית התמיכה שלך צריכה להיות זמינה הן למבקרים והן ללקוחות מחוברים.

שיטות עבודה מומלצות לאבטחה

בעת זיהוי משתמשים ב-Notiondesk מסנג'ר:

notiondesk.updateConfig({
  userToken: refreshedUserToken,
});

notiondesk.updateConfig({
  userToken: null,
});

notiondesk.destroy();

<NotiondeskProvider
  messengerId="YOUR_MESSENGER_ID"
  enabled={currentUser.isAuthenticated}
  userToken={userToken}
>
  {children}
</NotiondeskProvider>

• שמור את האפליקציה שלך בסוד בשרת

• חתימה על אסימונים רק בקצה האחורי שלך

• השתמש ב-HS256

• כלול את כל התביעות הנדרשות

• קבע את user_id מההפעלה המאומתת בצד השרת שלך

• שמרו על אסימונים קצרי מועד

• לעולם אל תכניסו אסימוני משתמש לקוד קצה (frontend)

• רענן אסימונים בעת הצורך

• נקה את האסימון הנוכחי כאשר משתמש מתנתק

• סובבו את סוד האפליקציה שלכם אם אתם סבורים שהוא נחשף

פתרון בעיות

notiondesk.updateConfig({
  userToken: null,
});