title: How to get the Video Duration from onChange function after uploading in react.js
body: <p>I want to get the video duration from onChange function after uploading in react.js. I have shared my code in stackblitz. Link is here - <strong><a href="https://stackblitz.com/edit/react-735kqb" rel="nofollow noreferrer">Working Demo</a></strong></p>
  
  <p>I have mentioned in the code where I need to get the video duration. I need it inside onchange function's <strong>reader.onloadend</strong> portion.
  Here's my code given in the following portion:</p>
  
  <pre><code>import React, { Component } from 'react';
  import { render } from 'react-dom';
  import Hello from './Hello';
  import './style.css';
  
  class App extends Component {
    constructor() {
      super();
      this.state = {
        name: 'React',
        get_video: '',
        videoAttribute: []
      };
    }
  
    chosenVideo(e) {
          e.preventDefault();
  
          /*this.setState({
              file_state: e.target.files[0]
          });*/
  
          var file = e.target.files[0];
          var file_state = e.target;
          var reader = new FileReader();
          reader.onloadend = () =&gt; {
              this.setState({
                  get_video: reader.result,
                  videoAttribute: file_state
              });
  
        console.log("video duration"); // I want to get the video duration here
  
              console.log(reader);
          };
          reader.readAsDataURL(file);
      }
  
    render() {
  
      var isVideoPreview = '';
  
      if(this.state.get_video != '') {
        isVideoPreview = (
          &lt;video 
            type="video/swf" 
            src={this.state.get_video} 
            className="get_preview_video_class" 
            controls
          &gt;
              &lt;/video&gt;
        );
      }
  
      return (
        &lt;div&gt;
          &lt;input 
            id="upload_1006_mybataz" 
            type="file" 
            accept="video/*" 
            onChange={this.chosenVideo.bind(this)} 
          /&gt; 
          &lt;div&gt;
            {isVideoPreview}
          &lt;/div&gt;
        &lt;/div&gt;
      );
    }
  }
  
  render(&lt;App /&gt;, document.getElementById('root'));
  </code></pre>