我有一个 Angular 11 webapp,允许用户从 Google Drive 传输文件。要选择文件,我使用 Google Drive Picker。一切正常,除了第二次使用 Picker 时,当用户单击 Select 按钮时 Picker 对话框不会关闭(它第一次正确关闭)。
// this service is based on based on https://stackoverflow.com/questions/51522954/angular-6-google-picker-api-popup
// Google Drive file picker reference: https://developers.google.com/picker/docs/reference
import { Injectable } from '@angular/core';
declare const gapi: any;
declare const google: any;
@Injectable({
providedIn: 'root'
})
export class GoogleDriveService {
constructor() { }
// clientId and apiKey from GCP credentials page
private clientId = '****.apps.googleusercontent.com';
private apiKey = '***';
// appId = project number from developers.google.com. See "Project number" under "IAM & Admin" > "Settings"
private appId = '*****';
private scope = 'https://www.googleapis.com/auth/drive.file';
private picker: any;
public oauthAccessToken = null;
private pickerApiLoaded = false;
private pickerCallback = null;
public open(callback): void {
this.pickerCallback = callback;
gapi.load('auth', { 'callback': this.onAuthApiLoad.bind(this) });
gapi.load('picker', { 'callback': this.onPickerApiLoad.bind(this) });
}
public close() {
this.picker.setVisible(false);
this.picker.dispose();
}
private onAuthApiLoad() {
gapi.auth.authorize({
'client_id': this.clientId,
'scope': this.scope,
'immediate': false,
}, this.handleAuthResult.bind(this));
}
private onPickerApiLoad() {
this.pickerApiLoaded = true;
this.createPicker();
}
private handleAuthResult(authResult) {
if (authResult && !authResult.error) {
this.oauthAccessToken = authResult.access_token;
this.createPicker();
} else {
console.warn('authResult', authResult);
}
}
private createPicker() {
if (this.pickerApiLoaded && this.oauthAccessToken) {
// const view = new google.picker.View(google.picker.ViewId.DOCS);
const docsView = new google.picker.DocsView(google.picker.ViewId.DOCS)
.setMode(google.picker.DocsViewMode.LIST) // Display documents in a detailed list (the alternative is DocsViewMode.GRID, but that seems usesless as thumbnail generation fail)
// this code can be used to display folders (but unfortunatly not in a folder tree)
// .setIncludeFolders(true)
// .setMimeTypes('application/vnd.google-apps.folder, application/pdf')
// .setSelectFolderEnabled(true);
this.picker = new google.picker.PickerBuilder()
.enableFeature(google.picker.Feature.NAV_HIDDEN)
.enableFeature(google.picker.Feature.MULTISELECT_ENABLED)
.setAppId(this.appId)
.setOAuthToken(this.oauthAccessToken)
//.addView(view)
.addView(docsView)
//.addView(new google.picker.DocsUploadView())
.setDeveloperKey(this.apiKey)
.setCallback(this.pickerCallback)
.build();
this.picker.setVisible(true);
}
}
}
有人对为什么 Google Drive Picker 对话框在第二次使用时没有关闭有任何建议吗?