Man this is pretty cool, thanks Abdi!! Keep it up Since the videoSize is unlikely to change, I would move the call to obtain the statsSync outside the /video endpoint.
Im on a mission to build one as well but have no clue to go about it.. Im currently debating whether or not I should set up my own server or piggyback off of something like a Soundcloud. Would you kindly please share your journey so far?
I don't know why you don't do more videos like this. By just watching stuff like this people learn a lot and what might seem easy and obvious to you is pretty obscure to many of us. Thank you for this nice little presentation , It was very informative. But please, could we have more ?
Nice video, I'm a front end developer and I was contacted by a streaming company to have a chat, they offered my a position and I have to learn all this stuff as soon as posible :)
Congratulations for this simple but very helpful video. I got a question: when you skipt to a specific point of the video, the intermediate chunks are downloaded too or not? Thanks and hello from Brazil!
Thank you for this tutorial, it is very cool and practical, we can let everyone access the server to see the video; I have a request, how do we send webcam video stream to server and let everyone views like youtube live stream ? It would be awesome if you can make such a tutorial and I think everyone wants to know how to achieve it !!!
If I use fetch get request to get the video then where should I include ranges. When I include in header the subsequent requests shows 401 because of authentication middleware
Great tutorial, thanks. How would this work in practice, though? The video blobs will presumably reside on S3/GCS/whatever. When a request for a video comes in, surely the server wouldn't fetch the whole video and keep it in memory, while serving chunks of it? Would it prefetch chunks of the video from blob storage and serve that until the next chunk is required? Or would the server containers somehow connect to a huge local storage area network with all the videos?
Good question! In practice this method should not be used ;) When I made the video it was kind of an experiment and I didn't know much about best practices.
@@abdicodes Hey man! Do you have a video with those "best practices" available anywhere? O really enjoyed the video and I'd also like to know how should I be implementing these "the correct way". Thanks!!
@@abdicodes in my case I have videos downloaded from the internet some of them are 23fps and those loose sync when streaming. But the other videos at 30fps are fine
hey bro i need you help please do reply i am trying to stream multiple videos from local storage but i am unable to read the local storage folder used readdir, readfile non of those work is i try to read the files in folder but when i do like you did it works because it is directly reading main file but i am trying to access folder and files within that folder plssssss do reply i am egarly waiting for your reply
What i did notice, after a while the audio is not sync with the video. The audio will have a delay bigger and bigger. If you pause and replay the audio will be resync.
Your video is really interesting . I have a challenge in this . I am downloading the file from a FTP location and the the received file is in the form of a stream . How to send that stream as chunks without storing the ftp received file in the local system ?
Is there a way that you can build a small web app (frontend UI - html, css, javacript) that plays a video playlist just by drag and drop and use node.js as backend server). Something like a lighter version of Caspar CG for broadcasting. You would kill with views on a youtube video like that.
Hey can someone explain how to solve this with ffmpeg (fluent-ffmpeg library)? I need it to (on-the-fly) transcode the video if the browser/final device does not support the codecs Everything i try wont play the video correctly :c
Hey I wanted ask but in containerized environments the video will not be on localhost, so what would be the ideal place to story them would s3 make sense ?.
Hmm... How's this working? I don't see that we're sending any "range" in our request. When I tried to implement it, it went to the "if(!range)" in index.js and got that "Requires Range Header".
Great tutorial Abdi. It would be helpful if you can also highlight how do we elevate this concept to streaming cloud storage contents i.e google cloud storage, aws s3.
Hey I really did the clear explanation of both the overview and the line-by-line code. And such a simple code to illustrate the point. From the figure you have at 1:10, the two-way arrows got me wondering: how could we send recorded video from a client to the server in the same kind of bit-by-bit stream? I've build a client-side page that records video that I can then send to a server, but am looking to speed up the process and avoid saving anything client-side. Any ideas? Cheers!
Hi there, thanks for the video! Im trying to build an audio streaming site but have no clue how to go about it.. Im currently debating whether or not I should set up my own server or piggyback off of something like a Soundcloud as an example. Would you kindly please share any tips for this kind of approach?
Man this is pretty cool, thanks Abdi!! Keep it up
Since the videoSize is unlikely to change, I would move the call to obtain the statsSync outside the /video endpoint.
I’m happy you liked it! I’m a fan of your channel 😄 And that makes a lot of sense, thanks for the feedback!
oh wow, I'm a big fan Hussein ❤
use stat method
But what if this method is fetching the video dynamically.?
this feels like a PR comment from senior engineer 😂
You know I have no idea who you are but just from that introduction I can already tell you'll have 100K subs within the next year
One month later and he's 10% of the way. He's ahead of schedule xD
Looks like this won't happen
@@ShahriyarAlam1 it will happen
@@ShahriyarAlam1 he just stopped uploading videos
Bruh
I'm trying to build an audio streaming server instead, and this is helping me get the blocks I need to piece things together.
Thanks Abdi!
Im on a mission to build one as well but have no clue to go about it.. Im currently debating whether or not I should set up my own server or piggyback off of something like a Soundcloud.
Would you kindly please share your journey so far?
I don't know why you don't do more videos like this. By just watching stuff like this people learn a lot and what might seem easy and obvious to you is pretty obscure to many of us. Thank you for this nice little presentation , It was very informative. But please, could we have more ?
That is because he really don't know what he's doing. he's just copy pasting a tutorial
Nice video, I'm a front end developer and I was contacted by a streaming company to have a chat, they offered my a position and I have to learn all this stuff as soon as posible :)
This is Netflix's architecture. Love to see this Abdi!
Very clear and easy to understand explanation, thanks so much Abdi!
Great explanation with the pros and cons, and especially the introduction. Keep going brother!
very cool and I like the way you walk through the video explaining all of the parts. Thanks
Extremely informative and straightforward. Thank you.
You've earned yourself another subscriber. Awesome tutorial!
Man oh man!! Thank you! I will be waiting for more such content from you.
you explained everything so clearly, loved it
Thanks, dude, for showing me how to stream video. It also gave me the motivation to pay attention to http headers.
They are super important! Happy to have helped :)
Thank you man, very well explained, with all the details and very good English!
that was the most clear description,thanks
You deserve more subscribers buddy!!
Great Video! Hope to see more content! Young and Talented!
Thank you brother. I will try this out. I look forward to more tutorials
Keep it up! Good Work Buddy...Very Helpful
Thanks! 😁
This is really good! Keep going!
Amazing 🔥 content ..... This channel is so underrated
Thanks for the simple but useful video
Glad it was helpful!
This was amazing for clearing basics.
Clear and straightforward! Thx.
Keep going bro. You’ve got good explanation
Thanks for the support!
a very cool tutorial.. Thanks mhan
It worked perfect Sir!
This is great! Exactly what I was looking for. I am curious to know how you would implement view count. Thanks so much!
you've earned a subscriber, thanks dude!
Awesome, thank you!
Congratulations for this simple but very helpful video. I got a question: when you skipt to a specific point of the video, the intermediate chunks are downloaded too or not?
Thanks and hello from Brazil!
thank you. one question, how did you do the cached refresh? you had a menu under refresh button. thanks
awesome. have subscribed.. looking forward for more videos to learn!!!
You are the best❤
I'll try to implement this in Next.js
Thank you buddy, you should do more videos like this
Really good explanation. keep it up.
Awesome tutorial ,thank you soo much ♥️♥️♥️
exactly what am I searching... 👍🏿👍🏿👍🏿
Hey man, this is really helpful. Thanks
Love you man, you're great.
Hi, can you deep dive into how pipe works and how req.headers.range is generated with new values?
Thank you for this tutorial, it is very cool and practical, we can let everyone access the server to see the video; I have a request, how do we send webcam video stream to server and let everyone views like youtube live stream ? It would be awesome if you can make such a tutorial and I think everyone wants to know how to achieve it !!!
Really helpful, Thank you so much. keep going please ...
Love you for this video!!! Instant sub
Thanks this was very helpful. Keep it up
Glad it helped! 😁
I am receiving a video stream over a TCP socket. How can I stream that video in a browser?
I don't know the length, i just need to transfer the data.
If I use fetch get request to get the video then where should I include ranges. When I include in header the subsequent requests shows 401 because of authentication middleware
Great tutorial, thanks. How would this work in practice, though? The video blobs will presumably reside on S3/GCS/whatever. When a request for a video comes in, surely the server wouldn't fetch the whole video and keep it in memory, while serving chunks of it? Would it prefetch chunks of the video from blob storage and serve that until the next chunk is required? Or would the server containers somehow connect to a huge local storage area network with all the videos?
Good question! In practice this method should not be used ;) When I made the video it was kind of an experiment and I didn't know much about best practices.
@@abdicodes Hey man! Do you have a video with those "best practices" available anywhere? O really enjoyed the video and I'd also like to know how should I be implementing these "the correct way". Thanks!!
@@abdicodes Ohh, and I just subscribed! Thanks for the content!!
@@softwarelivre2389 Take a look at HLS and MPEG-DASH those 2 are the industry standard protocols for video streaming
@@persianaz6389 thanks! I'll take a look. I ended up using WebRTC for some projects and it worked quite well
Super Awesome explanation & topic ++++++++++++++++++++++ Thank You
Great video! It helped me grasp an upcoming feature we are implementing.
Question, what tests would be applicable to write for this?
can you make a tutorial on the latter to save the video stream on front-end
hi, give me reason why videoSize - 1 and end - start + 1?
what if I want to server videos from S3 bucket using that technique?
I don't know if you tested with a longer video. But in my case after 7 minutes playing. Audio starts loosing synchronization with the video
Interesting... I'll look into this
@@abdicodes in my case I have videos downloaded from the internet some of them are 23fps and those loose sync when streaming.
But the other videos at 30fps are fine
How would one set up a code to get OBS to communicate with your node?
Hi this works, but getting error sometime saying
The value of "start" is out of range. It must be an integer. Received NaN
How to solve this?
dear bro,
how to customize youtube using code.
need is , use the same url (youtube link) after a live stream ends, (reuse).??
You are great man
hey bro i need you help please do reply i am trying to stream multiple videos from local storage but i am unable to read the local storage folder used readdir, readfile non of those work is i try to read the files in folder but when i do like you did it works because it is directly reading main file but i am trying to access folder and files within that folder plssssss do reply i am egarly waiting for your reply
Great content man
Subscribing hoping for more awesome content
Amazing tutorial, Thank you
Hi, I created an Android video streaming application but the videos take too long to load and play, what could be the problem?
this is nice
but how do i have to implement with multiple videos and getting the video URL by giving id?
thanks for the video! may i ask, why it Cannot GET /bigbuck.mp4 when i implement it on hosting (heroku)
Nice video man. Thanks a lot.
What i did notice, after a while the audio is not sync with the video. The audio will have a delay bigger and bigger. If you pause and replay the audio will be resync.
please explain about hls and how can i use that in node js
Your video is really interesting . I have a challenge in this . I am downloading the file from a FTP location and the the received file is in the form of a stream . How to send that stream as chunks without storing the ftp received file in the local system ?
Is there a way that you can build a small web app (frontend UI - html, css, javacript) that plays a video playlist just by drag and drop and use node.js as backend server). Something like a lighter version of Caspar CG for broadcasting.
You would kill with views on a youtube video like that.
Why do we set end=(start+chunkSize,vediosize-1) instead of end=(start+chunkSize,vediosize)
Is it possible to start streaming from the middle of the file and skip the beginning?
Hey can someone explain how to solve this with ffmpeg (fluent-ffmpeg library)?
I need it to (on-the-fly) transcode the video if the browser/final device does not support the codecs
Everything i try wont play the video correctly :c
Hey I wanted ask but in containerized environments the video will not be on localhost, so what would be the ideal place to story them would s3 make sense ?.
Hmm... How's this working? I don't see that we're sending any "range" in our request.
When I tried to implement it, it went to the "if(!range)" in index.js and got that "Requires Range Header".
The range request comes from putting the endpoint into the HTML5 video player! We don’t make the requests, the video player does :)
Loved it. Thanks.. I will build upon this
Cool but why was the video's name not include in the src = at 3:07? Usually that's where you'd put it.
There's no video name because /video is pointing to the nodejs server that gives the same video every time.
Great tutorial Abdi.
It would be helpful if you can also highlight how do we elevate this concept to streaming cloud storage contents i.e google cloud storage, aws s3.
Hey I really did the clear explanation of both the overview and the line-by-line code. And such a simple code to illustrate the point.
From the figure you have at 1:10, the two-way arrows got me wondering: how could we send recorded video from a client to the server in the same kind of bit-by-bit stream? I've build a client-side page that records video that I can then send to a server, but am looking to speed up the process and avoid saving anything client-side.
Any ideas? Cheers!
I think that could work! You’ve got a good idea 😁
How to make different option resolution? I mean 480p, 720p etc
Awesome video!
is it possible to have one using the dash streaming protocol
thats great bro, thank for video.
Are you using RTSP protocol for this?
Hi there, thanks for the video! Im trying to build an audio streaming site but have no clue how to go about it.. Im currently debating whether or not I should set up my own server or piggyback off of something like a Soundcloud as an example.
Would you kindly please share any tips for this kind of approach?
Please can I send individual bytes headers with php, rather than sending the whole chunk of the video to the browser.
How can we do this through a CDN like cloudflare?
great video, make some more in details videos like that
can you make a like time video streamer like a tv video which doesn't allow you to go forward or backward but steam at the same time for all people ?
Can i stream RUclips video to Facebook through this application using youtube video link??????❤️🔥👍
@AbdisalanCodes Please do a tutorial about caching when user rewinds back the already streamed part of video.
Thanks for this video!
hey, in my code, the first file chunk is repeated again and again the whole time..
can anyone tell me how to fix this??
You're so awesome!!! 😎😎😎😎
This works on the web, but how to implement this in react native .?
If i have multiple .mp4 files how to can i get it?
Hey, I am trying to deploy it on Heroku, but I couldn't see the video on another device. Any idea how to fix this?
That was really helpful, thanks
awesome !! loved it!!
This was amazing
what if we have more than one client, how do server handle more than one client at the same time? not just about video streaming but in general?