Filesize of 0bytes when uploading to Google Drive

Aurillia · April 17, 2024, 10:43am

Goal: Upload a file to Google Drive from a filepicker component
Steps: Followed a tutorial recommending to split the upload into 2 queries. A POST query uploading the files metadata, and then a PATCH query appending the file data to the outcome of the POST request. Everything works as expected and I can upload files of any time to a specified Drive folder.
HOWEVER anything I try always results in a filesize of 0 bytes.
Details:

POST Request to https://www.googleapis.com/drive/v3/files with Content-Type header of application/JSON. And a Raw body of:

{
  "mimetype": "{{addFile.value[i].type}}",
  "name": "{{addFile.value[i].name}}",
  "parents": [{{employeesTable.selectedRow.drive_id}}]
}

PATCH Request to https://www.googleapis.com/drive/v3/files/{{addDriveFileMeta.data.id}} with an uploadType of media. Content-Type of {{addFile.value[i].type}} and Raw Body of: {{addFile.value[i]}}

Screenshots:
"addDriveFileMeta" POST Request:

image1019×1517 80.2 KB

"addDriveFileData" PATCH Request:

image1023×1556 78.8 KB
App json export:

Aurillia · April 17, 2024, 12:08pm

UPDATE:

In the PATCH request, I incorrectly had the URL as https://www.googleapis.com/drive/v3/files/ rather than https://www.googleapis.com/UPLOAD/drive/v3/files

A size is now shown with each file in google drive, however when clicking on them to access the file I am met with the following error:

Jack_T · April 25, 2024, 4:18pm

Hello @Aurillia!

Thank you for finding this bug! I will look and see if I can replicate it.

Which file picker component did you use? Retool has 'file input', 'file button' and 'file dropdown'.

Glad to hear you were able to resolve the file sizing issue, if I had to guess the lack of file preview might stem from Google/Drive side, which is very odd behavior.

Hopefully my testing can confirm either of my theories that the file did not upload properly and that's why it can't be previewed (and we can fix that on the retool end) or that there is something with Google's permissions that is trying to protect the file from being previewed.

Jack_T · April 25, 2024, 6:18pm

Also what scopes do you have defined/enabled for your Google docs resource?

If the uploaded files name and file size appears but as a user you are not allowed by Google Drive to preview/view/download then you might not have the right permissions enabled. Can you confirm if view and download are also not possible?

After seeing in your second comment that the PATCH method needs a different URL, are you using a single resource for both POST and PATCH or a single resource with two different queries?

Potentially one query might have different scopes than the other, or the second action is changing the file in some way that makes it unavailable for previews.

Do you have a link to the docs that recommend using POST then PATCH as opposed to a single POST action?

Jack_T · April 25, 2024, 8:34pm

@Aurillia Another note

I found that other Google Drive users got the same 'can't preview' error because they had uploaded and incompatible file format that was not fit for Google's software to be able to preview. What are the types of files are are uploading?

Another user was able to fix this issue for image files by clearing their clearing their cache in their browser as outlined in the response here

It seems that the issue is fairly common and is caused on Google's end, if you are able to see the file and it's size than I think it's safe to assume the POST/PATCH combo from the retool query worked, here are more details on fixing preview issues on Drive.

Hope one of these helps!

Aurillia · April 28, 2024, 4:48pm

Hey Jack, thanks for your help. I actually managed to get it working shortly after my initial post but forgot to return to here and update my post to solved - apologies!

I was using a File Button element.

I had all scopes for google drive during testing.

I was attempting to upload images and MS Office Spreadsheets.

As it was a little while ago, I have since forgotten what I changed to get it working but I've just reviewed my code and I suspect it was the following:

I added a Parse event handler to the File Button element where I set a temp variable equal to {{self.value}} - I then use this variable value in my PATCH request to Google Drive.

I suspect passing the file value to a variable shouldn't be necessary but I'm assuming it was the fix as its the only part I've changed and now it works correctly.