I'm working on a Google Drive integration that allows users to select files using the Google Picker API on the frontend and then sends the file information to the backend for downloading and uploading to S3.

To avoid the restricted scopes like and .readonly, I am using the Picker API to get file details, including the downloadUrl.

Here’s my frontend code for the Picker:

const pickerCallback = async (data) => {
  if (data.action === window.google.picker.Action.PICKED) {
    const files = data.docs.map((doc) => ({
      id: doc.id,
      name: doc.name,
      mimeType: doc.mimeType,
      size: doc.sizeBytes,
      downloadUrl: doc.url,
    }));

    console.log("Files selected:", files);
    // Send file details to the backend for downloading
  }
};

On the backend, I attempt to download the file using fetch with the access token:

async function downloadFileUsingUrl(downloadUrl: string, accessToken: string): Promise<NodeJS.ReadableStream> {
  const response = await fetch(downloadUrl, {
    headers: {
      Authorization: `Bearer ${accessToken}`,
    },
  });

  console.log(`Download API response status: ${response.status} ${response.statusText}`);

  if (!response.ok) {
    console.error(`Download API error response: ${await response.text()}`);
    throw new Error(`Failed to download file: ${response.statusText}`);
  }

  return response.body as unknown as NodeJS.ReadableStream;
}

Despite providing the access token in the Authorization header, I receive the following error:

Download API response status: 401 Unauthorized
Download API error response: ...
Failed to download file: Unauthorized

What I’ve Tried:

1. Using the downloadUrl provided by Google Picker.
2. Confirmed that the access token is valid and works for other requests.
3. Adjusted headers to mimic a browser request (e.g., adding Referer, User-Agent) but still get a 401.
4. Considered alternative APIs but want to avoid restricted scopes due to the security assessment requirements.

Questions:

1. How can I download files using the Picker API without restricted scopes like ?
2. Is there another way to handle this flow without triggering restricted scope requirements?

Any insights or alternative approaches would be greatly appreciated!

I'm working on a Google Drive integration that allows users to select files using the Google Picker API on the frontend and then sends the file information to the backend for downloading and uploading to S3.

To avoid the restricted scopes like https://www.googleapis/auth/drive and https://www.googleapis/auth/drive.readonly, I am using the Picker API to get file details, including the downloadUrl.

Here’s my frontend code for the Picker:

const pickerCallback = async (data) => {
  if (data.action === window.google.picker.Action.PICKED) {
    const files = data.docs.map((doc) => ({
      id: doc.id,
      name: doc.name,
      mimeType: doc.mimeType,
      size: doc.sizeBytes,
      downloadUrl: doc.url,
    }));

    console.log("Files selected:", files);
    // Send file details to the backend for downloading
  }
};

On the backend, I attempt to download the file using fetch with the access token:

async function downloadFileUsingUrl(downloadUrl: string, accessToken: string): Promise<NodeJS.ReadableStream> {
  const response = await fetch(downloadUrl, {
    headers: {
      Authorization: `Bearer ${accessToken}`,
    },
  });

  console.log(`Download API response status: ${response.status} ${response.statusText}`);

  if (!response.ok) {
    console.error(`Download API error response: ${await response.text()}`);
    throw new Error(`Failed to download file: ${response.statusText}`);
  }

  return response.body as unknown as NodeJS.ReadableStream;
}

Despite providing the access token in the Authorization header, I receive the following error:

Download API response status: 401 Unauthorized
Download API error response: ...
Failed to download file: Unauthorized

What I’ve Tried:

1. Using the downloadUrl provided by Google Picker.
2. Confirmed that the access token is valid and works for other requests.
3. Adjusted headers to mimic a browser request (e.g., adding Referer, User-Agent) but still get a 401.
4. Considered alternative APIs but want to avoid restricted scopes due to the security assessment requirements.

Questions:

1. How can I download files using the Picker API without restricted scopes like https://www.googleapis/auth/drive?
2. Is there another way to handle this flow without triggering restricted scope requirements?

Any insights or alternative approaches would be greatly appreciated!

• node.js
• google-drive-api
• authorization
• google-picker

Share Improve this question Follow asked Nov 19, 2024 at 8:41 Andrew Andrew 4144 bronze badges 2

• There is no workaround because it will still use a restrictive scope to download a file. To do anything, it will follow the Drive API Scopes documentation. – leylou Commented Nov 19, 2024 at 14:49
• Have you checked this Choose Google Drive API scopes and Question about the restricted scope of Google Drive? Does this similar issue answer your question? – leylou Commented Nov 19, 2024 at 18:30

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

From documentation https://developers.google/drive/picker/guides/sample

Go to https://console.cloud.google/iam-admin/settings Use Project number for APP_ID in

new google.picker.PickerBuilder()
 .setAppId(APP_ID)

Then in pickerCallback

const urls = data.docs.map(document => 'https://www.googleapis/drive/v3/files/' + document.id + '?alt=media')

Then use the token you received during authorization and the download links.

example download

https://stackoverflow/a/45324466/19596385

https://stackoverflow/a/36215442

https://stackoverflow/a/32176235/19596385

https://stackoverflow/a/45792545/19596385