What's the correct way to upload files to Google Drive using their API?

Other Questions Google drive
1

I’m trying to upload files to Google Drive using their API but I’m running into some issues. Here’s what I’ve tried:

let fileInfo = {
  name: myFile.name,
  parents: folderID ? [folderID] : []
}

let fileData = {
  mimeType: myFile.type,
  body: myFile
}

gapi.client.drive.files.create({
  resource: fileInfo,
  media: fileData,
  fields: 'id, name, mimeType, createdTime'
}).then(response => console.log(response))

The file gets created but it’s empty. It’s named ‘Untitled’ and has a mimeType of ‘application/octet-stream’. What am I doing wrong? How can I make sure the file uploads correctly with the right name and content? Any help would be appreciated!

2

I’ve encountered similar issues when working with the Google Drive API. The problem likely stems from how you’re handling the file data. Instead of passing the file directly, you should use a FileReader to read the file contents and then upload that.

Here’s an approach that’s worked for me:

const reader = new FileReader();
reader.onload = (e) => {
  const fileContent = e.target.result;
  gapi.client.drive.files.create({
    resource: { name: myFile.name, parents: [folderID] },
    media: { mimeType: myFile.type, body: fileContent },
    fields: 'id, name, mimeType, createdTime'
  }).then(response => console.log(response));
};
reader.readAsArrayBuffer(myFile);

This method ensures the file content is properly read and uploaded. Make sure you’re also authenticated correctly and have the necessary scopes enabled for file creation.

3

hey, i’ve had luck using the google drive api with the multipart upload method. it’s pretty straightforward:

const form = new FormData();
form.append('metadata', new Blob([JSON.stringify({ name: myFile.name, parents: [folderID] })], { type: 'application/json' }));
form.append('file', myFile);

fetch('https://www.googleapis.com/upload/drive/v3/files?uploadType=multipart', {
  method: 'POST',
  headers: { 'Authorization': 'Bearer ' + accessToken },
  body: form
}).then(response => response.json()).then(data => console.log(data));

this should work for ya. good luck!

4

I’ve been using the Google Drive API for a while now, and I can share what’s worked well for me. Instead of using gapi.client.drive.files.create(), I’ve had better success with the resumable upload method. It’s more reliable for larger files and handles interruptions better.

Here’s a simplified version of what I use:

async function uploadFile(file, folderId) {
  const metadata = {
    name: file.name,
    mimeType: file.type,
    parents: folderId ? [folderId] : []
  };

  const res = await gapi.client.drive.files.create({
    resource: metadata,
    media: {
      mimeType: file.type,
      body: file
    },
    fields: 'id, name, mimeType, createdTime',
    uploadType: 'resumable'
  });

  return res.result;
}

This approach has been rock-solid for me. It handles the file upload correctly, preserves the name and mime type, and works for files of various sizes. Just make sure you have the right scopes and authentication set up.