NativeScript file upload to QuickBlox example (iOS)

app.component.js

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var quickblox_1 = require("./quickblox");
var core_1 = require("@angular/core");
var fs = require("tns-core-modules/file-system");
var imagepicker = require("nativescript-imagepicker");
var bghttp = require("nativescript-background-http");
var parseUri = require("parseUri");

var AppComponent = (function () {
    function AppComponent(_changeDetectionRef) {
        this._changeDetectionRef = _changeDetectionRef;
        quickblox_1.QB.init(36125, 'gOGVNO4L9cBwkPE', 'JdqsMHCjHVYkVxV', { debug: { mode: 1 } });
        quickblox_1.QB.createSession({ email: '[email protected]', password: '[email protected]' }, function (err, session) { });
    }

    AppComponent.prototype.getFileAndUpload = function () {
      var file = fs.File.fromPath(this.filePath);
      var size = file.readSync().length;
      var contentType = 'image/jpeg';
                    
      var self = this;
                    
      console.log(size);
        
      // create QuickBlox blob
      var params = {
        name: file.name,
        content_type: contentType,
        public: false
      };
      quickblox_1.QB.content.create(params, function (err, createResult) {
        var uri = parseUri(createResult.blob_object_access.params),
            uploadUrl = uri.protocol + "://" + uri.authority + uri.path;
                                    
        var blobId = createResult.id;
            
        var uploadParams = [];
        Object.keys(uri.queryKey).forEach(function(val) {
           uploadParams.push({name: val, value: decodeURIComponent(uri.queryKey[val])});
        });
        uploadParams.push({name: "file", filename: self.filePath, mimeType: contentType}); // If the element is named anything other than 'file', you're likely to receive a MaxPostPreDataLengthExceededError response when upload to S3.
        
        var request = {
            url: uploadUrl,
            method: "POST"
        };
         
        var session = bghttp.session("image-upload");
        var task = session.multipartUpload(uploadParams, request);
                                    
        function onEvent(e) {
            console.log("event: " + e.eventName);
            if(e.object.description){
              console.log(e.object.description);
            }
            if(e.error){
              console.log(e.error);
            }
            if(e.currentBytes){
              console.log(e.currentBytes + " of " + e.totalBytes);
            }
            if(e.data){
              console.log(e.data);
            }
               
            if(e.eventName == "complete"){
                 // mark blob as uploaded on QuickBlox side
                 quickblox_1.QB.content.markUploaded({id: blobId, size: size}, function (err, res) {
                     if(!err){
                       console.log("SUCCESS!");
                     }
                 });
            }
        }
           
        task.on("progress", onEvent.bind(this));
        task.on("error", onEvent.bind(this));
        task.on("responded", onEvent.bind(this));
        task.on("complete", onEvent.bind(this));
      });
    };
                    
    AppComponent.prototype.onSelectImage = function () {
        var _this = this;
        var context = imagepicker.create({ mode: "single" });
        context.authorize()
        .then(function () {
              return context.present();
              }).then(function (selection) {
                      selection.forEach(function (selected) {
                                        selected.getImage()
                                        .then((imageSource) => {
                                              var originPathSplited = selected.fileUri.split("/");
                                              var origFilename = originPathSplited[originPathSplited.length-1];
                                              _this.filePath = fs.path.join(fs.knownFolders.documents().path, origFilename);
                                              var saved = imageSource.saveToFile(_this.filePath, "jpeg");
                                              console.log("new path: " + _this.filePath);
                                              console.log(`item saved:${saved}`);
                                              },(error) => {
                                              
                                              })
                                        });
                      }).catch(function (e) { return console.log(e); });
    };


    AppComponent = __decorate([
        core_1.Component({
            selector: "my-app",
            template: "\n        <ActionBar>\n            <ActionBar title=\"Image Uploader\"></ActionBar>\n        </ActionBar>\n        <FlexboxLayout height=\"100%\" flexDirection=\"column\" justifyContent=\"space-between\">\n            <Image [src]=\"item\" height=\"60%\" horizontalAlignment=\"center\"></Image>\n            <FlexboxLayout flexDirection=\"column\" justifyContent=\"center\">\n                <Button text=\"Pick Single\" (tap)=\"onSelectImage()\"></Button>\n                <Button text=\"Upload Single\" (tap)=\"getFileAndUpload()\"></Button>\n            </FlexboxLayout>\n        </FlexboxLayout>\n    ",
            styleUrls: ["buttons.css"]
        }),
        __metadata("design:paramtypes", [core_1.ChangeDetectorRef])
    ], AppComponent);
    return AppComponent;
}());
exports.AppComponent = AppComponent;

@RacknerFrank
What a version of nativescript-background-http did you use?
I have looked to releases of the plugin and seen fix for the issue in v.3.2.3

I'm on version 3.2.5 and unfortunately I'm still getting that error

I found the same issue in the nativescript-background-http repository (closed issues).
We will try to resolve this and let you know if there is any news.

Thanks!

@Vladlukhanin any update on this?