input 上传拍照，压缩图片与旋转图片（ios）

最新推荐文章于 2022-10-18 10:36:02 发布

菱玉

最新推荐文章于 2022-10-18 10:36:02 发布

阅读量1.1k

点赞数

文章标签： input拍照上传压缩图片 ios旋转图片

本文链接：https://blog.csdn.net/weixin_43878003/article/details/97890620

版权

本文介绍了在iOS中如何处理用户通过input拍照上传的图片，包括压缩图片以降低大小，以及根据图片的Orientation属性进行正确的旋转操作。示例代码展示了使用canvas进行图片压缩的方法，并通过EXIF数据获取图片的旋转信息。

摘要由CSDN通过智能技术生成

压缩图片与旋转图片

     inputFileChange: function (event, index, listIndex) {
            var self = this;
            var file = event.target.files[0];
            var ele = event.target;
            var Orientation = null;
            if (window.FileReader) {
                if (file.size > 10 * 1024 * 1024) {
                    TipsBox({content: '上传图片大小不能超过10M', tipsStyle: 0});
                } else {
                    var reader = new FileReader();
                    var imgUrl = null;
                    reader.readAsDataURL(file);
                    EXIF.getData(file, function(){
                        Orientation = EXIF.getTag(this, 'Orientation');
                    });
                    reader.onloadend = function (e) {

                        var image = new Image(),
                            canvas = document.createElement("canvas"),
                            ctx = canvas.getContext('2d');
                        image.src = e.target.result;
                        imgUrl = e.target.result;
                        image.onload = function () {
                            var w = image.naturalWidth,
                                h = image.naturalHeight;

                            if (w > 1000) {
                                h = h * 1000 / w;