How can I preview image before uploading with the correct orientation with JavaScript?

I have a upload button and I want users being able to preview the image before clicking 'save'. I have

<input type="file" accept="image/*" id="avatarInput" onchange="PreviewImage();"/>

as my HTML and for my JS:

      function PreviewImage() {
            var oFReader = new FileReader();
            oFReader.readAsDataURL(document.getElementById("avatarInput").files[0]);                

            oFReader.onload = function (oFREvent) {
                $('.image').attr('src', oFREvent.target.result);
            };
        };

But now, when I try to upload portrait image on my mobile, the preview image is rotated 90 degree. How can I cope with this? I've seen this and this but I don't know the codes can be incorporated in my case. Thanks.