Далее.JS — Ошибка: Экспорт обнаруженных ошибок по следующим путям: /блоги/:сообщение

#javascript #node.js #reactjs #next.js

Вопрос:

Я пытаюсь next export :

Произошла ошибка предварительной настройки страницы «/блоги/[сообщение]». Подробнее читайте: https://err.sh/next.js/prerender-error Ошибка: Ошибка для страницы /блогов/[сообщения]: страницы с getServerSideProps не могут быть экспортированы. Смотрите более подробную информацию здесь: https://err.sh/next.js/gssp-export на объекте.Страница экспорта [по умолчанию] (C:_PROJECTbimeshow-master-27-02-1400node_modulesnextdistexportworker.js:15:254) информация — неопределенная (33/33) Ошибка: При экспорте обнаружены ошибки по следующим путям: /блоги/[сообщение] в exportApp (C:_PROJECTbimeshow-master-27-02-1400node_modulesnextdistexportindex.js:24:1103) в процессах и проекциях (внутренний/процесс/task_queues.js:93:5)

блоги/[пост].js:

 ...
export const getServerSideProps = async ({params}) => {
    const postUrl = params.post;
    const res = await axios({
        method: 'post',
        url: `/blog/single2?seo_url=${encodeURI(postUrl)}`
    });

    return { 
        props: { 
            data:res!=undefined? res.data.data : []
        }
    }
  }
 

routes.js:

 module.exports = () => {
    return {
      '/': { page: '/' },
      '/about-us': { page: '/about-us' },
      '/404': { page: '/404' },
      '/login': { page: '/login' },
      '/blogs':{ page : '/blogs'},
      '/blogs/[post]': {page: '/blogs/[post]'},
    }

 

server.js

 const express = require('express');
const next = require('next');
const { parse } = require('url');

const DEV = process.env.ENVIRONMENT !== 'production';
const PORT = 4567;

const app = next({dir: '.', dev: DEV});
const handle = app.getRequestHandler();

const getRoutes = require('./routes');

const routes = getRoutes();
  app.prepare().then(() => {
    const server = express();
    server.get('*', (req, res) => {
      const parsedUrl = parse(req.url, true);
      const { pathname, query } = parsedUrl;
      const route = routes[pathname];
      if (route) {
        return app.render(req, res, route.page, route.query);
      }
      return handle(req, res);
  });

  server.listen(PORT, (err) => {
    if (err) throw err;
    console.log(`> READY FOR LIFOTFF http://localhost:${PORT}`);
  });
});
 

Ответ №1:

Как уже указано в информации по ссылке в сообщении об ошибке: getServerSideProps не совместим со следующим экспортом. Вам нужно будет изменить это, чтобы получить статические данные.

https://nextjs.org/docs/messages/gssp-export

Вот документация для getStaticProps:

https://nextjs.org/docs/basic-features/data-fetching#getstaticprops-static-generation

Комментарии:

1. getStaticProps используется для статических страниц и не может отображать новые записи после экспорта. По этой причине мне нужны динамические страницы.

2. Тогда зачем вам вообще понадобился статический экспорт сайта? Чего именно вы пытаетесь достичь?

3. Как я обычно получаю динамический вывод? Мне нужно, чтобы [post] .js был динамичной страницей с хорошим SEO.

4. Мне приходилось делать это в прошлом, и лучший способ — использовать рендеринг на стороне сервера. Вам придется развернуть веб-сайт как бессерверное приложение (лучший вариант, на мой взгляд). Чтобы правильно ввести реквизиты на стороне сервера, вам нужно будет использовать getServerSideProps, как вы уже делаете. Я решил использовать Vercel для легкого развертывания, но у меня есть опыт работы с докером. Вам нужно будет запустить приложение при следующем запуске