I plan to have a webapp for user to upload file to my drive. I create a service account and get the OAuth token for Google Picker. I confirm the access token is vaild. However, Google Picker API returns 403. It only works if I login with my account ('[email protected]').
I have searched many days, but still do not have a solution for that. Any comments are appreciated.
Here is my code.
<?php
require_once '/vendor/autoload.php';
use Google\Client;
use Google\Service\Drive;
$client = new Client();
$client->setAuthConfig('service_account.json');
$client->setApplicationName("GooglePickerAPI");
$client->setScopes(['https://www.googleapis.com/auth/drive.file']);
$client->setSubject('[email protected]');
$client->setAccessType('offline');
$client->authorize()->get('https://www.googleapis.com/auth/drive.file');
// Get the access token
$accessToken = $client->getAccessToken();
$accessTokenJson = json_encode($accessToken);
?>
<!DOCTYPE html>
<html>
<head>
<title>Picker API Quickstart</title>
<meta charset="utf-8" />
</head>
<body>
<p>Picker API API Quickstart</p>
<!--Add buttons to upload-->
<button id="authorize_button" onclick="createPicker()">Upload</button>
<pre id="content" style="white-space: pre-wrap;"></pre>
<script type="text/javascript">
let response = <?php echo $accessTokenJson; ?>
const SCOPES = 'https://www.googleapis.com/auth/drive.file';
const CLIENT_ID = 'MY_CLIENT_ID';
const API_KEY = 'MY_API_KEY';
const APP_ID = 'MY_APP_ID';
let accessToken = response['access_token'];
document.getElementById('authorize_button').style.visibility = 'visible';
/**
* Create and render a Picker object for searching images.
*/
function createPicker() {
const view = new google.picker.View(google.picker.ViewId.DOCS);
view.setMimeTypes('image/png,image/jpeg,image/jpg');
const picker = new google.picker.PickerBuilder()
.enableFeature(google.picker.Feature.NAV_HIDDEN)
.enableFeature(google.picker.Feature.MULTISELECT_ENABLED)
.setDeveloperKey(API_KEY)
.setAppId(APP_ID)
.setOAuthToken(accessToken)
.addView(view)
.addView(new google.picker.DocsUploadView())
.setCallback(pickerCallback)
.build();
picker.setVisible(true);
}
/**
* Displays the file details of the user's selection.
* @param {object} data - Containers the user selection from the picker
*/
async function pickerCallback(data) {
if (data.action === google.picker.Action.PICKED) {
let text = `Picker response: \n${JSON.stringify(data, null, 2)}\n`;
const document = data[google.picker.Response.DOCUMENTS][0];
const fileId = document[google.picker.Document.ID];
console.log(fileId);
const res = await gapi.client.drive.files.get({
'fileId': fileId,
'fields': '*',
});
text += `Drive API response for first document: \n${JSON.stringify(res.result, null, 2)}\n`;
window.document.getElementById('content').innerText = text;
}
}
</script>
<script type="text/javascript" src="https://apis.google.com/js/api.js?onload=onApiLoad"></script>
<script>gapi.load("picker", "1");</script>
</body>
</html>
This seems a recent issue and is happening globally. This might not have anything with the code, its issue from Google itself. Please find the below link to track this issue. https://issuetracker.google.com/issues/328843663
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With