title: How to find the size of recorded video file in expo?
body: <p>I am working with the expo. I'm using an expo-camera to record video. I'm getting the URI of the video. But I want to calculate the size of the video before I upload it (over 5MB will be banned). I can only get the URI of the video. So, how to get the size of the video? I have also done googling but didn't find any relevant answer.</p>
  <p><strong>Component File</strong></p>
  <pre><code>import React, { Component } from &quot;react&quot;;
  import { View, Text, TouchableOpacity, StyleSheet } from &quot;react-native&quot;;
  import {
    widthPercentageToDP as wp,
    heightPercentageToDP as hp,
  } from &quot;react-native-responsive-screen&quot;;
  import { Camera } from &quot;expo-camera&quot;;
  
  export default class Recordvideo extends React.Component {
  
  // Local State
    state = {
      video: null,
      picture: null,
      recording: false,
      hasPermission: null,
      setHasPermission: &quot;&quot;,
    };
  
  // Getting camera permission
   componentDidMount = async () =&gt; {
      const { status } = await Camera.requestPermissionsAsync();
      if (status === &quot;granted&quot;) {
        this.setState({ hasPermission: true });
      }
    };
  
   // Getting Video URI After Recording Completed 
  _saveVideo = async () =&gt; {
      const { video } = this.state;
      console.log(video);
      this.props.navigation.push(&quot;Post&quot;, {
        VIDEOURL: video.uri,
        VIDEOID: 1,
        mod: true,
      });
    };
  
  // Stop Recording Function
   _StopRecord = async () =&gt; {
      this.setState({ recording: false }, () =&gt; {
        this.cam.stopRecording();
      });
    };
  
  // Start Recording Function
   _StartRecord = async () =&gt; {
      if (this.cam) {
        this.setState({ recording: true }, async () =&gt; {
          const video = await this.cam.recordAsync();
          this.setState({ video });
        });
      }
    };
  
  // Toogle function for start/stop recording
    toogleRecord = () =&gt; {
      const { recording } = this.state;
  
      if (recording) {
        this._StopRecord();
      } else {
        this._StartRecord();
      }
    };
  
  // Render function
   render() {
      const { recording, video } = this.state;
      if (this.state.hasPermission === null) {
        return &lt;View /&gt;;
      }
      if (this.state.hasPermission === false) {
        return (
          &lt;View
            style={{ flex: 1, alignItems: &quot;center&quot;, justifyContent: &quot;center&quot; }}
          &gt;
            &lt;Text&gt;No access to camera&lt;/Text&gt;
          &lt;/View&gt;
        );
      }
  
     // return statement
      return (
        &lt;View style={styles.responsiveBox}&gt;
          &lt;Camera
            ref={(cam) =&gt; (this.cam = cam)}
            style={{
              justifyContent: &quot;flex-end&quot;,
              alignItems: &quot;center&quot;,
              flex: 1,
              width: &quot;100%&quot;,
            }}
          &gt;
  
  // on Completing Video button, firing _saveVideo Function
            {video &amp;&amp; (
              &lt;TouchableOpacity
                onPress={this._saveVideo}
                style={{
                  padding: 20,
                  width: &quot;100%&quot;,
                  backgroundColor: &quot;#fff&quot;,
                }}
              &gt;
                &lt;Text style={{ textAlign: &quot;center&quot; }}&gt;Complete&lt;/Text&gt;
              &lt;/TouchableOpacity&gt;
            )}
  
  // on Toggle VideoRecording for start/stop video recording button, firing _toogleRecord Function
            &lt;TouchableOpacity
              onPress={this.toogleRecord}
              style={{
                padding: 20,
                width: &quot;100%&quot;,
                backgroundColor: recording ? &quot;#ef4f84&quot; : &quot;#4fef97&quot;,
              }}
            &gt;
              &lt;Text style={{ textAlign: &quot;center&quot; }}&gt;
                {recording ? &quot;Stop&quot; : &quot;Record&quot;}
              &lt;/Text&gt;
            &lt;/TouchableOpacity&gt;
          &lt;/Camera&gt;
        &lt;/View&gt;
      );
    }
  }
  
  
    // Styles
  const styles = StyleSheet.create({
    responsiveBox: {
      width: wp(&quot;100%&quot;),
      height: hp(&quot;100%&quot;),
      alignItems: &quot;center&quot;,
      justifyContent: &quot;center&quot;,
    },
  });
  </code></pre>