Nativescript-background Http Not working in nativescript 5.2.1 #250

Ramkrishnank · 2019-10-18T07:29:51Z

Hi Team @hdeshev @EmilStoychev @jbristowe @romulowspp @NathanaelA

My client app is not hitting API and i didn't get any error both run and compile time error : even i uploading Files ,Images,Video,please help me to resolve this error

My API is working fine i checked from some other application

iOS/Android/Both
iOS/Android versions
emulator or device. What type of device?
CLI: 5.2.1
Cross-platform modules: 5.2.1
Runtime(s): Android (5.2.1)
Plugin(s): nativescript-background-http

dependencies

{
"nativescript": {
"id": "com.demo.sample",
"tns-ios": {
"version": "5.2.0"
},
"tns-android": {
"version": "5.2.1"
}
},
"description": "sample Application",
"license": "SEE LICENSE IN ",
"repository": "",
"scripts": {
"lint": "tslint "src/**/*.ts""
},
"dependencies": {
"@angular/animations": "^7.2.0",
"@angular/common": "^7.2.0",
"@angular/compiler": "^7.2.12",
"@angular/core": "^7.2.13",
"@angular/forms": "^7.2.0",
"@angular/http": "^7.1.0",
"@angular/platform-browser": "^7.2.0",
"@angular/platform-browser-dynamic": "^7.2.0",
"@angular/router": "^7.2.0",
"file-system": "^2.2.2",
"nativescript-android-utils": "^1.0.2",
"nativescript-angular": "^7.2.1",
"nativescript-background-http": "^4.2.0",
"nativescript-camera": "^4.5.0",
"nativescript-checkbox": "^3.0.3",
"nativescript-drop-down": "^5.0.2",
"nativescript-mediafilepicker": "^2.0.17",
"nativescript-modal-datetimepicker": "^1.2.0",
"nativescript-ng-ripple": "^2.0.1",
"nativescript-pdf-view": "^2.0.1",
"nativescript-phone": "^1.4.0",
"nativescript-snackbar": "^4.1.2",
"nativescript-theme-core": "^1.0.4",
"nativescript-ui-listview": "^6.0.0",
"nativescript-ui-sidedrawer": "^5.1.0",
"reflect-metadata": "^0.1.12",
"rxjs": "^6.3.0",
"tns-core-modules": "~5.2.0",
"zone.js": "^0.8.26"
},
"devDependencies": {
"@angular/compiler-cli": "^7.2.0",
"@nativescript/schematics": "^0.5.0",
"@ngtools/webpack": "^7.2.0",
"codelyzer": "^4.5.0",
"nativescript-dev-sass": "^1.6.0",
"nativescript-dev-typescript": "^0.8.0",
"nativescript-dev-webpack": "^0.24.1",
"tslint": "^5.11.0"
},
"gitHead": "f548ec926e75201ab1b7c4a3a7ceefe7a4db15af",
"readme": "NativeScript Application"
}

here is my code
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import * as bgHttp from "nativescript-background-http";
import { Subject } from 'rxjs';

import { ApplicationSetting, ApplicationSettingService, CommonService } from './index.service';
import { HttpStatus } from './enumtype';

import { MSG_BadRequest, MSG_SuccessFileUpload } from './messages';
import { error } from '@angular/compiler/src/util';

@Injectable()
export class AttachmentService {

private API_URL: string = CRM_API_URL + API_AttachmentManagement;

// Attachment Controller
private Attachment: string = "StreamFileInsert";

public isUploading: boolean = false;
public isUploaded: boolean = false;

public tasks: bgHttp.Task[] = [];
public events: { eventTitle: string, eventData: any }[] = [];

private file: string;

public IsAttachmentUploaded = new Subject<boolean>();
private counter: number = 0;
private session: any;
private mimetype: string;
private Filename: string;

applicationSettingService: ApplicationSettingService;

constructor(private http: HttpClient, private commonService: CommonService) {
    this.session = bgHttp.session("image-upload");
    this.applicationSettingService = new ApplicationSettingService();

  
}

upload(filePath: string, fileSize: string): boolean {
    this.file = filePath;
    this.start_upload(fileSize);
    return this.isUploaded;
}

start_upload(fileSize: string) {

    this.isUploading = true;
    this.isUploaded = false;

    const name = this.file.substr(this.file.lastIndexOf("/") + 1);
    const description = name.substr(name.lastIndexOf('.'));
    const fileFormat = name.substr(name.lastIndexOf('.'));

    let request = {
      
        //192.168.10.226:5000/attchmentmgmt/Attachment/StreamFileInsert
        url: this.API_URL + this.Attachment,
        method: "POST",
        headers: {
            "Content-Type": "multipart/form-data",
            "TrackID": "1000210100",
            "FileSize": fileSize,
        },
        description: description
    };

    let task: bgHttp.Task;
    let lastEvent = "";

    const params = [
        { name: name, filename: this.file }
    ];
    let session = bgHttp.session("image-upload");
    console.log(this.file);

    //console.log("Status" + params);
    console.log("Stream Insert Started ");
    //this.file = "/storage/emulated/0/DCIM/IMG_20190926_205613.jpg";
    //console.log("Status" + task.status.toString());
    task = session.multipartUpload(params, request);

    console.log("Upload Status ------------------");
    console.log(this.tasks);
    console.log("Status: " + task.status);


    console.log("Stream Insert Ended...... ");
    let _this = this;

    function onEvent(e) {

        console.log(e);

        if (lastEvent !== e.eventName) {
            // suppress all repeating progress events and only show the first one
            lastEvent = e.eventName;

            if (e.eventName == 'responded' && e.responseCode == 200) {
                error => {
                    if (error.status == HttpStatus.BadRequest) {
                        _this.commonService.showAlertMessage(MSG_BadRequest);
                    }
                    else {
                        _this.commonService.errorFunction(error.status);
                    }
                }
            }
            if (e.eventName == 'complete') {
                this.isUploaded = true;
                _this.commonService.showAlertMessage(MSG_SuccessFileUpload);
                alert(MSG_SuccessFileUpload);
                this.IsAttachmentUploaded = true;

            }
            if (e.eventName == 'error') {
                this.isUploaded = false;

            }
        } else {
            return;
        }

        this.events.push({
            eventTitle: e.eventName + " " + e.object.description,
            eventData: JSON.stringify({
                error: e.error ? e.error.toString() : e.error,
                currentBytes: e.currentBytes,
                totalBytes: e.totalBytes,
                body: e.data
            })
        });
    }

    try {
        task.on("progress", onEvent.bind(this));
        task.on("error", onEvent.bind(this));
        task.on("responded", onEvent.bind(this));
        task.on("complete", onEvent.bind(this));
   
        lastEvent = "";
        this.tasks.push(task);
    }

    catch (ex) { }


}

}

The text was updated successfully, but these errors were encountered:

romulowspp · 2019-10-22T18:46:42Z

Do you have more information? Logs about bytes send or any project to reproduce the problem?

Ramkrishnank · 2019-10-23T05:53:45Z

Image format (jpg/png) are uploading successfully but the thing is Video and File(PDF,Docx) is not uploading even client is not hitting the API and i didnt getting the any error and log

Ramkrishnank · 2019-10-23T05:54:59Z

is there any other plugin to upload the files and video in native-script

Ramkrishnank · 2019-10-23T06:00:19Z

JS: {
JS: "eventName": "progress",
JS: "object": {
JS: "_observers": {
JS: "progress": [
JS: {}
JS: ],
JS: "error": [
JS: {}
JS: ],
JS: "responded": [
JS: {}
JS: ],
JS: "complete": [
JS: {}
JS: ]
JS: },
JS: "_session": {
JS: "_id": "file-upload"
JS: },
JS: "_id": "file-upload{2}",
JS: "_description": ".jpg",
JS: "_upload": 173,
JS: "_totalUpload": 32846,
JS: "_status": "uploading"
JS: },
JS: "currentBytes": 173,
JS: "totalBytes": 32846
JS: }
JS: {
JS: "eventName": "progress",
JS: "object": {
JS: "_observers": {
JS: "progress": [
JS: {}
JS: ],
JS: "error": [
JS: {}
JS: ],
JS: "responded": [
JS: {}
JS: ],
JS: "complete": [
JS: {}
JS: ]
JS: },
JS: "_session": {
JS: "_id": "file-upload"
JS: },
JS: "_id": "file-upload{2}",
JS: "_description": ".jpg",
JS: "_upload": 32846,
JS: "_totalUpload": 32846,
JS: "_status": "uploading"
JS: },
JS: "currentBytes": 32846,
JS: "totalBytes": 32846
JS: }
JS: {
JS: "eventName": "progress",
JS: "object": {
JS: "_observers": {
JS: "progress": [
JS: {}
JS: ],
JS: "error": [
JS: {}
JS: ],
JS: "responded": [
JS: {}
JS: ],
JS: "complete": [
JS: {}
JS: ]
JS: },
JS: "_session": {
JS: "_id": "file-upload"
JS: },
JS: "_id": "file-upload{2}",
JS: "_description": ".jpg",
JS: "_upload": 32846,
JS: "_totalUpload": 32846,
JS: "_status": "complete"
JS: },
JS: "currentBytes": 32846,
JS: "totalBytes": 32846
JS: }
JS: {
JS: "eventName": "responded",
JS: "object": {
JS: "_observers": {
JS: "progress": [
JS: {}
JS: ],
JS: "error": [
JS: {}
JS: ],
JS: "responded": [
JS: {}
JS: ],
JS: "complete": [
JS: {}
JS: ]
JS: },
JS: "_session": {
JS: "_id": "file-upload"
JS: },
JS: "_id": "file-upload{2}",
JS: "_description": ".jpg",
JS: "_upload": 32846,
JS: "_totalUpload": 32846,
JS: "_status": "complete"
JS: },
JS: "data": "{"fileByte":"","trackID":100050086668244,"category":null,"fileName":"IMG_20191021_123452.jpg","fileSize":0.084144}",
JS: "responseCode": 200
JS: }
JS: {
JS: "eventName": "complete",
JS: "object": {
JS: "_observers": {
JS: "progress": [
JS: {}
JS: ],
JS: "error": [
JS: {}
JS: ],
JS: "responded": [
JS: {}
JS: ],
JS: "complete": [
JS: {}
JS: ]
JS: },
JS: "_session": {
JS: "_id": "file-upload"
JS: },
JS: "_id": "file-upload{2}",
JS: "_description": ".jpg",
JS: "_upload": 32846,
JS: "_totalUpload": 32846,
JS: "_status": "complete"
JS: },
JS: "responseCode": 200,
JS: "response": {}
JS: }

**JS: Selected Videos
JS: Image File selected
JS: Image File selected /storage/emulated/0/DCIM/VID_20191021_123529.mp4

JS: Compressed File path /data/user/0/com.myDemo.app/files/VID_20191021_123529.mp4
JS: /data/user/0/com.myDemo.app/files/VID_20191021_123529.mp4
JS: /data/user/0/com.myDemo.app/files/VID_20191021_123529.mp4
JS: Stream Insert Started
JS: Selected Videos
JS: Image File selected
JS: Image File selected /storage/emulated/0/DCIM/VID_20191021_123529.mp4
JS: Came to Compress Image block
JS: Compressed File path /data/user/0/com.myDemo.app/files/VID_20191021_123529.mp4
JS: /data/user/0/com.myDemo.app/files/VID_20191021_123529.mp4
JS: /data/user/0/com.myDemo.app/files/VID_20191021_123529.mp4
JS: Stream Insert Started
JS: Selected Videos
JS: Image File selected
JS: Image File selected /storage/emulated/0/DCIM/VID_20191021_123529.mp4
JS: Came to Compress Image block
JS: Compressed File path /data/user/0/com.myDemo.app/files/VID_20191021_123529.mp4
JS: /data/user/0/com.myDemo.app/files/VID_20191021_123529.mp4
JS: /data/user/0/com.myDemo.app/files/VID_20191021_123529.mp4**

task = session.multipartUpload(params, request);
i didnt received any error after this line even console.log also not hitting

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Nativescript-background Http Not working in nativescript 5.2.1 #250

Nativescript-background Http Not working in nativescript 5.2.1 #250

Ramkrishnank commented Oct 18, 2019

romulowspp commented Oct 22, 2019

Ramkrishnank commented Oct 23, 2019

Ramkrishnank commented Oct 23, 2019

Ramkrishnank commented Oct 23, 2019

Nativescript-background Http Not working in nativescript 5.2.1 #250

Nativescript-background Http Not working in nativescript 5.2.1 #250

Comments

Ramkrishnank commented Oct 18, 2019

romulowspp commented Oct 22, 2019

Ramkrishnank commented Oct 23, 2019

Ramkrishnank commented Oct 23, 2019

Ramkrishnank commented Oct 23, 2019