Google Drive API Picker v3 (May 2018) window disappears and gives .split is not a function error

问题

Using Google Drive API Picker v3, Chrome Version 66.0.3359.139

Each account can log into their account one time and one time only.
You can switch back and forth between accounts, but if you try to access the same account 2 times in a row... it will fail with the .split is not a function.

There seems to be an error when the oauthToken attempts to be parsed back on the client side.

Why is the auth not updating? Is there a setting or something I am missing?

Chrome stack trace:

3723580519-idpiframe.js:26 Uncaught TypeError: (b || "").split is not a function
at Xa (3723580519-idpiframe.js:26)
at 3723580519-idpiframe.js:61
at 3723580519-idpiframe.js:55
at eb.h.getItem (3723580519-idpiframe.js:35)
at Ib.Q.o (3723580519-idpiframe.js:55)
at Ib.o (3723580519-idpiframe.js:61)
at Sb (3723580519-idpiframe.js:68)
at W.h.kb (3723580519-idpiframe.js:76)
at Object.A (3723580519-idpiframe.js:83)
at Jb.Cb (3723580519-idpiframe.js:63)

Here is my code:

var clientId = 'stuff.apps.googleusercontent.com';
var scope = ['https://www.googleapis.com/auth/drive.readonly'];
var appId = "my-app-id";
var pickerApiLoaded = false;

function loadPicker() { //called when js api loads
    gapi.load('auth2', { 'callback': onAuthApiLoad });
    gapi.load('picker', { 'callback': onPickerApiLoad });
}

function onAuthApiLoad() {
    var authBtn = document.getElementById('accessGoogleDrive');
    authBtn.disabled = false;
    authBtn.addEventListener('click', function () {
        gapi.auth2.authorize({
            client_id: clientId,
            scope: scope,
            //prompt: "consent"
            'immediate':false
        }, handleAuthResult);
    });
}

function onPickerApiLoad() {
    pickerApiLoaded = true;
}

function handleAuthResult(authResult) {
    console.log("handleAuthResult", authResult);
    if (authResult && !authResult.error) {
        createPicker(authResult.access_token);
    }
}

// Create and render a Picker object for searching images.
function createPicker(oauthToken) {
    if (pickerApiLoaded && oauthToken) {
        console.log("Creating Picker for Google Drive...");
        var view = new google.picker.View(google.picker.ViewId.PDFS);
        var picker = new google.picker.PickerBuilder()
            .setAppId(appId)
            .setOrigin("http://localhost:8080")
            .setOAuthToken(oauthToken)
            .addView(view)
            .setCallback(pickerCallback)
            .build();
        picker.setVisible(true);
    }
}

// A simple callback implementation.
function pickerCallback(data) {
    console.log("Successfully picked: ", data);
    if (data.action == google.picker.Action.PICKED) {
        var fileId = data.docs[0].id;
        alert('The user selected: ' + fileId);
    }
}

//Google APIs script: "https://apis.google.com/js/api.js?onload=loadPicker"

THANKS IN ADVANCE!

回答1:

Change

var scope = ['https://www.googleapis.com/auth/drive.readonly'];

var scope = 'https://www.googleapis.com/auth/drive.readonly';

as per https://github.com/google/google-api-javascript-client/issues/13#issuecomment-290129284

来源：https://stackoverflow.com/questions/50123733/google-drive-api-picker-v3-may-2018-window-disappears-and-gives-split-is-not

标签

javascript

google-drive-api

google-picker