Динамическая маршрутизация NextJS - возможно ли установить массив имен маршрутов?

#javascript #reactjs #axios #next.js

Вопрос:

Я использую динамическую маршрутизацию в своем приложении. Вот структура папок, с которой я работаю

 -pages
  -department
    -[slug].js

Теперь я хочу показать страницу, если только значение slug cse, eee, swe, english e.t.c равно, в противном случае я хочу показать 404 Not Found страницу. Есть ли какой-либо способ установить массив имен маршрутов? Затем, если значение slug (которое я могу получить с помощью getServerSideProps ) включено в этот массив, я буду обслуживать страницу, в противном случае обслуживать 404 Not Found страницу.

Зачем мне это нужно?

В getServerSideProps функции я получаю данные из конечной точки api. В этом случае, если значение slug не включено в конечную точку api, сервер выдает Request failed with status code 501 ошибку! Итак, если значение slug равно cse , конечная точка api доступна, и я могу получить данные. Если значение slug равно anything or xyasdfs , конечная точка api недоступна, и я не могу получить данные, и сервер выдает следующую ошибку.

Ответ №1:

я бы проверил в своем компоненте свойство в теле моего ответа .. например, если у всех отделов есть имя, затем проверьте его, если оно не существует, затем верните 404.

Ответ №2:

Для рендеринга со стороны сервера должно быть что-то вроде этого

 Page.getInitialProps = async ({query}) => {
  if(query.slug == 'cse') {
    //codes
  }
}

или вы можете использовать next Router hook
https://nextjs.org/docs/routing/dynamic-routes