Closed ChristopherGabba closed 4 months ago
cwomack
commented
5 months ago Hello again, @ChristopherGabba and thanks for creating this issue. Can you share any errors you see (if any) and confirm if you're seeing the file actually get uploaded into the S3 bucket? Want to see if we can isolate this to the onProgress callback or if there's something happening with the uploadData() for you.
ashika112
commented
5 months ago @ChristopherGabba How big of a file are you uploading?
ChristopherGabba
commented
5 months ago @cwomack The file has uploaded perfectly every time, everything seems to be working perfectly but the onProgress callback does not fire at all.
@ashika112 The files can be small from 0.1MB up to about 15MB (short <30s videos and thumbnails).
ChristopherGabba
commented
5 months ago The react-native-compressor package:
const result = await Video.compress(
'https://example.com/video.mp4',
{
progressDivider: 10, // allows you to adjust the percent interval on how often the callback fires
downloadProgress: (progress) => {
console.log('downloadProgress: ', progress);
},
},
(progress) => {
console.log('Compression Progress: ', progress);
}
);and the react-native-fs package
type DownloadFileOptions = {
progressInterval?: number;
progressDivider?: number;
begin?: (res: DownloadBeginCallbackResult) => void; // Note: it is required when progress prop provided
progress?: (res: DownloadProgressCallbackResult) => void;
resumable?: () => void; // only supported on iOS yet
connectionTimeout?: number // only supported on Android yet
readTimeout?: number // supported on Android and iOS
backgroundTimeout?: number // Maximum time (in milliseconds) to download an entire resource (iOS only, useful for timing out background downloads)
};that both download files locally have great progress feedback callbacks that let you customize how often they fire.
In this case, when signal is bad the upload can take a while and it's important that I give the user some sort of status feedback within the UI. Without this onProgress working, I can't do that.
I really feel like this uploadData function should have a functioning onProgress callback as well as a lot of these customizations like uploadingTimeout, progressUpdateInterval, etc. At a minimum it definitely needs to work.
natuan62
commented
5 months ago Hi @ChristopherGabba Have you have same issue like me on amplify v5 on build mode https://github.com/aws-amplify/amplify-js/issues/11863
ChristopherGabba
commented
5 months ago @natuan62 Thanks for referencing. I looked and there is no resumable flag in v6. Here are the options:
natuan62
commented
5 months ago @ChristopherGabba
I did test with vite5-vue3 + amplify v6.
The onProgress callback still trigger work fine on both (run dev localhost and build code + run serve)
ChristopherGabba
commented
5 months ago @natuan62 Maybe it's working on the react framework and not iOS react-native...
cwomack
commented
5 months ago @ChristopherGabba, we've tried to reproduce and test this internally and aren't running into any issue when using React Native too (on latest, same version as yours it looks like). Using the code you provided yielded a proper upload and log that matched yours as well.
To try and pin the cause of the issue you're experiencing further, could you clarify what simulator/devices you're using? And do you have any console logs from other sources by chance? Thanks!
ChristopherGabba
commented
5 months ago @cwomack @ashika112
Here is an expo-snack that you can use to reproduce this perfectly. You will get no onProgress callback fires at all:
https://snack.expo.dev/@christophergabba/expo-image-picker-s3---no-onprogress
This is on a physical iPhone using expo development build (and in a TestFlight build). Seeing this on multiple different iPhones (12, 13, 15). You'll need to configure amplify to get this connected but it's not firing at all in my mobile app.
cshfang
commented
5 months ago Hi @ChristopherGabba - is there any way you can try downgrading to Expo SDK 48?
I came across https://github.com/expo/expo/discussions/27448 in my investigation and I was able to
This appears to be an Expo issue with XHR events not being triggered.
cshfang
commented
5 months ago @ChristopherGabba can I also ask if you are using Expo Go?
I was only able to replicate this issue with Expo Go at SDK 49+. When running the same application using
$ npx expo run:iosI think I was able to avoid the issue. I wanted to bring this up since Amplify v6 no longer supports Expo Go.
cshfang
commented
5 months ago I have opened the following issue against Expo: https://github.com/expo/expo/issues/28269
I believe this is not an issue with Amplify and would recommend that we go ahead and close this and continue to monitor the Expo issue instead. Please let us know if that sounds acceptable to you @ChristopherGabba!
ChristopherGabba
commented
5 months ago @cshfang @cwomack Man there's a lot of Chris's in this thread!
I'm using an Expo development build on the managed work process, so not using Expo Go.
Thanks very much for digging down and identifying the potential source, it is pretty interesting that this problem falls in the Expo ecosystem. On another note, I am using the react-native-fs and react-native-compressor packages and am doing some basic downloadFile and Image.compress methods in my app. They both have downloadProgress callbacks, and am seeing that they are not always getting called as well. I found other issues such as:
https://github.com/numandev1/react-native-compressor/issues/276
I'll try downgrading and I'll keep my eye on the expo issue you have created. Historically these expo issues remain open for quite some time in my experience, but it sounds like it's definitely not an issue with the amplify package so I'm good with closing this issue.
Thanks again! Chris
cwomack
commented
4 months ago Appreciate the follow ups and discussion on this thread, @ChristopherGabba. We'll close this issue out and encourage anyone that comes across this to follow the expo issue opened by @cshfang above.
ChristopherGabba
commented
3 weeks ago @cshfang @cwomack I would like to reopen this issue. Referencing the issue mentioned above with Expo Go, this is still happening in Expo Development Client in Expo 49-51. According to the issue above, this is not an expo issue #28269 in a development client, and expo is successfully providing XMLHttpRequestUploadEvents in a Development Build, but the uploadProgress callbacks aren't firing.
Before opening, please confirm:
JavaScript Framework
React Native
Amplify APIs
Storage
Amplify Version
v6
Amplify Categories
storage
Backend
Amplify Gen 2 (Preview)
Environment information
Describe the bug
I'm using the onProgress callback from the upload data exactly as per the docs: Storage Docs
And I cannot get the onProgress callback to provide any feedback whatsoever to me. It's really important in my app to give the user some sort of percent complete feedback and this needs to be working.
Expected behavior
The uploadData function's onProgress callback should log what percent complete the upload is but nothing happens.
Reproduction steps
On iPhone 12, run the code per the docs:
Code Snippet
I created a custom upload function so that I could get the file key:
and here is it's usage:
You will get no console logs to update the upload status.
Log output
aws-exports.js
Manual configuration
No response
Additional configuration
No response
Mobile Device
iPhone 12 Physical
Mobile Operating System
iOS17
Mobile Browser
No response
Mobile Browser Version
No response
Additional information and screenshots
No response