Upload JSON data with Google Drive API in the browser

Question

The Google Drive API lets us upload JSON files like that:

const fileMetadata = {
  name: "config.json",
};

const media = {
  mimeType: "application/json",
  body: fs.createReadStream("files/config.json"),
};

const file = await gapi.client.files.create({
  resource: fileMetadata,
  media: media,
  fields: "id",
});

console.log("File Id:", file.data.id);

This works fine in Node.js, but i want this to run in the browser, however, when i pass the media argument, with the body set to a string, an empty Untitled file is created without any extension. The filename only works when media is not present.

My question is: How to pass data for a JSON from a string, so it can be read later?

I already tried creating the file and updating it later with its ID.

score 0 · Answer 1 · answered May 07 '23 at 11:42

I used

body: new Blob([JSON.stringify(payload, null, 2)], {
            type: "application/json",
          })

and did run into the same problem in the browser as you (untitled, empty file).

I ended up using plain POST, see Google Drive API creates empty 'Untitled' file with browser version

In the end plain HTTP is easier to understand and better documented by Google.

Upload JSON data with Google Drive API in the browser

1 Answers1