reactjs - 如何让爬虫知道在 Gatsby React 中重定向页面

Question

我在“/”路由中有一个 React 组件，它使用 Gatsby 导航方法检查浏览器语言并相应地将用户重定向到“/en”或“/es”。
现在的问题是 Gatsby 在路由“/”上向 SEO 爬虫返回状态 200，因为它在技术上不是 301 重定向，使爬虫将其视为单独的页面。我也不能向“/”路由(或元 nofollow/noindex)添加规范标签，因为由于重定向，它会自动从“/en”页面中选择所有元数据。
这会导致 SEO 错误，例如重复的元描述和标题标签，在“/”中缺少自引用 hreflang(因为它从“/en”页面中获取值)。
我无法设置服务器端 301，因为我必须使用 JavaScript 代码找到用户的浏览器语言来重定向用户。

import React, { useEffect } from 'react';
import { navigate } from 'gatsby';

const LanguageSelect = () => {
  useEffect(() => {
    navigate(`/${window.navigator.language}`);
  }, []);
  return null;
}

我怎样才能让爬虫知道“/”路由不是一个独立的页面，他们不应该将它与“/en”页面分开？

Answer 1

I cannot set up a server-side 301 since I have to find the user's browser language using JavaScript code to redirect the user.

这导致了一个不可能的用例。您不能同时使用 JavaScript(客户端)根据 X 逻辑(在本例中为用户语言)进行一些计算，同时尽量避免 Google 的爬虫将站点编入索引。
这种逻辑必须由服务器完成，通过设置 /路线为 /en默认使用 301 .在那里，用户可以自由更改语言。