VicMoore 564 Posted March 3, 2021 Share Posted March 3, 2021 I have built a simple Emby client in Javascript to teach myself the Emby APIs. I am having trouble with the HLS api when using the HTTP5 video tag. I think my problem is in selecting the right codexs and other parameters. Has anyone successfully used the HLS api with the HTTP5 Video tag? If so then what options did you select? Link to comment Share on other sites More sharing options...
Luke 37119 Posted March 3, 2021 Share Posted March 3, 2021 Hi there, what have you done so far? Link to comment Share on other sites More sharing options...
VicMoore 564 Posted March 4, 2021 Author Share Posted March 4, 2021 Luke, I programmed a simple Emby client in javascript and jQuery that uses the Emby API. It allows you to pick a user from a pulldown list and then displays the views for that user. These are displayed in a similar format to your web implementation. From the view "movies", "tvshows", etc you can select a view for the app to display. The app will fetch all of the elements in that view. For example, for movies it fetches all of the movies. Again the visual display borrows from your design of the web app. If you chose tvshows then the various TV series are displayed. When you select a series the Seasons for that series are displayed. All of the displays use images. When a movie or an episode are selected they are played by either the native html5 tag or by video.js. At any time another image can be clicked to stop the current movie playing and starting another. With this app you can browse the Emby library and select a video or tv episode to play. Including comments and blank lines the code is only 600 lines of code. It all runs in a browser and it manipulates the DOM directly. My problem is getting the HTML video tag to work properly. I am also having problems with the Emby HLS stream stopping after segments have been lost. My client and your HLS server try to resole the problem and this works until my client fails repeatedly to get a segment from the Emby API. Then it stops playing the video. This client also has a debug mode that lets you see what the API is providing. It allows me to see what's going on and what name:value pairs are provided by each API. This is how I learned how the API works. To complete this work I need some help with a video player for the HLS format. Vic Link to comment Share on other sites More sharing options...
VicMoore 564 Posted March 4, 2021 Author Share Posted March 4, 2021 Luke, below are a couple of pictures that should help my explanation above. They also show the error messages I am receiving when playing a video. vic Link to comment Share on other sites More sharing options...
VicMoore 564 Posted March 5, 2021 Author Share Posted March 5, 2021 Luke, below are a couple of pictures that should help my explanation above. They also show the error messages I am receiving when playing a video. vic Link to comment Share on other sites More sharing options...
VicMoore 564 Posted March 5, 2021 Author Share Posted March 5, 2021 I put in more debug code to monitor what the HLS is doing. The playlist is received from EMBy and parsed OK. The first three video segments are fetched and buffered and playback begins. For several minutes media segments are fetched, buffered and played without incident. However, soon the active play point in the buffer approaches the end of the buffer and this triggers the fetching of more media segments from Emby to fill the buffer, which allows video playback to continue. At this point Emby starts returning HTTP 404 errors. In HLS this is a "BUFFER_STALLED_ERROR." The HTTP request is formatted properly and the URL for the segment is correct. Sometime Emby returns the segment when asked a second time. Sometimes it does not. Repeated refusals cause my video playback to terminate. Luke, am I the only one having problems with the HLS API? I don't think the HLS server is working properly. Of course, these words are from the mouth of a novice and may be worth nothing. I need your advice and wisdom. Vic Link to comment Share on other sites More sharing options...
Luke 37119 Posted March 6, 2021 Share Posted March 6, 2021 I would compare your url to what the web app uses. Link to comment Share on other sites More sharing options...
VicMoore 564 Posted March 6, 2021 Author Share Posted March 6, 2021 Good morning Luke... Below are two URLs. The first is from the Emby Web App. The second was created by the swagger HLS API. The syntax of the second URL is what I have been using to play videos with HLS (more specifically hls.js). The Web app uses a different syntax. It doesn't fetch a m3u8 playlist and then fetch media segments from that playlist. It uses a device id and a session. I noticed that the web app also had different name/value pairs from the Swagger URL. So I copied those name/value pairs into the swagger URL and played the video through HLS again. The same problem occurred. The server on occasion returned a 404 error which stalls the HLS playback buffer. If HLS can not recover from the 404 before the end of the queue is reached then the video stops playing. Sometimes HLS can recover from this, but not consistently and it always interrupts the video. Luke, I know how to get all of the Device ids via the API. What I don't know how to do is to get the Device id of the browser that I am currently using. Could you please tell me how to do that. If I could get my device id and a session then I could try using the same technique being used by the web app. Vic // http://192.168.1.201:8096/emby/videos/739331/hls1/main/21.ts?DeviceId=4f906551-90fb-400f-9744-353054c5da02&MediaSourceId=d0a840f9c25598306adcc54032555788&PlaySessionId=606bc4c60459403bbb1762ea434bc7c0&api_key=3f93ef5c2eb142a4b91549f5f5c19a82&VideoCodec=h264&AudioCodec=mp3,aac&VideoBitrate=139808000&AudioBitrate=192000&AudioStreamIndex=1&SubtitleMethod=Encode&TranscodingMaxAudioChannels=2&SegmentContainer=ts&MinSegments=1&BreakOnNonKeyFrames=True&ManifestSubtitles=vtt&h264-profile=high,main,baseline,constrainedbaseline,high10&h264-level=52&TranscodeReasons=AudioCodecNotSupported // http://192.168.1.201:8096/emby/Videos/739331/live.m3u8?Container=ts&MaxAudioChannels=2&api_key=459bb6b548f84bd7a4786ba92349a1f2 Link to comment Share on other sites More sharing options...
VicMoore 564 Posted March 6, 2021 Author Share Posted March 6, 2021 my HLS.js fetching a segment Request URL: http://192.168.1.201:8096/emby/Videos/739331/live.m3u8?VideoCodec=h264&AudioCodec=mp3,aac&VideoBitrate=139808000&AudioBitrate=192000&AudioStreamIndex=1&SubtitleMethod=Encode&TranscodingMaxAudioChannels=2&SegmentContainer=ts&MinSegments=1&BreakOnNonKeyFrames=True&ManifestSubtitles=vtt&h264-profile=high,main,baseline,constrainedbaseline,high10&h264-level=52&api_key=2bac89852b194917b69b48a31d06f4c0 Request Method: GET Status Code: 200 OK Remote Address: 192.168.1.201:8096 Referrer Policy: strict-origin-when-cross-origin Access-Control-Allow-Headers: Accept, Accept-Language, Authorization, Cache-Control, Content-Disposition, Content-Encoding, Content-Language, Content-Length, Content-MD5, Content-Range, Content-Type, Date, Host, If-Match, If-Modified-Since, If-None-Match, If-Unmodified-Since, Origin, OriginToken, Pragma, Range, Slug, Transfer-Encoding, Want-Digest, X-MediaBrowser-Token, X-Emby-Token, X-Emby-Client, X-Emby-Client-Version, X-Emby-Device-Id, X-Emby-Device-Name, X-Emby-Authorization Access-Control-Allow-Methods: GET, POST, PUT, DELETE, PATCH, OPTIONS Access-Control-Allow-Origin: * Content-Length: 7438 Content-Type: application/x-mpegURL Date: Sat, 06 Mar 2021 17:04:28 GMT Expires: -1 Server: UPnP/1.0 DLNADOC/1.50 Accept: */* Accept-Encoding: gzip, deflate Accept-Language: en-US,en;q=0.9 Connection: keep-alive Host: 192.168.1.201:8096 Origin: null User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.190 Safari/537.36 VideoCodec: h264 AudioCodec: mp3,aac VideoBitrate: 139808000 AudioBitrate: 192000 AudioStreamIndex: 1 SubtitleMethod: Encode TranscodingMaxAudioChannels: 2 SegmentContainer: ts MinSegments: 1 BreakOnNonKeyFrames: True ManifestSubtitles: vtt h264-profile: high,main,baseline,constrainedbaseline,high10 h264-level: 52 api_key: 2bac89852b194917b69b48a31d06f4c0 my HLS.js requesting but not getting a segment - 404 error Request URL: http://192.168.1.201:8096/emby/Videos/739331/hls/X8824CC/X8824CC_15.ts Request Method: GET Status Code: 404 Not Found Remote Address: 192.168.1.201:8096 Referrer Policy: strict-origin-when-cross-origin Access-Control-Allow-Origin: * Content-Length: 54 Content-Type: text/html Date: Sat, 06 Mar 2021 17:04:46 GMT Server: Kestrel Accept: */* Accept-Encoding: gzip, deflate Accept-Language: en-US,en;q=0.9 Connection: keep-alive Host: 192.168.1.201:8096 Origin: null User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.190 Safari/537.36 Emby Web-app requesting a segment of video - (not via hls) Request URL: http://192.168.1.201:8096/emby/videos/739331/hls1/main/24.ts?DeviceId=4f906551-90fb-400f-9744-353054c5da02&MediaSourceId=d0a840f9c25598306adcc54032555788&PlaySessionId=606bc4c60459403bbb1762ea434bc7c0&api_key=3f93ef5c2eb142a4b91549f5f5c19a82&VideoCodec=h264&AudioCodec=mp3,aac&VideoBitrate=139808000&AudioBitrate=192000&AudioStreamIndex=1&SubtitleMethod=Encode&TranscodingMaxAudioChannels=2&SegmentContainer=ts&MinSegments=1&BreakOnNonKeyFrames=True&ManifestSubtitles=vtt&h264-profile=high,main,baseline,constrainedbaseline,high10&h264-level=52&TranscodeReasons=AudioCodecNotSupported Request Method: GET Status Code: 200 OK Remote Address: 192.168.1.201:8096 Referrer Policy: strict-origin-when-cross-origin Accept-Ranges: bytes Access-Control-Allow-Headers: Accept, Accept-Language, Authorization, Cache-Control, Content-Disposition, Content-Encoding, Content-Language, Content-Length, Content-MD5, Content-Range, Content-Type, Date, Host, If-Match, If-Modified-Since, If-None-Match, If-Unmodified-Since, Origin, OriginToken, Pragma, Range, Slug, Transfer-Encoding, Want-Digest, X-MediaBrowser-Token, X-Emby-Token, X-Emby-Client, X-Emby-Client-Version, X-Emby-Device-Id, X-Emby-Device-Name, X-Emby-Authorization Access-Control-Allow-Methods: GET, POST, PUT, DELETE, PATCH, OPTIONS Access-Control-Allow-Origin: * Cache-Control: public Content-Length: 3966988 Content-Type: video/mp2t Date: Sat, 06 Mar 2021 16:06:21 GMT ETag: "9e7d6aaf9a23741aea5c6196a6525115" Server: UPnP/1.0 DLNADOC/1.50 Accept: */* Accept-Encoding: gzip, deflate Accept-Language: en-US,en;q=0.9 Connection: keep-alive Cookie: stay_login=1; smid=vu66HmAQpKMQFOTq9dtzJVw3sp2zyAhf4uM4Ykn2J0WEto7Opc0XOpboaDCZpDtZxRSFs2616b0Urt1L2U8g2A Host: 192.168.1.201:8096 Referer: http://192.168.1.201:8096/web/index.html User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.190 Safari/537.36 DeviceId: 4f906551-90fb-400f-9744-353054c5da02 MediaSourceId: d0a840f9c25598306adcc54032555788 PlaySessionId: 606bc4c60459403bbb1762ea434bc7c0 api_key: 3f93ef5c2eb142a4b91549f5f5c19a82 VideoCodec: h264 AudioCodec: mp3,aac VideoBitrate: 139808000 AudioBitrate: 192000 AudioStreamIndex: 1 SubtitleMethod: Encode TranscodingMaxAudioChannels: 2 SegmentContainer: ts MinSegments: 1 BreakOnNonKeyFrames: True ManifestSubtitles: vtt h264-profile: high,main,baseline,constrainedbaseline,high10 h264-level: 52 TranscodeReasons: AudioCodecNotSupported Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now