使用离子上传数百张照片(近千张)

时间:2017-08-22 05:23:36

标签: ionic-framework hybrid-mobile-app

我几个月来一直在努力做到这一点,但似乎不可能。

我正在使用离子框架创建一个应用程序,可以上传数百张照片。 此应用用于生成包含大量照片的报告。

API在本地服务器上完美运行但是当我尝试使用我们的云服务器时,很多照片都没有上传,应用程序显示成功,但是当我检查服务器时,只有少量照片上传(不到一百张)。 / p>

关于如何使其发挥作用的任何想法?

感谢。

编辑:

这是拍摄照片的代码 cameraservice.js

app.factory('cameraService', function ($rootScope, $q, $http, $location, $timeout, $cordovaCamera,$cordovaFile,$cordovaFileTransfer, apiUrl) {
var settings = {
    saveToPhotoAlbum: true,
    correctOrientation: true,
    quality: 10,
    targetWidth: 720,
    targetHeight: 720,
};

return {
    getPicture: function(){
        var d = $q.defer();

        let options = {
            popoverOptions: CameraPopoverOptions
        };

        angular.extend(options, settings)
        $cordovaCamera.getPicture(options).then(function(imageData) {

                let namePath = imageData.substr(0, imageData.lastIndexOf('/') + 1);
                let filename = imageData.replace(/^.*[\\\/]/, '');

                $cordovaFile.moveFile(namePath, filename, cordova.file.dataDirectory, filename)
                    .then(function (res) {
                        d.resolve({ filename: res.name });

                    }, function (error) {
                        console.log(error)
                    });

        }, function(err) {
                console.log(err)
        });

        return d.promise;
    }
}
})

这是我的 uploadservice.js

app.factory('imageUploadService', function ($cordovaFileTransfer) {
var settings = {
        fileKey: "file",
        chunkedMode: false,
        mimeType: "multipart/form-data",
        headers : {
            Connection:"close"
        }
};

return {
    upload: function(url, filename, options){
        let filePath = cordova.file.dataDirectory + filename;
        angular.extend(options, settings);
        console.log(url, filePath, options)
        return $cordovaFileTransfer.upload(url, filePath, options);

    }
}
});

这就是我使用API​​ sendservice.js

的方式
app.factory('sendService', function ($http, $q, imageUploadService, $timeout, apiUrl) {
return {
    photos: function(id, data){
        let d = $q.defer();
        var url = apiUrl + "/api/senddescription"
        var api = apiUrl + "/api/senddetailedphoto";
        let q = [];
        angular.forEach(data, (item, index)=>{
            angular.forEach(item.photos, (i)=>{
                let origName = i.image;
                var options = {
                        filename: i.image,
                        params : {
                                report_no : id,
                                label: i.label,
                                photo_count: index,
                                photo_label: i.label
                        },
                        chunkedMode: false,
                        headers : {
                            Connection : "close"
                        }
                };
                setTimeout(function(){
                    q.push(imageUploadService.upload(api, origName, options))
                },15000);
            })



            let data = {
                report_no: id,
                photo_count: index,
                product_description: item.product_description
            }
            q.push($http.post(url, data));

            $q.all(q).then(res=>{
                d.resolve(res);
            }, err=>{
                d.reject(err);
            })

        })
        return d.promise;
    }
}
});

这些是我的API

/ API / senddescription

public function sendPhotoDescription(Request $request){
    $desc = DetailedPhotoDescription::where('report_number',$request->input('report_no'))->where('photo_count',$request->input('photo_count'))->first();
    if (!$desc) {
        $desc = new DetailedPhotoDescription();
        $desc->report_number = $request->input('report_no');
    }
    $desc->photo_count = $request->input('photo_count');
    $desc->product_description = $request->input('product_description');
    if ($desc->save()) {
        return response()->json([
            'message'=>'OK'
        ],200);
    }else{
        return response()->json([
            'message'=>'Error submitting photo. Please resend the report!'
        ],500);
    }
}

/ API / senddetailedphoto     public function sendDetailedPhoto(Request $ request){

    $file = $request->file('file');
    //set a unique file name
    $filename = uniqid() . '.' . $file->getClientOriginalExtension();

    // //move the files to the correct folder
    if ($file->move('images/reports/'. $request->input('report_no').'/detailedPhoto'.'/'.$request->input('photo_count').'/', $filename)) {
        $detailed = new DetailedPhoto();
        $detailed->report_number = $request->input('report_no');
        $detailed->photo_count = $request->input('photo_count');
        $detailed->photo_label = $request->input('photo_label');
        $detailed->image_data = $filename;

        if ($detailed->save()) {
            return response()->json([
                'message' => 'OK'
            ],200);
        }else{
            return response()->json([
                'message' => 'Error saving detailed photos. Please resend the report!'
            ],500);
        }
    }else{
        return response()->json([
               'message' => 'Error uploading detailed photos. Please resend the report!'
        ],500);
    }
}

0 个答案:

没有答案