title: Converting local mp4 file to fileURL for video-react
body: <p>Using the video react library to play a local mp4 video, I saw someone use this function to set a selected video file to a url and they said it works. I can select the video file but it doesn't seem to work, my Player is still black screened and unplayable.</p>
  
  <p>Input is where you select the file, then it runs the function, then you use the videoFileURL from the function for the Player</p>
  
  <pre><code>import React, { Component } from "react";
  import "./App.css";
  import "../node_modules/video-react/dist/video-react.css";
  import { Player } from "video-react";
  
  class App extends Component {
    render() {
      return (
        &lt;div className="App"&gt;
          &lt;link rel="stylesheet" href="/css/video-react.css" /&gt;
  
  
          &lt;form id="videoFile"&gt;
            &lt;input
              type="file"
              name="video"
              multiple="false"
              onChange={e =&gt; {
                this.handleVideoLoad(e);
              }}
            /&gt;
          &lt;/form&gt;
  
  
          &lt;Player
            playsInline
            src={this.videoFileURL}
            fluid={false}
            width={480}
            height={272}
          /&gt;
  
        &lt;/div&gt;
      );
    }
  
    handleVideoLoad(e) {
      console.log(e.target.files);
      let files = e.target.files;
      if (files.length === 1) {
        let file = files[0];
        this.setState({
          videoFileURL: URL.createObjectURL(file),
          videoFileObject: file
        });
      }
    }
  }
  
  export default App;
  </code></pre>