如何将SSR版本的SPA（React）仅交付给搜索机器人

Question

我们正在 React 上完成网站，但出于 SEO 目的，我们需要识别用户代理并为搜索引擎爬虫“提供”网站的静态版本 (SSR)，以及向其他用户代理提供正常的 SPA。我发现使用 next.js 我们可以制作 SSR，但在这种情况下，网站似乎对所有用户代理都是 SSR。

因此问题是如何根据用户代理类型识别用户代理并交付网站版本（SPA/CSR 或 SSR）。

我知道有一种方法可以在 React 服务器前面设置 Nginx 来路由（有点代理）请求。但我对仅 React 的解决方案感兴趣

Answer 1

我认为您正在谈论 robots.txt 文件。 您可以将此文件添加到 static 文件夹 中并在 server.js

中定义

const options = {
              root: path.join(__dirname + '/../static/'),
              headers: {
                'Content-Type': 'text/plain;charset=UTF-8',
              }
            };

            server.get('/robots.txt', (req, res) => (
              res.status(200).sendFile('robots.txt', options)
            ));

Answer 2

我也偶然发现了这个问题，这是我得到的结论：

• 向机器人提供 SSR 内容：这涉及检测服务器上的机器人（例如 AdSense 审核机器人）并向其提供网站的服务器端呈现版本。这样，机器人就会看到完全渲染的页面。

• 基于查询字符串的 SSR：实现服务器逻辑，根据 URL 中是否存在特定查询字符串来提供 SSR 内容，该查询字符串在站点地图中使用，以确保机器人接收 SSR 版本。

• 使用负载均衡器或反向代理：部署站点的 SSR 和静态版本，并使用 AWS ALB 或 Nginx 等工具根据 User-Agent HTTP 标头将机器人流量路由到 SSR 版本。

我的回答有点晚了，我希望你已经解决了这个问题:)

为了证明它有效： https://support.google.com/adsense/thread/27854974/how-to-handle-adsense-ads-for-an-spa-single-page-app?hl=zh-CN