Как я могу применять допустимые вложенные маршруты папок, когда имена папок в URL могут быть изменены вручную? ⇐ Javascript

[Anonymous]

Я строю приложение Next.js, которое повторяет функциональность, аналогичную Google Drive. Пользователи могут создавать вложенные папки под /приборной панели /рабочая комната, используя всеобщее динамическое маршрут ([... foterid]). URL каждой папки структурирован как пара идентификатора папки и имя папки. Например, когда я создаю папку с именем «Данные» с идентификатором 1, URL становится: < /p>
/dashboard/work-room/1/data
< /code>
В моем приложении идентификатор папки используется для вызовов API и извлечения данных, в то время как имя папки используется на дисплее Breadcrumb. Все работает правильно, когда приложение генерируется URL. Однако, если пользователь вручную изменяет имя папки в URL (или добавляет дополнительные сегменты), API по -прежнему получает данные, основанные исключительно на идентификаторе папки. Например:

Навигация по/приборной панели/рабочая комната/1/случайный по-прежнему получает данные для идентификатора папки 1, даже если имя сейчас "Случайный". ID 2. : < /p>
// Extract dynamic segments from the URL
const pathname = usePathname();
const dynamicPath = pathname
.replace("/dashboard/work-room", "")
.split("/")
.filter(Boolean);

// Folder id is assumed to be the second-to-last segment
const id =
dynamicPath.length >= 2 ? dynamicPath[dynamicPath.length - 2] : null;

const handleOpenFolder = (id, name) => {
router.push(
`/dashboard/work-room/${[
...dynamicPath,
id,
encodeURIComponent(name),
].join("/")}`
);
};

< /code>
и для получения данных (при генерации паров папок): < /p>
const pathname = usePathname();
const dynamicPath = pathname
.replace("/dashboard/work-room", "")
.split("/")
.filter(Boolean);

const id =
dynamicPath.length >= 2 ? dynamicPath[dynamicPath.length - 2] : null;

// Generate folder pairs (id, name)
const folders = [];
for (let i = 0; i < dynamicPath.length; i += 2) {
const id = dynamicPath;
const name = dynamicPath[i + 1];
if (id && name) {
folders.push({ id, name });
}
}

< /code>
Даже если имя папки в URL манипулируется или неверно, компонент всегда приносит данные на основе идентификатора папки. Это приводит к несоответствиям между отображаемой хлебной рубкой и фактическими данными папок. Более того, с глубоко вложенными маршрутами, если кто-то посещает URL-адрес, например, приборная панель/рабочая комната/1/неправомерные кончики/2/данные, компонент рендерирует с использованием идентификатора папки 2 без подтверждения того, что имя папки для идентификатора 1.
Мой вопрос: < /strong>
Как я могу проверить полную вложенную цепочку папок, чтобы, если пользователь вручную изменяет имя папки или добавляет дополнительные сегменты. Мне нужен надежный подход, который работает с любым уровнем гнездования. Скажите мне, что он будет обращаться на Frontend или от Backend.>

Подробнее здесь: https://stackoverflow.com/questions/794 ... url-may-be