HLS Vertical Video Doesn't Rotate

Our app is recording video from an iPhone and using ffmpeg to create a HLS stream. We then playback the stream using AVPlayer on iOS. When we record "vertical" (portrait) video, we notice that the stream plays back incorrectly. However, if we point AVPlayer directly at the fMP4, it plays back correctly.


We can see the rotation metadata in the fMP4 itself, so it makes sense that direct playback works as-expected. It seems that using the HLS playback path ignores this same metadata. Is that correct? In the meantime, we're programmatically rotating the player to accommodate.


Here's a screen recording of the simulator playing back both versions. It's easy to see the issue: https://drive.google.com/file/d/1szeIcGFM7qL4IlB3vpKLbLTR9GRkq_4o/view?usp=sharing


Here's a link to the extremely basic Xcode project in that example: https://drive.google.com/open?id=1zuZ0IzxjFw606fBNpsNW3hWIe2GTTGmy


And here are the URLs to the media:



The playlist.m3u8 points to the same video.mp4 that is played directly.


Does anyone know if this is expected? Or is there another option/setting that we're missing?


Thanks.

Replies

Anyone have thoughts or recommendations on this issue? We've noticed that rotating the video player also rotates the subtitles, which isn't ideal.

I have a similar requirement. Video originates from webrtc on an iphone, goes to Ant Media server where its turned into HLS video. Using video.js for the player on a webapp.

Safari 13.1.1 on Mac and latest public Safari on iPhone both show vertical video as vertically letterboxed video in a horizontal view.

Chrome on Mac shows it properly as vertical video. Also shows landscape video properly as landscape (horizontal) video

I can force Safari to show it as vertical video by setting the video.js aspectRatio parameter to 9:16 But I need to be able to switch it based on the input video.

What is the proper way to do this?

You might get a more direct answer if you file a bug and include a sample of the content you're trying to use.
I have filed a bug for this issue here:

https://bugs.webkit.org/show_bug.cgi?id=222781