我正在基于盖茨比建立一个网站。英文内容可通过“ /”访问,德语内容可通过“ / de”访问。这由以下插件处理:https://github.com/angeloocana/gatsby-plugin-i18n。
现在,我想检测浏览器的语言并将用户重定向到“ /”或“ / de”。到目前为止,我所了解的是,使用Gatsby实现这种行为并不容易,因为Gatsby在服务器端渲染和构建路由。
检测用户语言并重定向到“ /”或“ / de”的最佳方法是什么
您需要执行类似的操作
import React, { useEffect } from "react";
import { navigate } from "gatsby";
const getRedirectLanguage = () => {
if (typeof navigator === `undefined`) {
return "en";
}
const lang = navigator && navigator.language && navigator.language.split("-")[0];
if (!lang) return "en";
switch (lang) {
case "ja":
return "ja";
default:
return "en";
}
};
const IndexPage = () => {
useEffect(() => {
const urlLang = getRedirectLanguage();
navigate(`/${urlLang}`);
}, []);
return null;
};
export default IndexPage;
[C0的积分]