CODEWITHSUNDEEP
javascriptgoogle-picker
Casey
Casey

Reputation: 2719

Google picker API no longer allowing sign-in

I have a google picker API setup that is working well on my local machine. It also worked well in a deployed environment for a week or two, but now it's causing errors. I did not change anything in the google developer console prior to this new error happening.

The error I am getting is "In order to select files, you must sign in to your Google account." When you try to sign in a window flashes in the background then closes before you can see what it is. After you try a few times you get an error of:

400. That’s an error.

The server cannot process the request because it is malformed. It should not be retried. That’s all we know.

In the console, when you try to sign in an error comes up that says:

Uncaught Error: ub
    at m=opnc:1061
    at e.O (m=opnc:402)
    at Hfa (m=opnc:405)
    at Dfa (m=opnc:405)
    at _.ik.Yx (m=opnc:405)
    at tfa (m=opnc:396)

Any idea what I am doing wrong? Here is my code:

<script type="text/javascript">
var developerKey = my_developer_key;
var clientId = my_client_id;
var appId = my_google_app_id;

// Scope to use to access user's Drive items.
var scope = ['https://www.googleapis.com/auth/drive.file'];

var pickerApiLoaded = false;
var oauthToken;
var tryImmediate = false;

// Use the Google API Loader script to load the google.picker script.
function loadPicker() {
  oauthToken = null;
  $('#select_file').focus(function() {
        this.blur();
    });
  gapi.load('auth', {'callback': onAuthApiLoad});
  gapi.load('picker', {'callback': onPickerApiLoad});
}

function onAuthApiLoad() {
  window.gapi.auth.authorize(
      {
        'client_id': clientId,
        'scope': scope,
        'immediate': true
      },
      handleAuthResult);
}

function onPickerApiLoad() {
  pickerApiLoaded = true;
  createPicker();
}

function handleAuthResult(authResult) {
  if (authResult && !authResult.error) {
    oauthToken = authResult.access_token;
    createPicker();
  } else if (tryImmediate===false) {
      // try with immediate false if user is not logged in
      tryImmediate = true;
      window.gapi.auth.authorize(
      {
        'client_id': clientId,
        'scope': scope,
        'immediate': false
      },
      handleAuthResult);
  }
}

// create and render a picker object
function createPicker() {
  if (pickerApiLoaded && oauthToken) {
    var folderID = my_folder_id;
    var view = new google.picker.DocsView().setIncludeFolders(true).setParent(folderID);
    var picker = new google.picker.PickerBuilder()
        .enableFeature(google.picker.Feature.NAV_HIDDEN)
        .setAppId(appId)
        .setOAuthToken(oauthToken)
        .addView(view)
        .setDeveloperKey(developerKey)
        .setCallback(pickerCallback)
        .build();
     picker.setVisible(true);
  }
}

// A simple callback implementation.
function pickerCallback(data) {
  if (data.action == google.picker.Action.PICKED) {
    var fileName = data.docs[0].name;
    var fileID = data.docs[0].id;
    $('#fileName').val(fileName);
    $('#fileID').val(fileID);
    $('#file').text('File selected: ' + fileName);
  }
  validateForm()
}
</script>

Which is launched with this button:

<input id="select_file" onClick="loadPicker(); return false;" value="Select File" class="btn">

Upvotes: 3

Views: 1158

Answers (3)

N. Raj
N. Raj

Reputation: 457

I was using OAuth access_token for authentication.

I just had to do a fresh login and then test it because my token expiry was very short and was causing all the issues.

Upvotes: 0

falconizer
falconizer

Reputation: 418

As a reference for anyone coming from a google search, if you're getting this error and you are unable to get the picker dialog to show any files, make sure you have properly defined the scope part of the authorization. Specifically, make sure https://www.googleapis.com/auth/drive.file is included in the list of scopes.

Upvotes: 0

ale13
ale13

Reputation: 6062

Since this is happening only for one particular user it would be best to analyze this behavior on their end and if needed reach out to Google Workspace Support by choosing one of the options from this article here.

Upvotes: 0

Related Questions