如何使非英语URL在next.js中工作？

如何使非英语URL与next.js ssr/client一起工作？欢迎任何想法、重写等

不久前，重写帮助解决了这个问题，但经过一些更新后，它停止了工作。这是我尝试去做的

我甚至试图重写Unicode路径，但它给了我一个奇怪的错误：

{
  source: encodeURI('/рус'),
  destination: "/u0440/u0443/u0441"
}

Error: Requested and resolved page mismatch: //u0440/u0443/u0441 /u0440/u0443/u0441

---

我已经实现了一个从漂亮的url到真实页面的映射

这种实现没有什么好处

漂亮的URL可以来自db 漂亮的URL可以位于与dir结构无关的任何结构中 漂亮的url可以是任何语言：]您可以控制api作为url返回的内容 整个应用程序对他们来说是不可知的 允许您在一个位置操作所有URL添加前缀或其他任何内容 简而言之，我有一个简单的对象，看起来像：

常数路由={ pageName:prettyUrl=>{href:'path/to/page'，as:prettyUrl}； } 客户端和服务器都在使用此对象

客户

api从数据库中为每个具有页面url属性的数据返回一个url属性

让我们考虑一下，我们的应用程序显示了用户和用户的列表，这意味着API返回给每个用户它都是URL，任何东西都必须是唯一的。 我展示了一个非常基本的实现，但是我认为您可以将任何东西传递给routes.pageName方法，例如userId，每个方法都可以使用它执行任何逻辑并返回{href，as}

---

在我的实际实现中，我使用它来传递url模板和更多：

我实现了一个从漂亮的url到真实页面的映射

这种实现没有什么好处

漂亮的URL可以来自db 漂亮的URL可以位于与dir结构无关的任何结构中 漂亮的url可以是任何语言：]您可以控制api作为url返回的内容 整个应用程序对他们来说是不可知的 允许您在一个位置操作所有URL添加前缀或其他任何内容 简而言之，我有一个简单的对象，看起来像：

常数路由={ pageName:prettyUrl=>{href:'path/to/page'，as:prettyUrl}； } 客户端和服务器都在使用此对象

客户

api从数据库中为每个具有页面url属性的数据返回一个url属性

让我们考虑一下，我们的应用程序显示了用户和用户的列表，这意味着API返回给每个用户它都是URL，任何东西都必须是唯一的。 我展示了一个非常基本的实现，但是我认为您可以将任何东西传递给routes.pageName方法，例如userId，每个方法都可以使用它执行任何逻辑并返回{href，as}

---

在我的实际实现中，我正在使用它，它允许我传递url模板和更多：

我可以用越南语文本来实现这一点。诀窍是再添加两次重写：一次重写真实文本，另一次重写URL编码文本

{
  source: "/lo%C3%A0i/:slug",
  destination: "/species/:slug"
},
{
  source: "/loài/:slug",
  destination: "/species/:slug"
}

---

我能用越南语做这件事。诀窍是再添加两次重写：一次重写真实文本，另一次重写URL编码文本

{
  source: "/lo%C3%A0i/:slug",
  destination: "/species/:slug"
},
{
  source: "/loài/:slug",
  destination: "/species/:slug"
}

---

现在我在next.config.js中重写如下：

const withBundleAnalyzer = require('@next/bundle-analyzer')({
  enabled: process.env.ANALYZE === 'true',
})

const pathsToRewrite = [
  ['/пользователь/:id/:nickname', '/user/:id/:nickname'],
  ['тест', 'test'],
]
const rewrites = pathsToRewrite.map(([ru, eng]) => ({ source: encodeURI(ru), destination: eng }))

module.exports = withBundleAnalyzer({
  async rewrites() {
    return rewrites
  },
})

---

现在我在next.config.js中重写如下：

const withBundleAnalyzer = require('@next/bundle-analyzer')({
  enabled: process.env.ANALYZE === 'true',
})

const pathsToRewrite = [
  ['/пользователь/:id/:nickname', '/user/:id/:nickname'],
  ['тест', 'test'],
]
const rewrites = pathsToRewrite.map(([ru, eng]) => ({ source: encodeURI(ru), destination: eng }))

module.exports = withBundleAnalyzer({
  async rewrites() {
    return rewrites
  },
})

---

问题是我不想使用自定义服务器。但还是要谢谢，如果我找不到解决方案，我会和你一起去。问题是我不想使用自定义服务器。但还是要谢谢，如果我找不到解决方案，我会和你一起去