Hi, we’re primarily looking at UploadCare in a use case where our users can upload a file or files, then view them. As noted https://uploadcare.com/learning/guides/files-browser/ this obviously requires we ourselves store information about each uploaded file; primarily, we need to know what files each user owns. We’d store this information in our database.
To avoid orphaned files, a typical file upload flow built natively would do something like this:
- User selects a file they want to upload
- User clicks “upload my file” button
- An api call is made which stores the file and user information in our database
- Only if #3 is successful, commence the actual file upload (if #3 failed, show the user an error message)
Importantly, #3 occurs before #4. That way, a record exists in our own database of all files which might have been uploaded. If #3 were to come after #4, orphaned files can occur in this way:
- User selects a file they want to upload
- User clicks “upload my file” button
- File upload commences
[ if any error occurs here, or if user closes browser, etc. then we end up with orphaned files] - Once file upload completes, an api call is made which stores the file and user information in our database
As you can see, if this second flow is followed, files can be uploaded for which no record in the database exists. These are what I mean by “orphaned” files; over time, orphaned files can not only increase storage costs, but present security risks.
How can we accomplish the best practice of the first flow, using the React/javascript widget? I do see that there’s a webhook which fires when an upload is completed, but in my experience that can be a bit difficult to implement on our end in a non-flaky way.
Thanks!