creating a folder inside existing folder in google drive using Javascript Code Answer

Hello Developer, Hope you guys are doing great. Today at Tutorial Guruji Official website, we are sharing the answer of creating a folder inside existing folder in google drive using Javascript without wasting too much if your time.

The question is published on by Tutorial Guruji team.

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

Answer

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")
      
    • To

        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 });
      

References:

We are here to answer your question about creating a folder inside existing folder in google drive using Javascript - If you find the proper solution, please don't forgot to share this with your team members.

Related Posts

Tutorial Guruji