ראוטר vue, ניתוב למרות הסתרת פרמטרים

[chagold]

במקום הכשלון כאן,
אני מעוניין בניתוב דינמי (עפ"י הדומיין), ושזה לא ישתקף בurl.

לדוגמא אם יש לי ראוטר כזה -

const routes = [
	{
		path: '/',
		name:'a',
		component: a,
		redirect: '/',
	},
	{
		path: '/',
		name:'b',
		component: b,
		redirect: '/',
		
	}]

יש אפשרות להגדיר בrouter.beforeEach להיכן הוא ינותב?

[chagold]

יש כאן פתרון, אבל הוא לא יעזור לי בגלל שאני צריך פרמטרים מהשרת לפני קביעת הroutes.

הוספה: ולא מצאתי דרך לעשות את הבקשה לפני ריצת כל הקוד

תודה לכולם.

[zvizvi]

@chagold

router.beforeEach(async (to) => {
  if (to.meta.foo && bar ...) {
    return '/home';
  }
  if (to.meta.authRequired) {
    try {
      await checkAuthentication();
    } catch {
      return '/login';
    }
  }
});

מה שהפונקציה תחזיר לשם הוא ינותב, ואם לא יוחזר כלום הRoute ימשיך בניתוב המקורי.

[chagold]

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

[ב.ל]

@chagold אמר בראוטר vue, ניתוב למרות הסתרת פרמטרים:

חושב כעת לכאו' על פתרון טוב יותר

אולי תפרט יותר מה הבעיה שאתה מנסה לפתור?

[chagold]

@ב-ל

אני רוצה שצד הקליינט (vue) יוכל לשמש כמה דומיינים, של כמה סוגי פרוייקטיים (כיון שיש הרבה קומפוננטות שיכולות להיות תואמות למרות שהם פרוייקטים שונים).
אבל כן רציתי שהקונטיינור (ג"כ קומפוננט) של תצוגת הקליינט יהיה שונה בין הפרוייקטים.
ניסיתי באשכול הנזכר לעיל לעשות שהimportים יהיו מותנים (לפי סוג הפרוייקט, שהוא תלוי במידע שאני מקבל מהשרת) ולא הצלחתי שם כיון שהראוטר רץ עוד לפני שהספקתי לקבל את המידע מהשרת.

אז לאחר שהשלמתי עם זה שירוץ קוד הimport של הקונטיינורים של פרוייקטים שאינם קשורים לפרוייקט שלי, אבל אני מנסה עכשיו שלפחות הניתוב (בין המסלולים שהroutes) יוגדר בצורה נכונה. לדוגמא, כיון שגם סוג פרוייקט א' הurl הפנימי מתחיל ב/ וגם בסוג פרוייקט ב' (וכ"א מביא קומפוננט שונה לתצוגה), א"כ אני סוכ"ס צריך להגדיר איזה מהם ישמש לפרוייקט א' ואיזה לפרוייקט ב'.

---

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

תודה.

[חוקר]

@chagold
מה אתה קורה דינאמית?
אני למשל את קובץ src/navigation/horizontal/index.js של התפריטים עשיתי כך:

// eslint-disable-next-line import/no-cycle
import kkkkkDashboard from './kkkkkDashboard'
// eslint-disable-next-line import/no-cycle
import kkkkkClient from './kkkkkClient'

// eslint-disable-next-line import/no-mutable-exports
let nav

const { host } = window.location
const parts = host.split('.')
const domainLength = 3 // route1.example.com => domain length = 3
if ((parts.length === (domainLength - 1) && host !== 'kkkkk.client') || parts[0] === 'www') {
  nav = kkkkkDashboard
} else if (parts[0] === 'client' || host === 'kkkkk.client') {
  nav = kkkkkClient
} else {
  nav = kkkkkDashboard
}
console.log(nav)

// Array of sections
export default [...nav]

ובכל קובץ שמתי את התפריטים הרלוונטים

export default [
  {
    title: 'דף הבית',
    icon: 'HomeIcon',
    route: 'main',
    action: 'user',
    resource: 'ACL',
  },
  {
    title: 'אודות',
    icon: '',
    route: 'about',
    action: 'user',
    resource: 'ACL',
  },
  {
    title: 'תנאי שימוש',
    icon: '',
    route: 'terms',
    action: 'user',
    resource: 'ACL',
  },
  {
    title: 'יצירת קשר',
    icon: '',
    route: 'contact_us',
    action: 'user',
    resource: 'ACL',
  },
]

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

[chagold]

@חוקר אני מבין שאצלך זה חלוקה בין צד שרת ללקוח וכיו"ב (כשגם אם הדומיין הוא שונה אבל סוג האתר הוא אותו דבר), ואתה יכול להבדיל ביניהם על פי מניפולציות על הדומיין.

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