image-compressor.jsでExif情報で画像を回転

画像アップロード時に画像を圧縮してくれるimage-compressor.jsというJSのライブラリがあります。

デフォルトだと画像をアップロードしたときに縦向きの写真が横向きになるなど写真の向きがおかしくなるときがあります。

そんなときはオプションでcheckOrientation: falseを設定すれば写真の向きを正しくしてくれます(デフォルトはfalse)。

<div class="wrap">
  <div id="preview"></div>
    <form>
      <input id="test" type="file">
    </form>
  </div>
</div>

 $(function() {
    $('#test').change(function(e) {
      var file = e.target.files[0];
      new ImageCompressor(file, {
        quality: .6,
        checkOrientation: false,
        success(result) {
          var fileReader = new FileReader();
          fileReader.onloadend = function() {
            $('#preview').html('<img src="' + fileReader.result + '"/>');
          }
          fileReader.readAsDataURL(result);
        },
        error(e) {
          console.log(e.message);
        },
      });
    });
  });