title: Image rotation on input type="file"
body: <p>I am using <strong><a href="https://www.npmjs.com/package/react-firebase-file-uploader" rel="noreferrer">react-firebase-file-uploader</a></strong> to upload an avatar to firebase storage. However, any time I upload an image of Portrait Orientation (specifically, images taken on <strong>Android and IOS</strong> devices - they tend to have <strong>OrientationRotate 90 CW</strong> in their metadata) the image is rotated 90 degrees. </p>
  
  <p>I have read about this previously and I believe that these smartphone images taken are always in <strong>Landscape</strong> but the orientation is stored <strong>EXIF meta</strong>. Please correct me if I am mistaken?</p>
  
  <p>Below is an example of a component that is uploading the image using react-<strong>firebase-file-uploader</strong> - I know it is not an issue with this package and the solution to this question is likely applicable across many applications.</p>
  
  <p>So, what do I need to do as to read the <strong>EXIF orientation</strong>, change the rotation (if required, or is it that I need to pass the meta with the file upload?) and still continue the upload?</p>
  
  <pre><code>class ProfilePage extends Component {
    state = {
      avatar: "",
      isUploading: false,
      progress: 0,
      avatarURL: ""
    };
  
    handleProgress = progress =&gt; this.setState({ progress });
    handleUploadError = error =&gt; {
      this.setState({ isUploading: false });
      console.error(error);
    };
    handleUploadSuccess = filename =&gt; {
      this.setState({ avatar: filename, progress: 100, isUploading: false });
      firebase
        .storage()
        .ref("images")
        .child(filename)
        .getDownloadURL()
        .then(url =&gt; this.setState({ avatarURL: url }));
    };
  
    render() {
      return (
        &lt;div&gt;
          &lt;form&gt;
            {this.state.isUploading &amp;&amp; &lt;p&gt;Progress: {this.state.progress}&lt;/p&gt;}
            {this.state.avatarURL &amp;&amp; &lt;img src={this.state.avatarURL} /&gt;}
            &lt;FileUploader
              accept="image/*"
              name="avatar"
              randomizeFilename
              storageRef={firebase.storage().ref("images")}
              onUploadStart={this.handleUploadStart}
              onUploadError={this.handleUploadError}
              onUploadSuccess={this.handleUploadSuccess}
              onProgress={this.handleProgress}
            /&gt;
          &lt;/form&gt;
        &lt;/div&gt;
      );
    }
  }
  
  export default ProfilePage;
  </code></pre>