从块数组中从 Sanity 获取文件 URL

Question

我正在使用 Next JS 和 Sanity 的 CMS 构建一个网站。 Sanity 有内置的图像模式，但没有视频模式，因此视频需要使用文件模式上传。 文档建议要获取要在前端使用的文件 URL，您应该使用查询语言 GROQ 根据请求进行此转换，如下所示：

// GROQ query
*[_type == 'movie'] {
  title,
  "manuscriptURL": manuscript.asset->url
}

但是由于我使用文件模式使用块模式将自动循环短视频嵌入到富文本内容中，因此我无法根据请求转换 URL，并且需要动态执行此操作，因为块数组数据是正在解析

@portabletext/react

组件。

基本上，我返回的文件只是包含以下数据的资产引用：

{
    "_type": "file",
    "asset": {
        "_ref": "file-e4e61f3b231cca8e3339e96e050aee428009c777-gif",
        "_type": "reference"
    }
}

当我使用 Sanity 自己的

@sanity/asset-utils

包通过其

buildFileUrl()

函数获取文件 URL 时，我得到一个对该资产未定义的 URL，其中 PROJECT_ID 和 DATASET 是正确的值：

https://cdn.sanity.io/files/[PROJECT_ID]/[DATASET]/undefined.undefined

这是我使用其包的文件 URL 函数创建的函数，用于获取资产 URL，该函数返回上面带有未定义值的 URL：

export function getSanityFileUrl(sanityFile) {
  const fileUrl = buildFileUrl(sanityFile.asset, {projectId: sanityConfig.projectId, dataset: sanityConfig.dataset})
  console.log(fileUrl)
}

谢谢，有什么帮助！

Answer 1

我找到了解决方案。由

buildFileUrl()

导出的

@sanity/asset-utils

函数需要不同的资产对象。相反，在这种情况下，用户应该使用

getFileAsset()

函数来接受对文件的引用。

Answer 2

您可以调整 GROQ 查询以展开块内容数组中的所有对象并投影资产 url（对于存在资产的块）

这是一个例子

*[_type == "movie"]{title, content[]{..., 'url':asset->url}}

content[]

扩展内容数组（将其替换为块数组的名称），

...

确保除了资产 URL 之外的所有其他内容都可以通过。

'url':asset->url

只是将资产的 url 作为值投影到

url

键。

额外参考 文档