Error: net::ERR_SSL_PROTOCOL_ERROR when playing upload video in React component

As per the title, I’m uploading a video file using React Hooks. Then, I’m trying using to use video-react package to visualize the uploaded video.

The video visualizer works properly if no video is provided, which just default to this source https://media.w3.org/2010/05/sintel/trailer_hd.mp4 as in the official documentation.

However, when I update the Player's src property with the uploaded video & I click on the play button, I get this error in the dev console:

GET https://localhost:3000/video1.mp4 net::ERR_SSL_PROTOCOL_ERROR

This is my code:

import { Player } from 'video-react';
import  React, { useState } from 'react';

const App = () => {
  const [video, setVideo] = useState('');

  const handleUpload = e => setVideo(e.target.files[0]);

  return (
    <div className="App">
      <h1>Video Visualizer</h1>
      <input type="file" name="file" onChange={handleUpload} />

      <Player
        playsInline
        poster="/assets/poster.png"
        src={ video ? `https://localhost:3000/${video.name}` : "https://media.w3.org/2010/05/sintel/trailer_hd.mp4" }
      />
    </div>
  );
}

export default App;