Question

在我的Ionic应用程序中，我使用Cordova Camera API，当我使用它时，它返回一个看起来像这样的字符串 blob：http％3A // localhost％3A4400 / 20e71cfe-267e-46fe-8bd6-44967b8ed433 - 从该字符串我创建一个blob对象并将其上传到azure - 问题是blob不是我的图像的正确格式...它可以上传，但它不会将其识别为图像。

我认为我需要创建一个文件对象并将其附加到FormData - 但我不知道该怎么做 - 没有 var the_file = new Blob（[imageURI]，{type ：＆＃39; image / jpeg＆＃39;}）; 我无法创建我的API需要接受我的图片的FormData对象。我也尝试创建新文件，但这也不起作用。

我尝试了常规，我可以上传到azure，所以我知道我的API正在运行......但我需要使用Cordova，因为这是一个离子应用程序..

我的代码如下控制器： $ scope.getPhoto = function（）{

  function postMultipartFormData(uri, file) {
            console.debug('Posting multiplart to : ' + uri + ' data:' + file);
            var fd = new FormData();
            fd.append('file', file);
            //console.log(fd);
            var deferred = $q.defer();
            $http.post(baseUrl + uri, fd, {
                headers: { 'Content-Type': undefined },
                transformRequest: angular.identity
            }).
            success(function (data, status, headers, config) {
                deferred.resolve(data);
            }).
            error(function (data, status, headers, config) {
            });
            return deferred.promise;
        }

在我的工厂，我有这种方法上传到Azure

------WebKitFormBoundary0iJ9DFEpiBo5QCmw
Content-Disposition: form-data; name="file"; filename="photo (3).jpg"
Content-Type: image/jpeg


------WebKitFormBoundary0iJ9DFEpiBo5QCmw--

我的请求有效负载工作原理如下：

------WebKitFormBoundaryR4YDBKOi7RZ701i5
Content-Disposition: form-data; name="file"; filename="blob"
Content-Type: image/jpeg


------WebKitFormBoundaryR4YDBKOi7RZ701i5--

当它不是这样的时候

{{1}}

blob对象在Azure存储上也总是67个字节

我是Ionic和Cordova应用程序的新手 - 我试图寻找答案，但我真的不明白我如何将正确格式的简单图像上传到Azure ......

Answer 1

更改，以便我使用$ cordovaFileTransfer.upload而不是定期上传，这很好！

    function postMultipartFormData(apiUrl, imageUrl, options) {
    console.debug('Posting multiplart to : ' + apiUrl + ' data:' + options);

    var deferred = $q.defer();

    $cordovaFileTransfer.upload(apiUrl, imageUrl, {})
      .then(function(result) {
        // Success!
        deferred.resolve(result);
      }, function(err) {
        // Error
      }, function (progress) {
        // constant progress updates
    });

    return deferred.promise;
}

控制器

$cordovaCamera.getPicture(camOptions).then(function (imageUrl) {
            console.log(imageUrl);
            /* iOS saves image files taken from the camera to a temporary location which can be deleted by the ios later. imageUrl points to that temporary location. We should move the image file from this temporary location to a permanent location within the app on the device. This can be done using cordova file api (File plugin). However, this task is out of the scope of this demo.      
            */

            //Display the image on screen
            $scope.srcImage = imageUrl;

            var options = {};

            $scope.upload(imageUrl, options);
        }, function (err) {
            // error
            console.warn(err);

        });

    $scope.upload = function (imageUrl, options) {
    alert(options);
    $ionicLoading.show({
           template: '<ion-spinner class="spinner-energized"></ion-spinner><br/>Uploading ...',
           duration: 20000 //Dismiss after 20 seconds
    });

    BubbleService.UploadImage(imageUrl, options).then(function (resp) {
        $ionicLoading.hide();
        console.log(resp);
    }, function (resp) {
        $ionicLoading.hide();
        console.log('Error status: ' + resp.status);
    }, function (evt) {

    });
};

上传到Azure blob存储Cordova相机

1 个答案: