html5+canvas进行移动端手机照片上传时,发现ios手机上传竖拍照片会逆时针旋转90度,横拍照片无此问题;Android手机没这个问题。
因此解决这个问题的思路是:获取到照片拍摄的方向角,对非横拍的ios照片进行角度旋转修正。
注:在开发时发现 三星手机提交时会向右旋转90度 所以对仅对安卓系统中三星手机进行特别处理
这里主要用到Orientation属性。说明如下:
旋转角度 | 参数 |
---|---|
0° | 1 |
顺时针90° | 6 |
逆时针90° | 8 |
180° | 3 |
一、html文件
<a href="javascript:document.getElementById('fileobj').click()">
<button type="button" class="upload-image-btn" >
<span class="upload-btn-text" v-if="!show_upload_next_button" v-text="Camera / Photo"></span>
<span class="upload-btn-text" v-text="Please add the images" v-else></span>
</button>
</a>
<input type=