Can't play videos that don't have an extension on iOS

[lpbonomi]

Similar to these:

https://stackoverflow.com/questions/32954091/how-to-play-a-video-from-url-with-no-file-extension-in-ios
https://stackoverflow.com/questions/30199261/why-wont-safari-play-file-without-extension-in-video

I can't play videos that don't have an extension in the URL on iOS

A previous solution I found was using the tag with the video's URL and specifying the type of the video, this is not supported by NextVideo.

I made a repo: https://github.com/lpbonomi/next-video-error-demo
And deployed the code showing this behaviour: https://next-video-error-demo.vercel.app/
(Please use an iOS device to see the problem)

Is there another way to do this?

[luwes]

are you looking for something like this https://github.com/muxinc/next-video/pull/263/files ?

[lpbonomi]

Not really, I don't think this fixes my problem and I would also like to keep the other functionalities from the <Video /> component.

---

The thing is that some of the videos uploaded with <Video /> component don't have an extension in the resulting URL.

For example,

This video works: https://next-videos-ultradrop.s3.us-east-1.amazonaws.com/videos/113a27a38b7a59b0d0522e30716a89385ccd67da67cdb8582d19fed2b26a43cf.mp4

This one doesn't: https://next-videos-ultradrop.s3.us-east-1.amazonaws.com/videos/0hOSpzin-U7fDiifE0H-hnuZ4u_V_tofCJbxpqpNJCA

(Check out the extension at the end of the URL)

I think that the resulting video doesn't have an extension because the original one didn't have one either, but I can't use the same fix as in the repro repo because I can't use the <source /> tag in NextVideo.

---

I think that this could get fixed by adding an extension to the resulting URL, maybe by finding out the type of the video, or maybe allow the use of <source /> in the <Video /> component.

@luwes What do you think? I can give out a hand with this if you need

[luwes]

gotcha, yes this might be tricky because the default player is the Mux player web component and it doesn't support source elements at the moment. I'll ask the team here if we might be able to support it.

[RosarioAleCali]

Are there any updates on this? I am experiencing some issues where videos don't play on iOS (both Safari and Chrome).

I am guessing it might be related to this, although I am not sure.

Here's a separate issue I've opened: #274

@luwes @lpbonomi

[luwes]

no update yet but we are planning to add this functionality to the player. I will notify here

[RosarioAleCali]

@luwes Thanks for the update, much appreciated. Also, how likely you think this is connected to #274?

Let me know if you need more info or if I can help!

[jeffreymc2]

I'm experiencing similar issue where some mp4s despite having the file extension are throwing a "Source Not Supported" error.

[luwes]

@jeffreymc2 that's something else though. does the video still play?

[luwes]

@lpbonomi added a PR ^^ — will this do?
example at https://next-video-demo-git-fork-luwes-source-tag-mux.vercel.app/source-tag

---

alternative solution:

btw I also just remembered it's possible to verify if uploaded assets have a file extension and append one in the remote bucket key with the provider hook generateAssetKey.
https://github.com/muxinc/next-video/blob/main/src/config.ts#L48-L55