我正在建立一个支持多种语言的博客。 URL 包含语言键,例如/en/blog
。我在本地化 404 页面时遇到了问题。这里描述了什么https://www.gatsbyjs.org/docs/creating-prefixed-404-pages-for-different-languages/适用于除主页之外的所有路线。主页具有以下 URL www.test.com/en
,由于此正则表达式 /^\/[a-z]{2}\/404\,最终会出现 404 页面/$/
我尝试传入正则表达式 ^\/?[a-z]{2}\/.+
来匹配除 /en
之外的所有路由,但 matchPath
似乎不包括正则表达式。
页面在后台进行排名;但是,似乎 /en
和 /en/does-not-exist
的处理方式相同,或者后者优先于前者。
我想知道以前是否有人遇到过这个问题,也许有解决方法。
目前,我有一个通用 404 页面,还有针对所有可用语言的单独 404 页面。在通用 404 中,我想重定向到特定于语言的 404 版本。它增加了我想避免的复杂性。
任何帮助表示赞赏。谢谢!
最佳答案
事实证明,这是一个已知的 match-paths.json 中的所有内容
问题。 https://github.com/gatsbyjs/gatsby/issues/19228
目前我的解决方法是使用基于语言键的重定向。
我有一个默认的 404 页面和特定于语言的 404 页面,例如/en/404
。
在默认的 404 页面中,我只是重定向谎言:
import { useEffect } from 'react';
import { navigate } from 'gatsby'
// Assuming the urls are structured this way /en/blog/does-not-exist
const getLanguage = (location) => location.pathname.split('/')[1]
const NotFoundPage = ({ location }) => {
useEffect(() => {
navigate(`/${getLanguage(location)}/404`, { replace: false })
}, []);
return null
}
export default NotFoundPage
不是最好的解决方案,但它目前可以完成工作。一旦我有更好的解决方案,我会发布更新。
关于routes - 带有语言键的 404 页面的 Gatsby 路由问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58796864/