Different slug names for the same dynamic path stackoverflow, redirect Nextjs-CodePudding

I have a project that has links for categories and products (see below) and I have to rewrite the project using nextjs, but I have to keep the links (it's important for SEO)

root:

[category] # e.g.: https://domen.com/categoryslug-category-id-103

[product] # e.g.: https://domen.com/productslug-product-id-3663267

But we know that nextjs doesn't allow you to have more then one dynamic page in the same folder.

I understood that with nextjs methods it's impossible (e.g. redirects in next.config.js). Or possible?
I thought about making just one general dynamic page (e.g. [dynamic]) and using different conditions to handle different links/pages in this page, but it will be very big file and it seems not good practice. (I haven't yet tried it, it was just idea, bad idea I guess)
Maybe I have to have the traditional nextjs structure:

root:

category:
    [categorySlug] # e.g.: https://domen.com/category/categoryslug-category-id-23

product:
    [productSlug] # e.g.: https://domen.com/product/productslug-product-id-3663267

and then somehow to 301 redirect from https://domen.com/category/categoryslug-category-id-23 to https://domen.com/categoryslug-category-id-23, but how?

Just in case: I use Django REST framework as a backend.
Maybe the only way is to get rid of Next.js and use just React? I am newbee and don't now whether it will be possible to have this flexibility with row React AND it's crutual if it's possible to set ssr, ssg without next.js using jast React and if so, how? But would want to remain with Next.js because it has a lot of good fiatures for SEO from the box. But the sake of handling my issue I am ready to get rid of Next.js :(
I heard that it can be done by NGINX (I don't plan to use Vercel server, at least for now I don't think about it). If I have only this option, can you give me a tip/link how to do it.
By this link https://github.com/vercel/next.js/issues/9130 I maybe found the solution (by BramDecuypere), but I don't understand one: "What we do now though (for blogs at least), is have them come from our CMS and store the alternate links of the blogs inside the page as well. So we know there is always a link we can refer too."

What would you do if you had the same task/issue?

CodePudding user response：

I used middleware: https://nextjs.org/docs/advanced-features/middleware#conditional-statements

import { NextResponse } from "next/server";
import { NextRequest } from "next/server";

export function middleware(request) {
  if (request.nextUrl.pathname.includes("category-id")) {
    const [slug] = request.nextUrl.pathname.split("-");
    return NextResponse.rewrite(new URL(`/category${slug}`, request.url));
  }

  if (request.nextUrl.pathname.includes("product-id")) {
    const [slug] = request.nextUrl.pathname.split("-");
    return NextResponse.rewrite(new URL(`/product${slug}`, request.url));
  }
}

when you access https://domen.com/categoryslug-category-id-103, it will use /category/[categorySlug] page the url is still https://domen.com/categoryslug-category-id-103

Then, to avoid duplicates, I wrote in next.config.js the appropriate 301 redirects to redirect from links like /category/[categorySlug] to like https://domen.com/categoryslug-category-id-103