如何访问 Gatsby 中“file”或“allFiles”GraphQL 查询返回的文件的文本内容？

Posted 2023-03-08

【中文标题】如何访问 Gatsby 中“file”或“allFiles”GraphQL 查询返回的文件的文本内容？

【英文标题】：How to access text contents of file returned by a "file" or "allFiles" GraphQL query in Gatsby?

【发布时间】：2020-04-20 15:25:21

【问题描述】：

我正在尝试访问 Gatsby 中的“文件”GraphQL 查询返回的文本文件的内容（通过 gatsby-source-filesystem 插件）。该查询肯定会返回一个 File 节点。问题是我希望 internal>contents 字段包含文件的内容，但它没有；它始终为空。这是使用 Gatsby 的 GraphiQL 浏览器获得的示例查询和结果。问题是（1）我做错了什么，以及（2）我应该怎么做才能实现访问文件内容的意图？

查询

query MyQuery 
  file(ext: eq: ".lean", name: eq: "test") 
    name
    relativePath
    size
    internal 
      content
      mediaType
    
  

结果

  "data": 
    "file": 
      "name": "test",
      "relativePath": "test.lean",
      "size": 10,
      "internal": 
        "content": null,
        "mediaType": "application/octet-stream"
      
    
  

从结果中可以看出，文件不是空的（文件里面有一小行 Lean Prover 代码），但是 internal>content 字段的值仍然为空。我显然做错了什么，但经过一个小时试图弄清楚是什么，我认为其他人也可能会从快速回答中受益。感谢您阐明我的问题。

【参考方案1】：

好的，所以 gatsby-source-filesystem 实际上导出了一个辅助方法 loadNodeContents（当然它只是从文件中读取）。唯一的问题是这个插件的公共文档站点上没有记录。这是出现相关代码的文件。 https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-source-filesystem/src/index.js

【讨论】：

很抱歉在这里自言自语，但上面的功能似乎不起作用。基本问题似乎是 fs 在客户端不可用。还在寻找。

好的，还有一条评论。问题/问题是文件系统 (fs) 不适用于在 Gatsby 中编写的大多数代码，因为该代码将从 S3 存储桶或其他东西中的某个目录运行。 fs 仅在网站 build 时可用。那么，诀窍在于 fs 在 gatsby-node.js 文件中可用。可以在那里获取内容并作为辅助字段附加到通过“文件”或“所有文件”查询检索的文件节点。为此，需要实现 onNodeCreate。辅助字段“fields.content”可用于查询并将内容返回给客户端。