CODEWITHSUNDEEP
javascriptapifile-uploadgoogle-drive-apihttprequest
Frelseren
Frelseren

Reputation: 531

Anyone to upload a file to my Google Drive public folder using JavaScript

I'm new to Google API. My goal is to allow website users to upload a file to our public Google Drive folder. I should do it on a client side.

I understand that it's not secure, but the team is pushing me to do it on a front-end.

I've read and tried different solutions (from StackOverflow answers as well), nothing works.

I've also checked Google Drive API documentation: https://developers.google.com/drive/v3/web/manage-uploads

The request should like:

POST /upload/drive/v3/files?uploadType=media HTTP/1.1
Host: www.googleapis.com
Content-Type: image/jpeg
Content-Length: number_of_bytes_in_file
Authorization: Bearer your_auth_token

JPEG data

I've tried to make a simple HTTP POST request in JavaScript, but couldn't set the Host header (unsecured header error).

Is your_auth_token a client secret?

Any ideas how can I accomplish that?

Upvotes: 1

Views: 2003

Answers (1)

Jonathan Newton
Jonathan Newton

Reputation: 840

You need to create a Google app to get your auth_token stick that in your request header and that should work fine.

How authorization works At a high-level, all apps follow the same basic authorization pattern:

  1. Register the application in the Google API Console.
  2. Request that the user grant access to data in their Google account.
  3. If the user consents, your application requests and receives credentials to
  4. Access the Drive API.
  5. Refresh the credentials (if necessary).

Creating new authentication

  1. From the Credentials page, click Create credentials > OAuth client ID to create your OAuth 2.0 credentials or Create credentials > Service account key to create a service account.
  2. If you created an OAuth client ID, then select your application type. Fill in the form and click Create.

Client keys are stored in here:

https://console.developers.google.com/flows/enableapi?apiid=drive&safe=vss&credential=client_key

Futher Documentation

https://developers.google.com/drive/v2/web/about-auth

Upvotes: 1

Related Questions