creating a folder inside existing folder in google drive using Javascript

I am creating an application using asp.net mvc and javascript in which I want to create folders inside my existing google drive folder.

below is my code which I got from stackoverflow

function createFolder() {
    var body = {
        'title': document.getElementById('txtFolderName').value,
        'mimeType': "application/vnd.google-apps.folder"
    };

    var request = gapi.client.drive.files.insert({
        'resource': body
    });

    request.execute(function (resp) {
        console.log('Folder ID: ' + resp.id);
    });
}

I am getting the below error

index.html:61 Uncaught TypeError: Cannot read properties of undefined (reading 'files')

on the following line

var request = gapi.client.drive.files.insert({

here gapi.client.drive is appearing to be undefined

below is my code to authenticate and load google api client

function authenticate(callback) {
    return gapi.auth2.getAuthInstance()
        .signIn({ scope: "https://www.googleapis.com/auth/documents https://www.googleapis.com/auth/drive https://www.googleapis.com/auth/drive.file" })
        .then(function () {
            console.log("Sign-in successful");
            callback == undefined ? '' : callback();
        },
            function (err) {
                console.error("Error signing in", err);
            });
}
function loadClient() {
    gapi.client.setApiKey("APIKEY");
    return gapi.client.load("https://docs.googleapis.com/$discovery/rest?version=v1")
        .then(function () {
            console.log("GAPI client loaded for API");
        },
            function (err) {
                console.error("Error loading GAPI client for API", err);
            });
}

what is the problem here?

and what I need to do if I want to create a folder inside another folder?

thanks in advance

Solution

I thought that in your script, https://docs.googleapis.com/$discovery/rest?version=v1 of gapi.client.load("https://docs.googleapis.com/$discovery/rest?version=v1") is used for Google Docs API v1. I think that the reason for your error message of Uncaught TypeError: Cannot read properties of undefined (reading 'files') is due to this.

In your goal, it seems that you want to create a folder into a specific folder. In this case, please use Drive API. But, when I saw your current script for creating the folder, Drive API v2 is used. So, please modify as follows.

From:

return gapi.client.load("https://docs.googleapis.com/$discovery/rest?version=v1")

To:

return gapi.client.load("https://www.googleapis.com/discovery/v1/apis/drive/v2/rest")

By this modification, I thought that your createFolder() works. But in your current createFolder(), the folder is created to the root folder. When you want to create the folder into a specific folder, please modify the request body as follows.
```
  var body = {
    'title': document.getElementById('txtFolderName').value,
    'mimeType': "application/vnd.google-apps.folder",
    'parents': [{'id': '###folderId###'}]
  };
```

Note:

As additional information, if you want to use Drive API v3, please modify it as follows.

From

  return gapi.client.load("https://docs.googleapis.com/$discovery/rest?version=v1")

  return gapi.client.load("https://www.googleapis.com/discovery/v1/apis/drive/v3/rest")

And, please modify createFolder() as follows.

  var body = {
    'name': document.getElementById('txtFolderName').value,
    'mimeType': "application/vnd.google-apps.folder",
    'parents': ['###folderId###']
  };

  var request = gapi.client.drive.files.create({ 'resource': body });

creating a folder inside existing folder in google drive using Javascript

From:

To:

Note:

References: