• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
Locked
0

HTTP Live streaming test in Flash Player, HTML5 player, iphone, android and other smart phones.

Participant ,
Jun 25, 2012 Jun 25, 2012

Copy link to clipboard

Copied

Hi,

Can anyone please tell me how can I play http live streaming from FMLE 3.2 to Flash player, iphone, ipdad, HTML5 player, Android and other devices?

I have tried my best to play live streaming usine FMLE 3.2 with help of "http://help.adobe.com/en_US/flashmediaserver/devguide/WSd391de4d9c7bd609-52e437a812a3725dfa0-8000.ht..." but not able to play video using HTTP.

When I tried to play url-  "http://localhost/hds-live/livepkgr/_definst_/liveevent/livestream.f4m" even in in Strobe Media Player it was showing "Buffering" that's it. But I can play same RTMP URL in Flash AS3 using the netstream very fine.

Now I want to test the livepkgr content via HTTP to Flash Player, HTML5 Player (on Web browser and smartphones), iphone and other devices.

Thanks

Best regards,

Sunil Kumar

Views

69.5K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Deleted User
Jul 02, 2012 Jul 02, 2012

I'm unable to download from thw link you've provided. But I tried a simple video playback on my end and it worked for me :

<head>

<link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet">

<script src="http://vjs.zencdn.net/c/video.js"></script>

</head>

<body>

<video id="my_video_1" class="video-js vjs-default-skin" controls

  preload="auto" width="640" height="264" poster="my_video_poster.png"

  data-setup="{}">

  <source src="http://qthttp.apple.com.edgesuite.net/1010qwoeiuryfg/sl.m3u8" type='

...

Votes

Translate

Translate
Guest
Jun 25, 2012 Jun 25, 2012

Copy link to clipboard

Copied

Can you just do a couple of checks for me?

1) Before you publish a stream please delete the streams folder under livestream and the .stream file under livestream/events/_definst_/liveevent, restart your server and then try.

2) Are the f4f fragments being created? After you publish you need to check under livepkgr/streams/_definst_/livestream (if you're publishing to livestream).

3) Instead of localhost can you just try with the server ip?

4) Also what version of FMS and Flash Player are you using?

Thanks,

Apurva

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jun 25, 2012 Jun 25, 2012

Copy link to clipboard

Copied

Hi Apurva,

Thanks a lot for your response.

4# I am using the FMS 4.5 and Flash Player version 11 and above.

Let me do it again as you suggested.

Best regards,

Sunil Kumar

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jun 25, 2012 Jun 25, 2012

Copy link to clipboard

Copied

Hi Apurva,

I did all the things what you said but still I am not able to do it. Please check the logs snapshot also for your reference.

Also f4f fragments is creating but there is no .f4m and .m3u8 files over there.

Please suggest.

FMLE_Encoding_1.pngFMLE_Logs_2.pngFMS_livepkgr_data_3.png

Best regards,

Sunil Kumar

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guest
Jun 26, 2012 Jun 26, 2012

Copy link to clipboard

Copied

Hi Sunil,

'livestream%i?adbe-live-event' is used for MBR streams, where when you publish 3 streams, FMLE publishes them as livestream1, livestream2 and livestream3. As you have only one stream selected, only livestream1 is being published. However, when you're playing back, you're playing back as livestream instead of livestream1.

Try publishing as 'livestream?adbe-live-event' and then playback using "http://localhost/hds-live/livepkgr/_definst_/liveevent/livestream.f4m".

Let me know if this solves the problem.

Thanks,

Apurva

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jun 26, 2012 Jun 26, 2012

Copy link to clipboard

Copied

Hi Apurva,

Yes you are right. But it should show the .f4m and .m3u8 file inside the foler livestream1 folder.

I have tested it with single stream also "livestream?adbe-live-event=liveevent" and it is not showing any .f4m and .m3u8 files inside the livestream folder.

Please help.

Best regards,

Sunil Kumar

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guest
Jun 26, 2012 Jun 26, 2012

Copy link to clipboard

Copied

The .f4m and .m3u8 files are created on the disk. They are generated on the fly as and when requests come to the server. You can try requesting the .f4m/.m3u8 file in your browser (not player) and verify.

Thanks,

Apurva

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jun 26, 2012 Jun 26, 2012

Copy link to clipboard

Copied

Hi Apurva,

I have checked all the methods but not able to see live video over http on

flash in web browser also. I don't know what is the miskatake I am doing.

I am sending you all the snapshot images and AS3 code also so that you can

check it thoroughly. If you are not able to download the attached files

then please download it from below location -

http://flashdivine.fav.cc/livestreaming/FMS%204.5%20issue%20with%20Http%20Live.rar

Best regards,

Sunil Kumar

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guest
Jun 26, 2012 Jun 26, 2012

Copy link to clipboard

Copied

Hi Sunil,

Sorry typo in my previous message. .f4m and .m3u8 files are NOT written on the disk. They are generated on the fly.

Let me have a look at the code you have sent and I'll get back to you.

Thanks,

Apurva

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jun 26, 2012 Jun 26, 2012

Copy link to clipboard

Copied

Hi Apurva,

No problem,

Please give me solution so that I can work further. I got stuck due to

this.

Best regards,

Sunil Kumar

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guest
Jun 26, 2012 Jun 26, 2012

Copy link to clipboard

Copied

Hi Sunil,

1) About playback - After following the steps I've mentioned above, can you publish and try to play the live stream in the Strobe Media Player. If playback is not happening can you check the Apache logs (under root_install/Apache2.2/logs) to see if any error is being logged.

2) About the client, Netstream class is traditionally used for rtmp playback. Netstream.play() cannot directly be used to play HTTP streams. I'll investigate and see how you can do this but, I would suggest you use the Spark VideoPlayer available in Adobe Flex (AS3 based). It is easy to use and gives you advanced functionalities. You can download Flex from here (http://www.adobe.com/devnet/flex.html). You can find more information about the VideoPlayer here (http://help.adobe.com/en_US/flex/using/WSc78f87379113c38b-669905c51221a3b97af-8000.html)

Hope this helps.

Thanks,

Apurva

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jun 26, 2012 Jun 26, 2012

Copy link to clipboard

Copied

Hi Apurva,

I have checkd in Strobe Media player also and found it is showing "Buffering.." but not playing. As you told me to see error logs so please find the error logs below -

[Tue Jun 26 16:20:19 2012] [info] mod_unique_id: using ip addr 178.12.0.15

[Tue Jun 26 16:20:20 2012] [info] mod_jithttp - FMS installation path: "C:/Program Files/Adobe/Flash Media Server 4.5/"

[Tue Jun 26 16:20:20 2012] [info] mod_unique_id: using ip addr 178.12.0.15

[Tue Jun 26 16:20:21 2012] [notice] Digest: generating secret for digest authentication ...

[Tue Jun 26 16:20:21 2012] [notice] Digest: done

[Tue Jun 26 16:20:21 2012] [notice] Apache/2.2.17 (Win32) DAV/2 configured -- resuming normal operations

[Tue Jun 26 16:20:21 2012] [notice] Server built: Oct 18 2010 01:58:12

[Tue Jun 26 16:20:21 2012] [notice] Parent: Created child process 3816

[Tue Jun 26 16:20:21 2012] [info] mod_jithttp - FMS installation path: "C:/Program Files/Adobe/Flash Media Server 4.5/"

[Tue Jun 26 16:20:21 2012] [info] mod_unique_id: using ip addr 178.12.0.15

[Tue Jun 26 16:20:22 2012] [info] mod_jithttp - FMS installation path: "C:/Program Files/Adobe/Flash Media Server 4.5/"

[Tue Jun 26 16:20:22 2012] [info] mod_unique_id: using ip addr 178.12.0.15

[Tue Jun 26 16:20:23 2012] [notice] Digest: generating secret for digest authentication ...

[Tue Jun 26 16:20:23 2012] [notice] Digest: done

[Tue Jun 26 16:20:23 2012] [notice] Child 3816: Child process is running

[Tue Jun 26 16:20:23 2012] [info] Parent: Duplicating socket 268 and sending it to child process 3816

[Tue Jun 26 16:20:23 2012] [notice] Child 3816: Acquired the start mutex.

[Tue Jun 26 16:20:23 2012] [notice] Child 3816: Starting 250 worker threads.

[Tue Jun 26 16:20:23 2012] [notice] Child 3816: Starting thread to listen on port 8134.

Please check the above logs.

Regarding using the "Spark VideoPlayer" I will use it but are you sure it will play my live streaming video *.f4m video? I know *.f4v is mp4 codec and it is working very well using the NetStream class in Flash AS3 and as you gave me the URL for Spark Video Player they have used *.f4v video as a sample.

Humble request you you to please find out the best solution and give me that. Because I am not satisfied with any one of your answer because most of the things I have already done it. 

Best regards,

Sunil Kumar

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guest
Jun 26, 2012 Jun 26, 2012

Copy link to clipboard

Copied

Hi Sunil,

 

It's difficult to debug an issue when you don't have access to the machine and you can't see what's happening, so I request you to please have a little patience.

For playback just check the following steps and make sure if you have followed them :

1) Delete the streams folder and any .stream file in the livepkgr

2) Restart FMS

3) Make sure you have a crossdomain.xml under root_install/webroot

4) Publish a stream from FMLE as 'livestream?adbe-live-event=liveevent'

5) Use this player to playback the stream : http://osmf.org/dev/2.0gm/StrobeMediaPlayback.html?src=http://<your-ip>/hds-live/livepkgr/_definst_/liveevent/livestream.f4m

If there is no playback, here are some checks you can do :

1) Request for the http://<your-ip>/hds-live/livepkgr/_definst_/liveevent/livestream.f4m in your browser. You should receive an xml that looks something like this :

<?xml version="1.0" encoding="UTF-8" ?>

     <manifest xmlns="http://ns.adobe.com/f4m/1.0">

          <id>livepkgr/events/_definst_/liveevent</id>

                  <mimeType />

          <streamType>live</streamType>

          <duration>0</duration>

          <bootstrapInfo profile="named" url="../../../streams/livepkgr/events/_definst_/liveevent/livestream.bootstrap" id="bootstrap7158" />

          <media streamId="livestream" url="../../../streams/livepkgr/events/_definst_/liveevent/livestream" bootstrapInfoId="bootstrap7158">  

                      <metadata>AgAKb25NZXRhRGF0YQgAAAAAAAhkdXJhdGlvbgBAJUUeuFHrhQAFd2lkdGgAQHQAAAAAAA=</metadata>

            </media>

</manifest>

2) Check the access log under Apache to see if the .f4m, .bootstrap and Frag files have been requested and delivered. If a particular entry has a status code of 200 then the file has been served by FMS. You can confirm the same on the client side using a software like fiddler.

Coming to the player issue, a playback of *f4v via the vod directive is a progressive download, whereas playback of an *f4m file via hds-vod is HTTP streaming. 

I have personally used Spark VideoPlayer and hence suggested the same.

You need to add a component like :

<s:VideoPlayer width="100%" height="30%" chromeColor="#CCCCCC" color="#000000"

                 fontSize="12"

                 source="http://<your-ip>/hds-live/livepkgr/_definst_/liveevent/livestream.f4m"

                    symbolColor="#000000"/>

 

Let me know if any of these suggestions help.

 

Thanks,

Apurva

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jun 26, 2012 Jun 26, 2012

Copy link to clipboard

Copied

Hi Apurva,

Thanks a lot for your help.

Let me do the steps as you mentioned and I will get back to you.

Best regards,

Sunil Kumar

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jun 26, 2012 Jun 26, 2012

Copy link to clipboard

Copied

Hi Apurva,

Thanka a lot for your kind co-operation. Finally I can play the .f4m video in "

http://osmf.org/dev/2.0gm/StrobeMediaPlayback.html?src=http://<your-ip>/hds-live/livepkgr/_definst_/liveevent/livestream.f4m"

But same time when I am trying the video in embeded video player in local page it is not working. But it is helpful for me as of now.

Second we have to test the same in HTML5 and iphone.

Can you please suggest me how can I do that? I am using the videojs.com open source HTML5 player. Please suggest me for HTML5, Android and iphone.

Many thanks for your help.

Best regards,

Sunil Kumar

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guest
Jun 26, 2012 Jun 26, 2012

Copy link to clipboard

Copied

Hi Sunil,

Gald to hear that the playback is working

Coming to the VideoPlayer, can you tell me what is the problem you're facing?

If you have flex builder, then just open a new project and add this in the mxml file :

<?xml version="1.0" encoding="utf-8"?>

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

                                 xmlns:s="library://ns.adobe.com/flex/spark"

                                 xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">

          <fx:Declarations>

                    <!-- Place non-visual elements (e.g., services, value objects) here -->

          </fx:Declarations>

          <s:VideoPlayer   source="http://server-ip/hds-live/liveevent/_definst_/liveevent/livestream.f4m"/>

</s:Application>

Just this much is enough to create a VideoPlayer and playback the stream. You can then add functionality as you require. Let me know if this helps.

On iPhone you need to use a HLS stream. For the same stream being published (as this is an unencrypted stream), make a request as so in your Safari browser on iPhone :

http://server-ip/hls-live/livepkgr/_definst_/liveevent/livestream.m3u8

For Android you can compile a simple player for AIR in flex builder and then check playback with that.

Thanks,

Apurva

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jul 02, 2012 Jul 02, 2012

Copy link to clipboard

Copied

Hi Apurva,

Thanks a lot for your help. It is working now as expected in Strobe Media Player. Can you please tell me how can I play this video in HTML5 individual player?

Please suggest me and if would be better if you can give me any sample code.

Best regards,

Sunil Kumar

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guest
Jul 02, 2012 Jul 02, 2012

Copy link to clipboard

Copied

You can play HTTP Live Streaming (HLS) in HTML 5 by creating a HTML page witha  video tag pointing to the m3u8. Something like this :

<video src="http://,your-ip>/hls-live/livepkgr/_definst_/livestream/livestream.m3u8" controls autoplay height="640" width="360">

Hope this helps.

Thanks,

Apurva

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jul 02, 2012 Jul 02, 2012

Copy link to clipboard

Copied

I have tried this but video not playing. Instead of play it gives me option

to download the video.

Please suggest.

Best regards,

Sunil Kumar

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guest
Jul 02, 2012 Jul 02, 2012

Copy link to clipboard

Copied

Can you give me the piece of code you're using?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jul 02, 2012 Jul 02, 2012

Copy link to clipboard

Copied

Yes,

please dowload the complete set from - http://flashdivine.fav.cc/personal/video-js.rar

<!DOCTYPE html>

<html>

<head>

  <title>Video.js | HTML5 Video Player</title>

  <!-- Chang URLs to wherever Video.js files will be hosted -->

  <link href="video-js.css" rel="stylesheet" type="text/css">

  <!-- video.js must be in the <head> for older IEs to work. -->

  <script src="video.js"></script>

  <!-- Unless using the CDN hosted version, update the URL to the Flash SWF -->

  <script>

    _V_.options.flash.swf = "video-js.swf";

  </script>

</head>

<body>

  <video id="example_video_1" class="video-js vjs-default-skin" controls preload="none" width="640" height="264"

      poster="http://video-js.zencoder.com/oceans-clip.png"

      data-setup="{}">

    <source src="http://qthttp.apple.com.edgesuite.net/1010qwoeiuryfg/sl.m3u8" type='video/mp4' />

    <!-- <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />  Working fine  -->

    <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />

    <track kind="captions" src="captions.vtt" srclang="en" label="English" />

  </video>

</body>

</html>

Best regards,

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guest
Jul 02, 2012 Jul 02, 2012

Copy link to clipboard

Copied

I'm unable to download from thw link you've provided. But I tried a simple video playback on my end and it worked for me :

<head>

<link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet">

<script src="http://vjs.zencdn.net/c/video.js"></script>

</head>

<body>

<video id="my_video_1" class="video-js vjs-default-skin" controls

  preload="auto" width="640" height="264" poster="my_video_poster.png"

  data-setup="{}">

  <source src="http://qthttp.apple.com.edgesuite.net/1010qwoeiuryfg/sl.m3u8" type='video/mp4'>

</video>

</body>

Please try this and let me know if it works for you.

Thanks,

Apurva

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jul 02, 2012 Jul 02, 2012

Copy link to clipboard

Copied

Same code I am added in html page but it is not working at my end. Can you please check this link also if it is working at your end.

http://flashdivine.fav.cc/personal/video-js/index.html

Please suggest which browser you are using in pc?

Best regards,

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guest
Jul 02, 2012 Jul 02, 2012

Copy link to clipboard

Copied

I checked on the Sfari browser on the iPad 2. Because this is HTTP Live Streaming (HLS), it'll only playback on an iOS machine (MAC desktop or an iOS device).

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jul 02, 2012 Jul 02, 2012

Copy link to clipboard

Copied

Ohh!

I was checking it in Windows safari browser. Can you give me any emulator for windows where I can check this?

Best regards,

Sunil Kumar

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines