Question

我使用的是核心API Plupload 2.1.9 我在上传之前显示图像的预览，一些图像上下颠倒或侧面显示

我做了很多关于这个问题的谷歌搜索，从stackoverflow到github ...论坛，没有在哪里

所以我在UI Widget的plupload网站上的示例部分进行了测试，同样的问题

Plupload Example on the plupload website (UI Widget)

如果您在手机上试用该演示版，则会注意到预览图像没有以正确的方向显示

我想提一下，在我的应用程序中，即使预览显示为颠倒，一旦上传，它就会以正确的方向上传（因为我在plupload选项中设置了preserve_headers：false）

Preview before upload on my website

出现在错误方向的图片来自手机，在电脑上调整大小，工作正常。

一些研究提到了图像中的exif数据，但现在让我了解

以下是我的代码示例：

＆＃13;

uploader.bind('FilesAdded', function(up, files) {
 
        //maximum number of allowed files to add
        max_files = 5 - nb_images;
                     
        if (up.files.length > max_files) {
            up.splice(max_files);
        }
 
        $.each(files, function(i, file){
             
            img = new mOxie.Image();
 
            img.onload = function() {
 
                 thumb_wrapper = $('<div/>', { class: 'thumbnail pull-left', id: file.id }).appendTo('#files');
 
                $("#files .thumbnail").css("position", "relative");
 
                this.crop({
                    width: 120,
                    height: 120,
                    preserveHeaders: true
                });
 
                this.embed(thumb_wrapper.get(0), {
                    /*width: 120,
                    height: 120,*/
                    crop: true
                });
 
                //initialize the remove button
                 removeBtn = "<a href='javascript:void(0)' class='img-del' style='background: #CC0000; color: #FFF; width: 25px; height:25px; position:absolute; right:4px; padding-top: 3px;'>";
 
                removeBtn = removeBtn + "<strong>X</strong>";
 
                removeBtn = removeBtn + "</a>";
 
                $("#" + file.id).append(removeBtn);
 
            };
 
            img.onembedded = function() {
                this.destroy();
            };
 
            img.onerror = function() {
                this.destroy();
            };
 
            img.load(this.getSource());   
             
        });
         
    });

＆＃13;

将preserveHeaders更改为false，不会产生影响

非常感谢任何帮助

Answer 1

好的，这可能有助于有相同问题的人，我希望Plupload的开发人员调试问题

经过一番研究后，我陷入了这个stackoverflow链接：

Plupload Html5 preview after Fileselect

让我在答案中找到了jsfiddle：

[http://jsfiddle.net/Ec3te/2/][2]

预览以正确的方向显示，方法是使用我上次使用之前使用的相同图片进行测试，并确定方向问题。

注意到jsfiddle中的plupload.full.min.js文件的版本是：v1.2.1，而plupload v2.1.9附带的版本的版本是：1.3.5

切换这些文件解决了我的预览定位问题

希望在plupload的下一个版本中，这将被修复

此致

上传从移动设备拍摄的图像时，插入预览图像会上下颠倒或侧向显示

1 个答案: