在使用 Express.js 进行开发时，我们经常会在路由中加入前缀，以便更好地组织和管理代码。但是，在加入前缀后，有时会出现访问出错的情况。本文将介绍如何解决这个问题，并提供一些示例代码和指导意义。
问题描述
当我们在 Express.js 中加入路由前缀后，例如：
app.use('/api', apiRouter);这里的 api 就是路由的前缀，我们可以通过访问 http://localhost:3000/api 来访问 apiRouter 中的路由。但是，有时候我们会发现，当我们访问 http://localhost:3000/api/some-route 时，会出现访问出错的情况。
问题原因
这个问题的原因是，当我们加入路由前缀后，Express.js 会将这个前缀作为基础路径，例如上面的例子中，基础路径就是 /api。在访问路由时，Express.js 会将这个基础路径和路由路径拼接起来，例如访问 http://localhost:3000/api/some-route 时，Express.js 实际上会访问 /api/some-route 这个路径。
这个问题的根本原因是，我们在路由中定义的路径是相对于根路径的，而不是相对于基础路径的。因此，当我们加入路由前缀后，路由路径就不再是相对于根路径了，而是相对于基础路径。
解决方法
要解决这个问题，我们需要让路由路径相对于基础路径而不是根路径。有两种方法可以实现这个目标。
方法一：使用绝对路径
第一种方法是使用绝对路径来定义路由路径。例如：
apiRouter.get('/some-route', (req, res) => {
res.send('Hello, world!');
});这里的 /some-route 就是一个绝对路径，它不是相对于根路径的，而是相对于基础路径的。因此，当我们访问 http://localhost:3000/api/some-route 时，Express.js 实际上会访问 /api/some-route 这个路径。
这个方法的优点是简单易懂，不需要特殊的配置。缺点是，如果我们改变了基础路径，就需要修改所有路由路径，比较麻烦。
方法二：使用 express.Router()
第二种方法是使用 express.Router() 来创建一个路由对象，然后将这个对象挂载到基础路径上。例如：
const router = express.Router();
router.get('/some-route', (req, res) => {
res.send('Hello, world!');
});
app.use('/api', router);这里的 router 就是一个路由对象，它包含了所有的路由定义。我们将这个对象挂载到基础路径上，就可以让路由路径相对于基础路径了。
这个方法的优点是灵活，可以随时改变基础路径而不需要修改路由路径。缺点是需要创建一个额外的路由对象，稍微麻烦一些。
示例代码
下面是一个完整的示例代码，演示了如何使用 express.Router() 来解决路由前缀访问出错的问题。
-- -------------------- ---- ------- ----- ------- - ------------------- ----- --- - ---------- ----- --------- - ----------------- ---------------------------- ----- ---- -- - ---------------- --------- --- --------------- ----------- ---------------- -- -- - ------------------- -- ------- -- ------------------------ ---
指导意义
通过本文的介绍，我们了解了在 Express.js 中加入路由前缀后访问出错的问题，以及如何解决这个问题。这个问题虽然看似简单，但是涉及到了 Express.js 路由的基本原理，对于初学者来说还是比较有难度的。
在日常开发中，我们经常需要加入路由前缀来组织和管理代码，因此这个问题是比较常见的。掌握了解决这个问题的方法，可以更好地进行 Express.js 开发。
同时，本文也提供了两种解决方法，让读者可以根据自己的需求选择最适合自己的方法。这个方法也可以用来解决其他类似的问题，例如在 Vue.js 中使用路由前缀等。
Source: FunTeaLearn,Please indicate the source for reprints https://funteas.com/post/6794e540504e4ea9bd9ce5fb