Upload and Name a File Using Google Drive REST API v3 and Angular 2

Question

I'm creating a Google Drive service using the Drive REST Api v3 in Angular 2. Most of the functionality is in place: view file, download, create etc.. but I cannot find how to name a file (either when creating a file or updating).

I'm using the following docs pages: create and update. They say the file name should be part of the request body. The relevant code from my Google Drive service is bellow.

createFile(name :string, content :string) :Promise<Object> {
    let headers = new Headers({
      'Content-Type': 'text/markdown',
      'Authorization': 'Bearer ' + this.token,
      'name': name //TODO name not working!
    });
    let options = new RequestOptions({ headers: headers }); // Create a request option

    return this.http
      .post('https://www.googleapis.com/upload/drive/v3/files' + '?uploadType=multipart', content, options)
      .toPromise();
  }

updateFile(id :string, content :string, name :string) :Promise<Object> {
    let headers = new Headers({
      'Content-Type': 'text/markdown',
      'Authorization': 'Bearer ' + this.token,
      'id': id,
      'name': name //TODO name not working!
    }); //generate headers
    let options = new RequestOptions({ headers: headers }); // Create a request option

    return this.http
      .patch('https://www.googleapis.com/upload/drive/v3/files/' + id + '?uploadType=multipart', content, options)
      .toPromise();
  }

To summarise files are being created and updated fine (including content) but naming and renaming a file doesn't work at all.

Thanks for any help.

What is an api that allows renaming files? – Roman C Jan 05 '17 at 19:08 — Roman C, Jan 05 '17 at 19:08

score 1 · Accepted Answer · edited Jun 20 '20 at 09:12

Try placing name in the request body and not in the request header as described in the Files: create:

Request body

In the request body, supply a Files resource with the following properties as the metadata. For more information, see the document on media upload.

To test it, try using API Explorer to help you explore various Google APIs interactively.

Sample Request:

POST https://www.googleapis.com/drive/v3/files?key={YOUR_API_KEY}

{
"name": "My File"
}

Response:

200

{

"kind": "drive#file",
"id": "fileID",
"name": "My File"
}

There is also a related SO post that explain how to insert file to Google Drive through API.

Hope this helps.

Thanks for that, makes sense now. – James Johnson Jan 08 '17 at 12:29 — James Johnson, Jan 08 '17 at 12:29

score 1 · Answer 2 · answered Jun 03 '17 at 09:34

I also faced that problem. I think there is 3 solutions:

Use multipart upload https://developers.google.com/drive/v3/web/multipart-upload with different headers for file metadata and actual file. Me myself stuck there, didn't found how to add boundaries to separate request headers in Angular 2+
Upload file in two requests. First to create empty file with metadata (response will provide id of the file) and second to actually "update" the file.
Use resumable upload. First request to "setup metadata" (will not even create empty file) and get "special link" where to send request to upload actual file. And this approach have some other features, like uploading in chunks.https://developers.google.com/drive/v3/web/resumable-upload

Here is the link to another Question with implementation of resumable upload in Angular 2 and DRIVE REST API V3

Angular 2+ HTTP POST and GDrive API. Resumable file upload with name

I hope it might be useful.

score 0 · Answer 3 · answered Jan 06 '17 at 09:22

You are trying to set the name using an http header. This is wrong. I can't begin to understand how you thought that was the way to do it, so you need to go back and reread the Drive API documentation.

In short, the name: "name" should be a JSON object passed in the body of the request, not in an http header.

Upload and Name a File Using Google Drive REST API v3 and Angular 2

3 Answers3

Request body