NativeScript / sample-ImageUpload

An integration of nativescript-image-picker and nativescript-background-http
Apache License 2.0
22 stars 19 forks source link

Sample app isn't working #12

Closed 3rror404 closed 7 years ago

3rror404 commented 7 years ago

I'm having all sorts of issues with the example app.

I'm posting this here as I'm not sure if the issues are related to nativescript-image-picker or nativescript-background-http or both.

I've attached a video that shows the process of selecting an image(s) on Android 6.0.1. The image picker becomes very unresponsive and I see a black screen. When the picker does eventually close there is no image thumbnail for the file being uploaded.

It looks as though the progress console logs are being duplicated and the final eventName is 'error'

...
JS: eventName: progress
JS: currentBytes: 7929856
JS: totalBytes: 10024575
JS: eventName: progress
JS: currentBytes: 8912896
JS: totalBytes: 10024575
JS: eventName: progress
JS: currentBytes: 8912896
JS: totalBytes: 10024575
JS: eventName: progress
JS: currentBytes: 9961472
JS: currentBytes: 9961472
JS: totalBytes: 10024575
JS: eventName: progress
JS: totalBytes: 10024575
JS: eventName: progress
JS: currentBytes: undefined
JS: totalBytes: undefined
JS: eventName: error
JS: currentBytes: undefined
JS: totalBytes: undefined
JS: eventName: error

Android Video: https://drive.google.com/file/d/0B4bGjCXRLaUbSkN6MDVlc1Jra2s/view?usp=sharing

On iOS there are no folder preview thumbnails. Once you exit a folder, the picker automatically closes after a couple of seconds meaning that you can't navigate to another folder to pick other images. Uploading seems fine.

iOS Video: https://drive.google.com/file/d/0B4bGjCXRLaUbNGMzRVlKVlNlVE0/view?usp=sharing

┌──────────────────┬─────────────────┬────────────────┬──────────────────┐
│ Component        │ Current version │ Latest version │ Information      │
│ nativescript     │ 2.5.2           │ 2.5.3          │ Update available │
│ tns-core-modules │ 2.5.1           │ 2.5.1          │ Up to date       │
│ tns-android      │ 2.5.0           │ 2.5.0          │ Up to date       │
│ tns-ios          │ 2.5.0           │ 2.5.0          │ Up to date       │
└──────────────────┴─────────────────┴────────────────┴──────────────────┘
tsonevn commented 7 years ago

Hi @3rror404, I tested that case and found that the issue with a black screen on Android has been related to ImageSource saveToFile method and the way it is called in the sample project - just after we getting the image source of the selected image. You could do something like the attached code below and to set setTimeout, which will trigger image save after we navigate back to the app.

setTimeout(function() {
                        let saved = imagesource.saveToFile(path, "png");

                        if(saved){
                            var task = sendImages("Image"+counter+".png", path);
                            var item = new observable.Observable();
                            item.set("thumb", imagesource);
                            item.set("uri", "Test"+counter+".png");
                            item.set("uploadTask", task);

                            imageItems.push(item);
                        }
                    }, 100);

Regarding the returned error, this is seems to be related to the android-upload-service which has been exposed inside the nativescript-background-http plugin, however this error should not prevent from the image upload.

About iOS could you provide some more info about the problem and the way you expect it to work?

I look forward to hearing from you.