Jump to content
  • 0

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


Im
 Share

Question

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.



1669319120_AutoGeneratedInlineImage1.jpg.6727d23cf7469bb2f7bfe53c1ff05123.jpg

Link to comment
Share on other sites

  • Answers 3
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Posted Images

3 answers to this question

Recommended Posts

  • 0

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

Link to comment
Share on other sites

  • 0

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

 

 

pic.png.4cb19078671c5aa646638e862354a587.png

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share


×
×
  • Create New...