I am trying to load the google drive picker API in my project. This source code is taken from Google Picker Code Sample This is my source code.
gapiLoaded() {
window['gapi'].load('client:picker', this.intializePicker);
}
async intializePicker() {
await window['gapi'].client.load('https://www.googleapis.com/discovery/v1/apis/drive/v3/rest');
}
gisLoaded() {
this.tokenClient = window['google'].accounts.oauth2.initTokenClient({
client_id: MY_Client_Id,
scope: 'https://www.googleapis.com/auth/drive.readonly',
callback: '', // defined later
});
this.gisInited = true;
}
handleAuthClick() {
this.tokenClient.callback = async (response) => {
if (response.error !== undefined) {
throw (response);
}
this.accessToken = response.access_token;
this.createPicker();
};
if (this.accessToken === null) {
this.tokenClient.requestAccessToken({prompt: 'consent'});
} else {
this.tokenClient.requestAccessToken({prompt: ''});
}
}
createPicker() {
var view = window['google'].picker.View(window['google'].picker.ViewId.DOCS);
var picker = window['google'].picker.PickerBuilder()
.enableFeature(window['google'].picker.Feature.NAV_HIDDEN)
.enableFeature(window['google'].picker.Feature.MULTISELECT_ENABLED)
.setDeveloperKey('MY_APP_KEY')
.setAppId('MY_PROJECT_ID')
.setOAuthToken(this.accessToken)
.addView(view)
.addView( window['google'].picker.DocsUploadView())
.setCallback(this.pickerCallback)
.build();
picker.setVisible(true);
}
async pickerCallback(data) {
if (data.action === window['google'].picker.Action.PICKED) {
let text = `Picker response: \n${JSON.stringify(data, null, 2)}\n`;
const document = data[window['google'].picker.Response.DOCUMENTS][0];
const fileId = document[window['google'].picker.Document.ID];
console.log(fileId);
const res = await window['gapi'].client.drive.files.get({
'fileId': fileId,
'fields': '*',
});
text += `Drive API response for first document: \n${JSON.stringify(res.result, null, 2)}\n`;
console.log(text)
}
}
When I run this code, I am getting this error "this.Qi is not a function". The error arise at Picker builder function. How to resolve this?