Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Question]: Serving MPEG-DASH Stream and Building a Frontend App for Real-Time Streaming #424

Open
4 tasks done
Praveenstein opened this issue Oct 30, 2024 · 1 comment
Open
4 tasks done
Labels
COMMUNITY HELP REQ 🆘 Community Help Needed for this Issue/PR QUESTION ❓ User asked about the working/usage of VidGear APIs.

Comments

@Praveenstein
Copy link

Praveenstein commented Oct 30, 2024

Issue guidelines

Issue Checklist

  • I have searched open or closed issues for my problem and found nothing related or helpful.
  • I have read the Documentation and found nothing related to my problem.
  • I have gone through the Bonus Examples and FAQs and found nothing related or helpful.

Describe your Question

I'm using VidGear to generate an MPEG-DASH stream and save it to a local file. I've successfully created the dash_out.mpd file and chunks, but I'm unsure how to serve this stream and build a frontend app to stream it in real-time.

Here's my Python code for generating the stream:

from vidgear.gears import CamGear
from vidgear.gears import StreamGear
import cv2

print("Setting input source.")
# open any valid video stream(from web-camera attached at index `0`)
stream = CamGear(source=0).start()

ffmpeg_path = r"C:\ps-ust\codes\pycharm\videgear\main\external_services\ffmpeg"

# enable livestreaming and retrieve framerate from CamGear Stream and
# pass it as `-input_framerate` parameter for controlled framerate
stream_params = {"-input_framerate": stream.framerate, "-livestream": True,
                 "-ffmpeg_download_path": ffmpeg_path, "-clear_prev_assets": True,
                 "-vcodec": "libx264"}

output_path = r"C:\ps-ust\codes\pycharm\videgear\main\output\live_stream_chunks\dash_out.mpd"

print("creating streamer.")
# describe a suitable manifest-file location/name
streamer = StreamGear(output=output_path, **stream_params)
print("Done.")
# loop over
while True:
    print("Reading Frame")
    # read frames from stream
    frame = stream.read()

    # check for frame if Nonetype
    if frame is None:
        break

    # {do something with the frame here}

    # send frame to streamer
    streamer.stream(frame)

    # Show output window
    # cv2.imshow("Output Frame", frame)

    # check for 'q' key if pressed
    key = cv2.waitKey(1) & 0xFF
    if key == ord("q"):
        break

# close output window
cv2.destroyAllWindows()

# safely close video stream
stream.stop()

# safely close streamer
streamer.close()

I've also created a sample index.html file using Dash.js to play the stream:

<html>
<head>
    <title>Dash.js Rocks</title>
    <style>
        video {
            width: 640px;
            height: 360px;
        }
    </style>
</head>
<body>
<div>
    <video id="videoPlayer" controls></video>
</div>
<script src="http://cdn.dashjs.org/latest/dash.all.min.js"></script>
<script>
    (function () {
        var url = "http://localhost:8000/dash_out.mpd";
        var player = dashjs.MediaPlayer().create();
        player.initialize(document.querySelector("#videoPlayer"), url, true);
    })();
</script>
</body>
</html>

However, I'm not sure how to serve the stream and make it accessible to the frontend app. I've tried using http.server to serve the files, but I'm not sure if this is the correct approach.

Can someone please guide me on how to serve the MPEG-DASH stream and build a frontend app to stream it in real-time? I'm new to MPEG-DASH streaming, and any help would be greatly appreciated.

Expected Answer:

I'm looking for guidance on how to serve the MPEG-DASH stream and build a frontend app to stream it in real-time. Specifically, I'd like to know:

How to serve the dash_out.mpd file and chunks using a web server (e.g., http.server, Nginx, Apache).
How to configure the frontend app to access the stream and play it in real-time.
Any additional considerations or best practices for building a real-time streaming app using MPEG-DASH.

Terminal log output(Optional)

No response

Python Code(Optional)

No response

VidGear Version

0.3.3

Python version

3.8

Operating System version

windows

Any other Relevant Information?

No response

@Praveenstein Praveenstein added the QUESTION ❓ User asked about the working/usage of VidGear APIs. label Oct 30, 2024
Copy link

welcome bot commented Oct 30, 2024

Thanks for opening this issue, a maintainer will get back to you shortly!

In the meantime:

  • Read our Issue Guidelines, and update your issue accordingly. Please note that your issue will be fixed much faster if you spend about half an hour preparing it, including the exact reproduction steps and a demo.
  • Go comprehensively through our dedicated FAQ & Troubleshooting section.
  • For any quick questions and typos, please refrain from opening an issue, as you can reach us on Gitter community channel.

@abhiTronix abhiTronix added the COMMUNITY HELP REQ 🆘 Community Help Needed for this Issue/PR label Nov 13, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
COMMUNITY HELP REQ 🆘 Community Help Needed for this Issue/PR QUESTION ❓ User asked about the working/usage of VidGear APIs.
Projects
None yet
Development

No branches or pull requests

2 participants