已保存用户名和密码的 Google Picker API答案

【问题标题】：Google Picker API with already saved username and password已保存用户名和密码的 Google Picker API
【发布时间】：2016-06-25 02:28:18
【问题描述】：

我已经实现了Google Picker API，它会弹出一个窗口询问Google authentication，然后向我们显示Google Drive 中所有可用的文件。一切正常。

但现在我的要求是，我需要访问驱动器中的文件，而无需弹出身份验证。我会将用户名和密码保存在我的数据库中。

有没有办法传递用户凭据并获得授权和访问文件？

我的代码：

<script>
  function onApiLoad() {
    gapi.load('auth', { 'callback': onAuthApiLoad });
    gapi.load('picker');
  }

function onAuthApiLoad() {
   window.gapi.auth.authorize({                         
   'client_id': 'xxxx.apps.googleusercontent.com',
   'scope': ['https://www.googleapis.com/auth/drive']
    }, handleAuthResult);
}

var oauthToken;
function handleAuthResult(authResult) {
   if (authResult && !authResult.error) {
      oauthToken = authResult.access_token;
      createPicker();
   }
}


function createPicker() {                    
   var picker = new google.picker.PickerBuilder()
                .addView(new google.picker.DocsUploadView())
                .addView(new google.picker.DocsView())                        
                .setOAuthToken(oauthToken)
                .setDeveloperKey('xxxx')                           
                .enableFeature(google.picker.Feature.MULTISELECT_ENABLED)
                .addView(new google.picker.VideoSearchView().setSite(google.picker.VideoSearchView.YOUTUBE))
                .setCallback(pickerCallback)
                .build();
                 picker.setVisible(true);
      }
</script>

【问题讨论】：

请注意，如果没有非常非常好的具体原因，您不应存储 Google 密码。如果这只是你自己的一个项目，那还不错，但你真的不应该为其他用户做。
您应该存储刷新令牌而不是用户名和密码。它是开放身份验证的重点。

标签： javascript asp.net google-api google-picker

【解决方案1】：

在创建选择器时，即 createpicker() 发送访问令牌，以便它不会提示同意屏幕。在您的代码中将 createpicker() 更改为 createPicker(oauthToken)。请找到示例代码sn-p：

function createPicker(token) {
 if (pickerApiLoaded && token) {


 var picker = new google.picker.PickerBuilder()
       .addView(new google.picker.DocsView().setIncludeFolders(true)) //All files and Folders            

     .setOAuthToken(token)//Access Token

     .setDeveloperKey(DEVELOPER_KEY)
     .setCallback(pickerCallback)
     // Instruct Picker to fill the dialog, minus 2 pixels for the border.
     .setSize(DIALOG_DIMENSIONS.width ,
         DIALOG_DIMENSIONS.height )
     .build();
 picker.setVisible(true);
} else {
 showError('Unable to load the file picker.');
}
}

【讨论】：

我们怎样才能得到 pickerApiLoaded= true ？
@SGC 这并不能解决问题。我面临着类似的问题。即使在发送访问令牌后，也会出现一个身份验证屏幕，您必须在其中提供用户名和密码

【解决方案2】：

通过传递您的 access_token 尝试以下代码..

    function createPicker(access_token) {
 if (access_token) {
  var picker = new google.picker.PickerBuilder()
            .addView(new google.picker.DocsUploadView())
            .addView(new google.picker.DocsView())                        
            .setOAuthToken(access_token)
            .setDeveloperKey('xxxx')                           
            .enableFeature(google.picker.Feature.MULTISELECT_ENABLED)
            .addView(new google.picker.VideoSearchView().setSite(google.picker.VideoSearchView.YOUTUBE))
            .setCallback(pickerCallback)
            .build();
             picker.setVisible(true);
} else {
 showError('Unable to load the file picker.');
}
}

【讨论】：