【发布时间】：2018-11-22 11:03:57
【问题描述】：
我正在尝试设置一个 NodeJS 应用程序，该应用程序使用 Next 框架来利用客户端和服务器端呈现。我正在尝试让客户端和服务器端渲染为它生成的路由/URL 添加路径。服务器端渲染似乎通过设置 express server GET 函数来侦听路由上的请求，然后通过剥离前置路由值将其传递给节点。但是，当它在客户端上呈现时，即使将 as="{somestring}" 添加到 .js 页面中以获取 Link 之类的元素，前置值也会丢失，因此当在渲染中引用外部 Next javascript 文件时，它会丢失前置值.
路由的目的是允许我们在一个域上运行多个微服务，每个微服务托管在 AWS 的不同实例上，并使用目标组和 ALB 进行路由。
基本上我想要做的是将 / 替换为 /{somestring} 并且我需要将其不仅包含在服务器端渲染中，而且还包含在客户端渲染。
网址示例： www.example.com -> www.example.com/somestring
HTML 渲染： www.example.com/_next/960d7341-7e35-4ea7-baf6-c2e7d457f0db/page/_app.js -> www.example.com/somestring/_next/960d7341-7e35-4ea7-baf6-c2e7d457f0db/page/_app.js
编辑/更新
我尝试使用 app.setAssetPrefix，虽然它正确呈现资产请求并且页面加载资产本身是 404ing。
这是我的 server.js 文件：
const express = require('express');
const next = require('next');
const port = process.env.PORT || 3000;
const dev = process.env.NODE_ENV !== 'production';
const app = next({ dev });
const handle = app.getRequestHandler();
app
.prepare()
.then(() => {
// Port
const server = express();
app.setAssetPrefix('test1');
// ======
// Routes
// ======
server.get('/test1/:id', (req, res) => {
const actualPage = `/${req.params.id}`;
const queryParams = { id: req.params.id };
app.render(req, res, actualPage, queryParams);
});
server.get('/test1', (req, res) => {
app.render(req, res, '/');
});
server.get('*', (req, res) => {
handle(req, res);
});
// =============
// End of Routes
// =============
server.listen(port, err => {
if (err) throw err;
console.log(`>Listening on PORT: ${port}`);
});
})
.catch(ex => {
console.error(ex.stack);
process.exit(1);
});
【问题讨论】：
标签： node.js express nginx routes next.js