I'm hoping someone can help me out with the issue I'm having, here is a summary:
I've uploaded some ~30minute long .mp4 videos on my Google Cloud Storage. I made the bucket/objects public, and am trying to play the file like so on my website:
<video
ref={vid}
autoPlay={true}
controls={true}
>
<source src={"https://storage.googleapis.com/mybucket/file.mp4"} type={"video/mp4"} />
</video>
The video element, only plays audio and does not play the video. It looks like this: image
From what I understand, .mp4 stored anywhere on the cloud should behave like any regular .mp4 file. However this does not seem to be the case.
I'm looking for a free solution, but I have tried using Mux to stream the .mp4 file for me. This works. This leads me to believe I may need a service to stream the .mp4 files for me.
Can anyone help? I'd rather not use Mux. Is there anyway to directly stream the .mp4 from my google cloud without an extra service? Or is there another cloud storage service that I can use that may allow this? I have roughly ~50gb of personal videos.
Any help is greatly appreciated, thank you.
The problem with the .mp4 files were that they were not optimized for the web. Link to the root cause explanation & solution can be found here : HTML5 - How to stream large .mp4 files?
