I'm trying to access a Google Drive folder in my React app, but getting an empty array back in the payload. Should I change the fields to fix it? Or is the q query wrong?
import axios from 'axios';
import { IImage } from '../interfaces/Image.interface';
const GOOGLE_DRIVE_API_KEY = 'XXX';
const GOOGLE_DRIVE_FOLDER_ID = 'XXX';
export const fetchImages = async () => {
try {
const response = await axios.get(
`https://www.googleapis.com/drive/v3/files`,
{
params: {
q: `'${GOOGLE_DRIVE_FOLDER_ID}' in parents and mimeType contains 'image/'`,
key: GOOGLE_DRIVE_API_KEY,
fields: 'files(id,name,webContentLink,mimeType)',
},
}
);
const files = response.data.files;
const images: IImage[] = files.map((file: any) => ({
id: file.id,
name: file.name,
url: `https://drive.google.com/uc?export=view&id=${file.id}`,
mimeType: file.mimeType,
}));
return images;
} catch (error) {
console.error('Error fetching images from Google Drive:', error);
return [];
}
};