Question

我能够将我的桌面上的图像上传到基于Angular的Web应用程序，而不会出现问题，但如果我从手机（如iPhone）上传，请使用“拍摄照片或视频”或“照片”图书馆“功能，它在纵向拍摄时使图像侧向或在横向拍摄时上下颠倒。这是我目前的上传功能。任何线索/让其他人有从iPhone /移动电话上传到移动Web应用程序到SharePoint库的相同问题吗？

这是我的上传功能：

 return self.get_json(url, params={ 'access_token': access_token, 'alt': 'json' })

这些输出只是推入一个数组，用于Angular UI Carousel：

  // Upload of images
    $scope.upload = function () {
        //console.log($scope.files);
            if (document.getElementById("file").files.length === 0) {
                alert('No file was selected');
                return;
            }
            var parts = document.getElementById("file").value.split("\\");
            var uploadedfilename = parts[parts.length - 1];
            var basefilename = uploadedfilename.split(".")[0];
            var fileextension = uploadedfilename.split(".")[1];
            var currentdate = new Date();
            var formatteddate = $filter('date')(new Date(currentdate), 'MMddyy-hmmssa');
            var filename = basefilename + formatteddate + '.' + fileextension;
            var file = document.getElementById("file").files[0];
            uploadFileSync("/sites/asite", "Images", filename, file);
        }

        //Upload file synchronously
    function uploadFileSync(spWebUrl, library, filename, file)
    {
            console.log(filename);

            var reader = new FileReader();
            reader.onloadend = function(evt) 
            {
                if (evt.target.readyState == FileReader.DONE) 
                {
                    var buffer = evt.target.result;
                    var completeUrl = spWebUrl
                      + "/_api/web/lists/getByTitle('"+ library +"')"
                      + "/RootFolder/Files/add(url='"+ filename +"',overwrite='true')?"
                      + "@TargetLibrary='"+library+"'&@TargetFileName='"+ filename +"'";

                    $.ajax({
                        url: completeUrl,
                        type: "POST",
                        data: buffer,
                        async: false,
                        processData: false,
                        headers: {
                            "accept": "application/json;odata=verbose",
                            "X-RequestDigest": $("#__REQUESTDIGEST").val(),
                            "content-length": buffer.byteLength
                        },
                        complete: function (data) {      
                            console.log(data);
                        },
                        error: function (err) {
                            alert('failed');
                        }
                    });

                }
            };
            reader.readAsArrayBuffer(file);
        }

图片轮播在页面上如下：

 // Control of Image Carousel
    $scope.myInterval = 0;

// Population of carousel
$scope.slides = [];

    appImages.query({
        $select: 'FileLeafRef,ID,Created,Title,UniqueId',  
        $filter: 'ReportId eq ' + $routeParams.Id + ' and DisplayinReport eq 1',
    }, function (getimageinfo) {
        // Data is within an object of "value"
        var image = getimageinfo.value;

        // Iterate over item and get ID
        angular.forEach(image, function (imagevalue, imagekey) {

            $scope.slides.push({
                image: '/sites/asite/Images/' + imagevalue.FileLeafRef,
            });
        });
    });

重要事项：上传到SharePoint库时，图片是横向和颠倒的，所以无论输出它们，当它们到达我用作源的目标库时，它们似乎都是错误的。在页面上显示。

如何上传图像以使SharePoint尊重EXIF数据/方向？

Answer 1

可能与EXIF有关。见JS Client-Side Exif Orientation: Rotate and Mirror JPEG Images

如果您想要更好的答案，我们需要显示图像的代码和代码服务器端。

更新：我在SharePoint上根本不是专家，但您可以在SharePoint Stack Exchange中找到很多相关信息。例如，https://sharepoint.stackexchange.com/questions/131552/sharepoint-rotating-pictures-in-library应该可以解决问题。

总结一点：在你的情况下，他们可能会有很多案例需要学习。因此，我建议您自动更正exif，然后允许您的用户在自动更正错误时进行更正。他们有很多工具可以做到这一点。如果您想在服务器端执行此操作，请查看上面的链接，如果您想在客户端执行此操作，则可以使用JS-Load-Image作为示例。

从手机上传到Angular的图片是侧面或颠倒的

1 个答案: