0

我在 Angular 11 应用程序中使用 Google Drive File Picker。我正在使用所有浏览器的最新发布版本的 https://localhost 在 MacOS 上运行。它适用于我在 Chrome、Firefox 和 Safari 上，但在 Edge 中，当我尝试打开选择器时，我在控制台中收到以下错误：

在此处输入图像描述

我在应用程序中得到了这个：

在此处输入图像描述

在 MacOS 上安装 Edge 是干净的，我没有摆弄任何设置。

我正在使用 Angular 服务打开文件选择器，它看起来像这样：

    // this service is based on based on https://stackoverflow.com/questions/51522954/angular-6-google-picker-api-popup
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 = '***';
    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 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) });
    }

    private onAuthApiLoad(): void {
        gapi.auth.authorize({
            'client_id': this.clientId,
            'scope': this.scope,
            'immediate': false,
        }, this.handleAuthResult.bind(this));
    }

    private onPickerApiLoad(): void {
        this.pickerApiLoaded = true;
        this.createPicker();
    }

    private handleAuthResult(authResult): void {
        if (authResult && !authResult.error) {
            this.oauthAccessToken = authResult.access_token;
            this.createPicker();
        } else {
            console.warn('authResult', authResult);
        }
    }

    private createPicker(): void {
        if (this.pickerApiLoaded && this.oauthAccessToken) {
            const view = new google.picker.View(google.picker.ViewId.DOCS);
            
            // this code can be used to display folders (but unfortunately not in a folder tree)
            // const docsView = new google.picker.DocsView()
            //     .setIncludeFolders(true)
            //     .setMimeTypes('application/vnd.google-apps.folder, application/pdf')
            //     .setSelectFolderEnabled(true);

            const 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();
            picker.setVisible(true);
        }
    }
}

任何想法为什么这在 Edge 中不起作用？

4

0 回答 0