ממשקים לפי תפקיד וגישה

1) עקרונות

1. אבטחה = משימת UX. המשתמש חייב להבין בבירור מה הוא יכול או לא יכול לעשות ללא ”תחומים אפורים”.
2. מינימום זכויות הכרחיות. מתצוגה לפעולות, הכל מוגבל למשימות תפקידים.
3. אות במקום איסור. אם אין גישה, נסביר מדוע וכיצד להגיע (בקשה, בקשה, הכשרה).
4. שכפול על השרת. שומרי UI אף פעם לא להחליף בדיקות שרת.
5. ביקורת שקופה. כל פעולה רגישה משאירה סימן קריא.

2) מודלים של בקרת גישה

(RBAC): תפקידים קבועים: שחקן, תמיכה, פיננסים, סיכון/ציות, מנהל תאימות, מנחה, מנהל.
מדיניות מבוססת מאפיינים (תחום שיפוט, מותג, אזור זמן, רמת אח "מים, צוות, משמרת).
RBAC (מערכת יחסים מבוססת): גישה על ידי מערכת יחסים (מפעיל שחקנים, מחזיק כרטיסים, מנהל שותף).
SOD (הפרדה בין חובות) - הפרדה בין משימות קריטיות (שנוצרו תחת אישור).

תרגול: RBAC כבסיס, ABAC לכוונון עדין (מותג/אזור), SOD למימון/מגבלות, REBAC-point (תיקי תיקי אוצר).

3) מפת פונקציות לפי תפקיד (דוגמה iGaming)

4) דפוסי UX לזכויות ותפקידים

4. ניווט וראות 1

הסתר קטעים בלתי נגישים מניווט (הפחתת רעש), אך הצג כרטיסים ”ריקים” מידע אם זה עוזר להבין את האפשרויות.
עבור באופן זמני לא זמין - ”Lock” עם רמז: סיבה, דרישות, CTA ”גישה בקשה”.

4. 2 מצבי פעולה

נכה + טיפ כלים: "נדרש תפקיד פיננסי. בקשת גישה.
מצב קריאה בלבד: שדות ”מתחת לזכוכית”, סמן מפורש ”לקרוא בלבד”.
הסלמה - לחץ על הגשה לאישור במקום ליישם.

4. 3 מיסוך ועריכה

PII (דוא "ל, טלפון, כתובת) -" user @ "," + 380 90 "עבור רשומות של אנשים אחרים.
PAN/IBAN - רק אסימונים/4 האחרון.
הצג כפתור רדיו מלא - בעלות על תפקיד רק/על ידי אירוע ביקורת.

5) ארכיטקטורת רשות ב ־ UI

הקשר מדיניות על הלקוח: מטמון הרשאה (TTL קצר) + מנוי לעדכונים.
שומרי מסלול: נתבים בלתי נגישים = = 403 עמודים עם הסבר וסי-טי-איי.
שומרי רכיבים: 'Can (' action: 'לאשר _ בתוך', משאב: 'payout'?').
פישפלאגים: דברים ניסיוניים/עונתיים - נפרדים מזכויות.

tsx type Permission = string; // 'payout.approve', 'kyc.view_masked'
type Policy = { has:(p:Permission)=>boolean };
const PolicyCtx = React.createContext<Policy>({ has:()=>false });
export const Can: React.FC<{perm:Permission, children:React.ReactNode, fallback?:React.ReactNode}>
= ({perm, children, fallback=null}) => {
const { has } = React.useContext(PolicyCtx);
return has(perm)? <>{children}</>: <>{fallback}</>;
};

6) שרת> לקוח

כל פעולה מאושרת על ידי השרת על ידי אסימון עם סימנים (תפקיד, תכונות).
מדיניות מרכזית (PDP/OPA/Cedar/Zanzibar-like), UI מקבל את הפתרון בלבד.
כל פעולות קריטיות - שני גורמים אישור + ביקורת.

7) מסכות ואזורי מידע אדומים

• שם, דוא "ל, טלפון, כתובת, תאריך לידה.
• פיננסים: PAN/IBAN/ארנקים קריפטו, סכומים, גבולות, מאזן בונוס.
• מסמכים: דרכונים/זיהוי/סלפי (KYC).
• הימורים על היסטוריה/זכיות/תבניות.

• בעל תפקיד/רקורד מלא.
• תמיכה במסכות, מימון (לא בעלים).
• צובר - אנליטיקה (אין תעודות זהות).

tsx function Redact({text, perm}:{text:string, perm:Permission}){
const { has } = React.useContext(PolicyCtx);
return <span>{has(perm)? text: text.replace(/.(?=.{4})/g,'•')}</span>;
}

8) אישורים וזרימת זבל

ארבע עיניים: יוזם אישור.
נתיבי מולטי-במה (לדוגמה, כמויות> X # 2 line).
תוקף של בקשות, SLA, הסלמה.
כתב עת: מי יצר, מי השתנה, מי אישר, מתי ומהיכן.

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

9) הפרטים של iGaming

גבולות והדרה עצמית: שינוי רק עם הודעת SoD ומשתמש חובה.
KYC/AML: גישה למסמכים - תפקיד צר; תצוגה מקדימה של ציפורניים, בגודל מלא, על ידי פעולה נפרדת עם בול העץ.
סנקציות/דגלי ראפ: גלוי לצוות הסיכון; תמיכה רק במצב ”צריך אימות”.
תשלומים/יציאות: פוסט/דחייה - תפקיד בחשבונאות פיננסית בלבד; כמויות מעל הסף - אישור כפול.
יומני הימורים: תמיכה קוראת אך אינה עורכת; התאמות - פונקציה נפרדת עם חקירה.

10) לוקליזציה, A11y, RTL

הטקסטים ”אין גישה” הם מקומיים ומכילים שבילים תקפים (application/training).
מוקד בקרה: אל תעביר את המשתמש לעמוד ”ריק” ללא הסבר.
מצב RTL נתמך לתפקידים באזורים שונים.
A11y: 'אריה-נכה' + הסבר, זמינות הסלמה מקלדת.

11) תנאים וטעויות

403 ידידותי עם הקשר לחיקוי ו ”בקשה לגישה” CTA.
404 (אין משאב): לא לחשוף את קיומם של אובייקטים חבויים.
413/422 (יותר מדי/אימות): לא להדליף פרטי מדיניות, לנסח באופן נייטרלי.
דרג גבולות/מנעולים: הסבר את מצב שעון העצר/פתח.

12) מדדים

Access Naught Rate: failing rate by face/screen (סיגנל רע של IA או פוליסה).
אישור SLA: זמן אישור חציוני על ידי זרימה (תפוקה, גבולות, KYC).
מסכה חושפת אירועים: שיעור ה ־ PII ”חושף” (צפוי להיות קטן ומוצדק).
שגיאה לרזולוציה: זמן מ-403 לגישה המוענקת.
סחיפה פחות-פריבילגיה: תפקידים עם זכויות מיותרות (decutability על ידי שימוש).

13) אנטי דפוסים

להסתיר טעויות תחת ”שום דבר לא קרה”.
הצג כפתורים ריקים ללא הסבר.
מסכה הבעלים עם הנתונים שלו.
להסתמך על שומרי UI ללא מדיניות שרת.
ערבב פישפלאגים עם גישה (משימות שונות).
תן את התמיכה ”אלוהים-מוד” למען הנוחות.

14) מערכת עיצוב אסימונים (דוגמה)

json
{
"access": {
"badge": { "viewer":"#607D8B", "editor":"#4CAF50", "approver":"#FF9800", "admin":"#9C27B0" },
"lockColor": "#9E9E9E",
"maskChar": "•"
},
"states": {
"noAccess": { "bg":"var(--bg-elev)", "border":"var(--border)", "icon":"#9E9E9E" },
"approval": { "pending":"#FFC107", "approved":"#4CAF50", "rejected":"#F44336" }
},
"a11y": { "ariaDisabled": true, "explainDenial": true }
}

15) Snippets UI

tsx import { Navigate, Outlet } from 'react-router-dom';
function GuardedRoute({perm}:{perm:Permission}){
const { has } = React.useContext(PolicyCtx);
if (has(perm)) return <Outlet/>;
return <Navigate to={`/403?perm=${encodeURIComponent(perm)}`} replace/>;
}

html
<article class="no-access">
<h3>Недостаточно прав</h3>
<p>Доступ к разделу «Выплаты» доступен ролям: Финансы/Админ.</p>
<button class="btn" data-open-request>Запросить доступ</button>
</article>

json
{
"ts": "2025-11-03T18:45:12Z",
"actor": "u_5412",
"action": "payout.approve",
"target": "withdraw#w_91822",
"ip": "194...12",
"result": "success"
}

16) רשימת QA

ניווט וחקירות פנים

[ ] קטעים לא זמינים לא עושים רעש בתפריט.

[ ] יש ברור ”אין גישה” דפים/כרטיסים עם CTA.

פעולות ושומרים

[ ] כפתורים ללא זכויות ”נכה” + טיפ/טקסט.

[ ] Routs מוגן; כתובת ישירה = 403 עם הסבר.

[ ] השרת מאשר כל פעולה.

נתונים

[ ] PII/PAN/KYC מוסווים על ידי מדיניות.

[ ] יומנים של ”גילויים” נכתבים ונסקרים.

[ ] Export/Reports מתאים לתפקיד (צבירה לניתוח).

אישורים/SoD

[ ] היוזם לא יכול לאשר את בקשתו.

[ סכומי סף ] = מסלולים מרובים.

А11у/Localization

[ ] ”אין גישה” הוא מקומי; ניווט מקלדת עובד.

[ ] טבעות ניגוד/מיקוד מתאימות לאלכוהוליסטים אנונימיים.

מהימנות

[ מטמון רשות ] עם TTL קצר; נכות בעת החלפת תפקידים.

[ ] PDP drop * UI במצב ברירת מחדל.

17) תיעוד במערכת התכנון

"כביש גואז", "Can", "NoesCard", "Banner", "Redact'.
מדיניות: מטריצת תפקידים/פעולה, חוקי SoD, רמות מיסוך.
תהליך: בקשת גישה, הכשרה/הסמכה של תפקידים, תיקון זכויות פעם בשבוע.
Do/Don 't Gallery: ”כפתורים ריקים ללא סיבה”, ”הסוואה לבעלים”, ”UI ללא בדיקת שרתים” לעומת ”הגבלות מוסברות ו-CTA”.

סיכום קצר

ממשקי תפקידים הם ארכיטקטורת מידע ברורה + מדיניות קפדנית + הסברים ידידותיים. הצג רק מה שאתה צריך, מסווה נתונים רגישים, להגן על מסלולים ופעולות עם שומרים, להקליט כל אירוע קריטי בביקורת ולחלוק אחריות שבו הוא משפיע על כסף וציות. ב-iGaming, זה לא רק מפחית סיכונים, אלא גם גורם לקבוצות להיות מהירות ורגועות יותר.