#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 для легкого развертывания, но у меня есть опыт работы с докером. Вам нужно будет запустить приложение при следующем запуске