How to use firebase stored vidoes in reactjs

Question

I have firebase stored video link. I can download the video. But I don't know how to use to show the video in reactjs app. Can you help me?

Here is my code. how can I use that video url?

const [filedata, setFileData] = useState([]);
 
const [progress, setProgress] = useState(0);

const submitHanlder = (e) => {
e.preventDefault();
   const file = e.target[0].files[0];
   console.log(file)
   fileUpload(file);
}

const fileUpload = (file) => {
     if(!file) return;

     const storageRef =ref(storage, `/files/${file.name}`);

     const uploadTask = uploadBytesResumable(storageRef,file);
     uploadTask.on("state_changed",(snapshot) => {
       const prog = Math.round((snapshot.bytesTransferred / snapshot.totalBytes) * 100);

        setProgress(prog);
     },(err)=> console.log(err),() => {
       getDownloadURL(uploadTask.snapshot.ref).then(url => console.log(url));
     })
}

Answer 1

You can use a package like https://www.npmjs.com/package/react-player Example usage below

<ReactPlayer url='https://www.youtube.com/watch?v=ysz5S6PUM-U' />