Question

我正在使用React App（创建React App），react-i18next，React-Helmet开发网站。我在https://freetools.seobility.net/上测试了我的网站，它告诉我我没有用于标题和描述的元标记，但是，我确实有它们。我可以在浏览器中看到这些标签，但seoBot-无法。那其他搜索引擎机器人呢？

这是我的index.html：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="icon" href="%PUBLIC_URL%/favicon/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <link rel="apple-touch-icon" href="%PUBLIC_URL%/favicon/logo192.png" />
    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>

  </body>
</html>

我的JSON文件的这一部分：

{
  "meta": {
    "title": "Frequently asked questions",
    "description": "Find answers to frequently asked questions",
  }
}

此代码：

const [translation] = useTranslation("assortment");

 return (
        <div className={styles.page}>
            <MetaTags
                title={translation('meta.title')}
                description={translation('meta.description')}
            />
)


//<MetaTags> file

return (
       <Helmet>
            <meta charSet="utf-8" />
            <title>{title}</title>
            <meta name="description" content={description}/>
            {noIndex && <meta name="robots" content="noindex" />}
        </Helmet>
    );

我应该担心Googlebot或其他搜索引擎bot不能完全加载我的页面并看到我的元标记吗？我该怎么办？

Answer 1

您应该使用正确的爬网模式，以确保Seobility SEO Checker启用了JavaScript执行。

在这里找到正确的设置：

如果要确保Google和其他漫游器在使用JavaScript呈现页面时不会出现问题，请考虑为漫游器进行服务器端预呈现。

如何根据React APP中网站上的语言使元标签动态化？ [反应头盔+ i18next]

1 个答案: