Get help on Discord

Issue with fetching Mux video type in Sanity schema using Groq

19 replies
Last updated: Feb 7, 2022
hi guys I have some issues working with the mux video type
AI Update

Hey! I'd be happy to help you with Mux video issues. Since your question is pretty general, let me cover the most common issues people run into with the Mux video plugin and how to solve them:

Common Issues & Solutions:

  1. Setup & Configuration

    • Make sure you've installed the plugin: npm install sanity-plugin-mux-input
    • You need to add the plugin to your sanity.config.ts and configure it with your Mux credentials
    • Don't forget to set up the required environment variables for your Mux token ID and signing key

  2. Schema Definition

    • In your schema, you should define the field using the mux.video type (not just a regular object)
    • Example:
    {
  name: 'video',
  title: 'Video',
  type: 'mux.video'
}

  3. Upload Issues

    • If videos aren't uploading, check your Mux account has sufficient quota
    • Verify your API credentials are correct and have the right permissions
    • Large files may take time to process - there's a known issue where large uploads (500MB+) can fail with "Unexpected error occurred" after reaching 100%

  4. Playback/Preview Issues

    • Make sure you're querying the video asset correctly in GROQ
    • You'll need to use Mux's player SDK in your frontend to actually play the videos
    • The plugin stores references to Mux assets, not the actual video files

  5. CORS Errors

    • Add your domain to Mux's allowed domains in their dashboard

If you're using Media Library (Enterprise feature):

The newer Media Library with video support works differently:

  • Uses defineVideoField from sanity/media-library instead of mux.video
  • Videos are streamed directly from Sanity's CDN
  • Requires Studio v4.0.1+ and the video addon to be enabled

Could you share more details about what specifically isn't working? For example:

  • Are you using the Mux plugin or Media Library?
  • Is the upload failing?
  • Are videos not appearing in the studio?
  • Is playback not working on your frontend?
  • Any specific error messages?

That would help me give you more targeted advice!

if added it to my schema's like this
{
  title: 'Content',
  name: 'content',
  type: 'array',
  of: [
    {
      type: 'block'
    }, {
      type: "mux.video"
    },
    {
      type: 'image',
      options: {
        hotspot: true
      },
      fields: [
        {
          name: 'caption',
          type: 'string',
          title: 'Caption',
          options: {
            isHighlighted: true // <-- make this field easily accessible
          }
        },
      ]

    }
  ]
},

but when I fetch it with groq like this
"lesson": *[slug.current == $lessonSlug][0] { 
    _id,
    slug,
    title,
    content,
}

its not actually fetching the mux video
it returns
1. 
*asset*:
a. 
*_ref*: "1eaec214-7eac-4b97-95fa-b843fa4373b2"
b. 
[[Prototype]]: Object
2. 
*_key*: "91498c943dd0"
3. 
*_type*: "mux.video"

like this
with no actual reference to the mux video ID I need
I know you are can fetch references with the arrow in groq but I don't know how to do it with the array type. for images it seems to do it on its own
content[]-&gt;{}
hmm
I got it working by using
content[] {
    ...,
    _type == "mux.video" => {
        asset->,
    },
}
yep, I am curious why you chose an array over document for the schema?
Glad you got it working.
its the content of a page
you would have made a document out of it and referenced it?
const lesson = {
  name: 'lesson',
  title: 'Lesson',
  type: 'document',
  fields: [
    {
      title: 'Titel',
      name: 'title',
      type: 'string',
    },
    {
      title: 'Slug',
      name: 'slug',
      type: 'slug',
      options: {
        source: 'title',
        maxLength: 200, // will be ignored if slugify is set
        slugify: input => input
            .toLowerCase()
            .replace(/\s+/g, '-')
            .slice(0, 200)
      }
    },
    {
      title: 'Content',
      name: 'content',
      type: 'array',
      of: [
        {
          type: 'block'
        }, {
          type: "mux.video"
        },
        {
          type: 'image',
          options: {
            hotspot: true
          },
          fields: [
            {
              name: 'caption',
              type: 'string',
              title: 'Caption',
              options: {
                isHighlighted: true // <-- make this field easily accessible
              }
            },
          ]

        }
      ]
    },
  ]
}

export default lesson;

this is my entire schema

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?