尽管文件可以访问，但“Lighthouse 无法下载 robots.txt 文件”

Question

我在http://www.schandillia.com 上运行了一个NodeJS/NextJS应用程序。该项目有一个robots.txt文件，可从http://www.schandillia.com/robots.txt 访问。截至目前，该文件是用于测试目的的基本文件：

User-agent: *
Allow: /

但是，当我在我的网站上运行 Lighthouse 审核时，它会抛出一个爬网和索引错误，说它无法下载robots.txt文件。我再说一遍，该文件可从http://www.schandillia.com/robots.txt 获得。

如果您需要查看该项目的代码库，请访问https://github.com/amitschandillia/proost。该robots.txt的文件位于proost/web/static/而是得益于我的Nginx的配置如下根访问：

# ... the rest of your configuration
  location = /robots.txt {
    proxy_pass http://127.0.0.1:3000/static/robots.txt;
  }

完整的配置文件可在https://github.com/amitschandillia/proost/blob/master/.help_docs/configs/nginx.conf上的 github 上查看。

如果有什么我忽略的地方，请提供建议。

Answer 1

TL;DR：您robots.txt的服务很好，但 Lighthouse 无法正确获取它，因为它的审核目前无法与connect-src您网站的内容安全策略的指令一起使用，这是由于已知限制，问题#4386已修复铬 92。

说明： Lighthouse 尝试robots.txt通过从站点根目录提供的文档中运行的脚本来获取文件。这是它用于执行此请求的代码（在lighthouse-core 中找到）：

const response = await fetch(new URL('/robots.txt', location.href).href);

如果您尝试从您的站点运行此代码，您会注意到抛出“拒绝连接”错误：

发生此错误是因为浏览器对您站点提供的标头强制执行内容安全策略限制（为了便于阅读，分成几行）：

content-security-policy:
    default-src 'self';
    script-src 'self' *.google-analytics.com;
    img-src 'self' *.google-analytics.com;
    connect-src 'none';
    style-src 'self' 'unsafe-inline' fonts.googleapis.com;
    font-src 'self' fonts.gstatic.com;
    object-src 'self';
    media-src 'self';
    frame-src 'self'

注意connect-src 'none';部分。根据CSP 规范，这意味着不能使用提供的文档中的脚本接口加载任何 URL。在实践中，任何都fetch被拒绝。

由于您配置内容安全策略中间件的方式（来自提交 a6aef0e），此标头由 Next.js 应用程序的服务器层显式发送：

const response = await fetch(new URL('/robots.txt', location.href).href);

解决方案/变通方法：要解决审计报告中的问题，您可以：

• 在 Lighthouse 中等待（或提交）修复
• 使用该connect-src 'self'指令，这会产生副作用，即允许来自 Next.js 应用程序浏览器端的 HTTP 请求