NativeScript IOS: Photo uploads to server are randomly failing with slow networks(LTE 1 or 2 bars)

Nativescript version - 8.4.7, Angular 15, IOS 17.2

When uploading photos to server/Microsoft api in the slow network (LTE 1 or 2 bars). The photos are not uploading and returning below exception. Looks like the request is not even reaching the server.

error { "headers": { "normalizedNames": {}, "lazyUpdate": null, "headers": {} }, "status": 0, "statusText": "Unknown Error", "url": "https://abc", "ok": false, "name": "HttpErrorResponse", "message": "Http failure response for "https://abc": 0 Unknown Error", "error": {} }

When connected to a strong network LTE 3 or more bars ,5g or WIFI , I am able to upload more than 50 photos at once without any issues.

Here is my upload code

//component

uploadPhotos(): void {
    let message;
    this.parent = this.service.getPhotosToUpload();
    if (this.parent !== null && this.parent.length > 0) {
        const parentList$ = new Array<Observable<boolean[]>>;

        this.parent.forEach(p=> {
            const observable = this.submitPhoto(p)
            if (observable) {
                parentList$.push(observable);
            }

        });

        zip(parentList$)
            .pipe(
                switchMap((flags: boolean[][], index: number) => {
                    let totalNotuploaded = 0;
                    let totalUploaded = 0;
                    const results =[]
                    flags.forEach((flag) => {
                        totalNotuploaded += flag.filter(falses => !falses).length;
                        totalUploaded += flag.filter(trues => trues).length;
                    });
                    results.push([totalNotuploaded, totalUploaded])
                    return of(results);
                })
            ).subscribe((results: number[][]) => {
                let notuploaded = results[0][0] ;
                let uploaded = results[0][1];

                this.message = `Uploaded ${uploaded} Photo(s).`;

                if (notuploaded > 0) {
                    this.message += `Errors uploading ${notuploaded}`

                }
            });

    } else {
        this.message = `Uploaded 0 Photos.`;
    }
}

submitPhoto(photo: PhotoWrapper): Observable<boolean[]> {

    const photosToUpload$ = new Array<Observable<boolean>>();
    const photosToUpload = photo.filter((filter) => !filter.Uploaded);

    photosToUpload.forEach(photo => {

        photo.FileContent = this.servic.getFileAsBase64String(new Path(photo.File.directory as any, photo.File.relativePath));
        const observable = this.service.upload(photo);
        photosToUpload$.push(
            observable.pipe(
                catchError(() => {
                    return of(null)
                }),
                switchMap((result: PhotoResult) => {
                    return of(result && result?.flag ? true : false)
                })
            ));
    });
    if (photosToUpload$ && photosToUpload$.length) {
        return forkJoin(photosToUpload$);
    } else { return null; }

}

//upload service

upload(photosData: PhotoWrapper): Observable<PhotoResult> {
    let headers = this.authService.getAuthHeader();
    let url = this.configurationService.uploadPhotoUrl();

    return this.http.post<boolean>(this.configurationService.uploadPhotoUrl(), photoDto, { headers: headers, observe: 'response' }).pipe(
        map((result) =>( {flag: result.body, wrapper: photosData} as PhotoResult)),

        );
}

}

can anyone help me on how to fix this issue or is there any setting on the ios/nativescript/angular side which will prevent this to happen or is something wrong with my upload code?

NativeScript / plugins

NativeScript IOS: Photo uploads to server are randomly failing with slow networks(LTE 1 or 2 bars) #557