Low latency issues when using one time tokens and how to embed live stream into own website

[Im]

I am using the Enterprise Edition and previously tried the live streaming with the LiveApp application with about 2 secs of delay and have successfully embed the stream into my website using the iframe. 

Now, I am trying to use the one time token for the stream to be more secure. But unfortunately, it causes the stream to be delayed by about 10-12 secs and I am not able to embed the live stream anymore. 

I am using OBS to live stream and have followed the following configurations: https://github.com/ant-media/Ant-Media-Server/wiki/Open-Broadcaster-Software-Publishing

But all issues occurred when I am trying the one time token.

The iframe I have tried to embed with my website is:

<iframe width="560" height="315" src="//address:5080/LiveApp/play.html?name=stream_id&playOrder=hls&token=one_time_token" frameborder="0" allowfullscreen></iframe> 

But it gave the following result to my website:

It is able to stream on the ant media management page and on the html http://address:5080/LiveApp/play.html?name=stream_id&playOrder=hls&token=token  but not on the embedded website.

Before I used the one time token, embedding the live stream was successful.

So my 2 questions are:

1. How to I reduce the delay on the html link as well as the future embedded website.

2. How do I embed the live stream on my website with the iframe.

[Selim Emre]

Hi,

Thank you for the great question!

If you want to reach under 1-sec latency, you need to use WebRTC. So, you need to use this embed code -> <iframe width="560" height="315" src="//address:5080/LiveApp/play.html?name=stream_id&playOrder=webrtc&token=one_time_token" frameborder="0" allowfullscreen></iframe>

If you want to use a one-time token in your IFrame, you need to generate a token for the per viewer before requesting the IFrame HTML tag.

I hope, it's clear.

Best Regards,

Selim

[Im]

Hi Selim,

Thank you for your help on the delayed streaming issue. Your solution fixed the issue instantly. 

But can I ask what you mean by "If you want to use a one-time token in your IFrame, you need to generate a token for the per viewer before requesting the IFrame HTML tag." 

I understand that to play a stream we need to generate the token from the http://address:5080/LiveApp/rest/v2/broadcasts/stream_id/token?expireDate=1692379198&type=play hence the resulting token_id will be used in the one_time_token in the iframe (<iframe width="560" height="315" src="//address:5080/LiveApp/play.html?name=stream_id&playOrder=webrtc&token=one_time_token" frameborder="0" allowfullscreen></iframe>)

Or am I mistaken? If so, how do I generate the token for the per viewer as you suggested?

Also, for more info, I am using a Flask app using Python with the iframe:

<iframe src="http:// address  :5080/LiveApp/play.html?name= stream_id  &playOrder=webrtc&token= one_time_token  " style="border: 30; margin-left: 450px; margin-right: 450px; height: 60%; left: 50; position: absolute; top: 20; width: 50%;" frameborder="0" allowfullscreen></iframe>

Resulting in the stream not being played (as shown in pic attachment):

Regards,

Im

[Selim Emre]

Hi,

Yes, you need to call this API for every viewer before the IFrame. I think can use CURL in Php and after the CURL request result, you can call IFrame request with token parameter.

I think you can use PycURL in your Flask App in the same scenario as above.

I hope, I could help you.

Best Regards,

Selim