Next.JS:如何在本地主机上运行时使用本地化的API路由，或者如何为所有地区提供单个API路由

Question

我发现本地化的Next.js应用程序的API路由有问题。当我的站点是在本地主机上运行的本地化版本时，到我的服务器函数的API路由包括区域设置，这会导致404错误。

我像这样在客户端获取路由:

const res = await fetch(`api/route/path`);

当我在我的默认语言环境(en)上工作时，但如果我在url中有一个不同的语言环境，则获取失败，显示404:

GET http://localhost:3000/ko/api/route/path 404 (Not Found)

当我部署我的网站到Vercel，这个问题不会发生。据我所知，这是因为它为我在next.config.js中指定的每个语言环境部署了无服务器功能。

我next.config.js

const nextConfig = {
i18n: {
locales: [
'en',
'de',
'ko',
],
defaultLocale: 'en',
},
// ...
};
module.exports = nextConfig;

TL;博士

我怎么能得到本地化的API路由工作在我的Next.JS应用程序时，在本地主机上运行?我不打算为不同的语言环境在我的API上有不同的行为，那么是否有一种方法可以通过单个API路由所有API调用，而不是为每个语言环境提供无服务器功能?

Answer 1

我发现了问题所在。取回的API路由路径在开始时没有正斜杠，这导致它们没有作为绝对路径附加到我的域中。

所以，取路径应该是/api/route/path，而不是api/route/path。

如果没有正斜杠，路径名将相对于URL追加，这将包括在本地主机上运行时的区域设置。