Get help on Discord

Issue with getting the originalFilename of an asset when using the getFileAsset function.

10 replies
Last updated: Nov 11, 2021
Hi, how to get the ‘originalFilename’ of an asset when using https://sanity-io.github.io/asset-utils//index.html#getfileasset .
{
apiHost: "<https://api.sanity.io>"
apiVersion: "1"
cdnUrl: "<https://xx9fbq46.apicdn.sanity.io/v1>"
dataset: "staging"
gradientMode: false
isDefaultApi: true
isPromiseAPI: true
originalFilename: true
projectId: "xxxxxxx"
url: "<https://xx9fbq46.api.sanity.io/v1>"
useCdn: false
useProjectHostname: true
useVanityName: true
}
I’m passing ‘useVanityName: true’ in the options (above), along with the Project ID and dataset, however no originalFilename in the result. Thanks.
AI Update

Based on the @sanity/asset-utils library documentation, I need to clarify an important point about the originalFilename option you're passing to getFileAsset:

The originalFilename option doesn't work the way you're expecting. Here's why:

The Issue

The @sanity/asset-utils package does not resolve information from the Sanity API - it only works with the information you pass to it. This is explicitly stated in the library's documentation:

"This package does not resolve any information from the Sanity APIs - it does no asynchronous operations and only has the information that you pass it."

What originalFilename Actually Does

Looking at the getVanityStub function, the originalFilename option is used for building URLs with vanity filenames (the human-readable filename at the end of asset URLs), not for retrieving the original filename from an asset.

The Solution

To get the originalFilename of an asset, you need to query it from the Sanity API directly. The asset document itself contains this field. Here's how:

import {getClient} from '@sanity/client'

const client = getClient({
  projectId: 'xxxxxxx',
  dataset: 'staging',
  apiVersion: '2024-01-01',
  useCdn: false
})

// Query the asset document to get originalFilename
const asset = await client.fetch(
  `*[_id == $assetId][0]{
    _id,
    url,
    originalFilename
  }`,
  {assetId: 'file-xxxxx-xxx'}
)

console.log(asset.originalFilename) // This will have the original filename

The @sanity/asset-utils library is designed for parsing and building asset URLs/paths from known information, not for fetching asset metadata from the API. For metadata like originalFilename, size, mimeType, etc., you'll need to query the Sanity Content Lake directly.

Hi User
Here’s the asset:


asset: {_ref: 'file-893ae787544e3999c424bd5082924052795efe8d-pdf', _type: 'reference'}
itemMetaData: {_type: 'itemMetaData', caption: 'First factory design in Den Bosch'}
_key: "f04292f7c88b"
_type: "fileItem"

const assetData = getFileAsset(asset._ref, client.config())
The response from getFileAsset():


assetId: "893ae787544e3999c424bd5082924052795efe8d"
extension: "pdf"
metadata: {}
path: "files/xxxxx/staging/893ae787544e3999c424bd5082924052795efe8d.pdf"
url: "<https://cdn.sanity.io/files/xxxxxx/staging/893ae787544e3999c424bd5082924052795efe8d.pdf>"
_id: "file-893ae787544e3999c424bd5082924052795efe8d-pdf"
_type: "sanity.fileAsset"


Thanks.
Expected is originalFilename as documented here?:
Interesting. Is it possible that the original filename isn't set on the asset. For example, if you query it in Vision does it have an original filename property?
*[_type == "project" && _id == "18307598-bda2-420d-9243-396f5e1271de"]{
  "doc": documents[0]{asset->{path,url,_type, extension, originalFilename}}
}
Result:


[
  {
    "doc": {
      "asset": {
        "_type": "sanity.fileAsset",
        "extension": "pdf",
        "originalFilename": "20160708 Protix.pdf",
        "path": "files/xxxxxx/staging/893ae787544e3999c424bd5082924052795efe8d.pdf",
        "url": "<https://cdn.sanity.io/files/xxxxxxxx/staging/893ae787544e3999c424bd5082924052795efe8d.pdf>"
      }
    }
  }
]
It’s there via Vision.
This does look like a bug. Do you mind filing an issue in the package's repo? Imll alert the internal team.
Thanks!

Sanity – Build the way you think, not the way your CMS thinks

Sanity is the developer-first content operating system that gives you complete control. Schema-as-code, GROQ queries, and real-time APIs mean no more workarounds or waiting for deployments. Free to start, scale as you grow.

Get started for freeExplore the demo

Was this answer helpful?