[英]How to set up nextjs render in express routing?
應用程序.js
const express = require('express');
const next = require('next');
const port = parseInt(process.env.PORT, 10) || 3000;
const dev = process.env.NODE_ENV !== 'production';
const app = next({ dev });
const handle = app.getRequestHandler();
app
.prepare()
.then(() => {
const server = express();
const indexRouter = require('./routes/indexRouter');
server.use(indexRouter);
server.all('*', (req, res) => {
return handle(req, res);
});
server.listen(port, (err) => {
if (err) throw err;
console.log('> Ready on http://localhost:' + port);
});
})
.catch((ex) => {
console.error(ex.stack);
process.exit(1);
});
indexRoutes.js
const express = require('express');
const router = express.Router();
const userController = require('../controllers/user');
router.post('/api/signup', userController.signup);
我想通過 indexRoutes.js 中的 nextjs 渲染組件。 我見過其他人在主 app.js
server.get('/login', (req, res) => {
app.render(req, res, '/login');
});
但我不明白如何在單獨的文件中做到這一點。 我試圖這樣做,但沒有結果。
indexRoutes.js
const express = require('express');
const next = require('next');
const dev = process.env.NODE_ENV !== 'production';
const app = next({ dev });
const router = express.Router();
const userController = require('../controllers/user');
router.post('/api/signup', userController.signup);
router.get('/login', (req, res) => {
return app.render(req, res, '/login'); // this does not work
});
我該如何解決我的問題?
如果要將路由放在單獨的文件中,可以創建以下indexRouter.js
文件:
// routes/indexRouter.js
const userController = require('../controllers/user');
const indexRouter = (server, app) => {
server.post('/api/signup', userController.signup);
server.get('/login', (req, res) => {
return app.render(req, res, '/login');
});
};
module.exports = indexRouter;
然后,您可以從app.js
中獲取它並將server
和app
對象傳遞給它。
// app.js
// ...
app
.prepare()
.then(() => {
const server = express();
const indexRouter = require('./routes/indexRouter');
indexRouter(server, app)
server.all('*', (req, res) => {
return handle(req, res);
});
server.listen(port, (err) => {
if (err) throw err;
console.log('> Ready on http://localhost:' + port);
});
})
.catch((ex) => {
console.error(ex.stack);
process.exit(1);
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.