So I am trying to start a API call to the Google Picker API, and I can connect my account, but after that it says my API key is invalid.
The API and client numbers are the exact ones found within my Google developer console and the API was created for a web browser app.
This is in the console:
Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('https://docs.google.com') does not match the recipient window's origin ('http://w1nz.co').
Uncaught ReferenceError: init is not defined
I have tracked this error to happen when the PickerBuilder is at the .build() line.
You can view this live at http://w1nz.co/polymer-app/
This is a Polymer HTML5 Web Component so whatever is within the <template> tags is rendered to the page.
My Code:
<link rel="import" href="/polymer-app/bower_components/polymer/polymer.html">
<polymer-element name="drive-save" noscript>
<template>
<script src="https://apis.google.com/js/platform.js"></script>
<script>
var clientId = '185720521988-0vifnru5llc3mqj1k7evil99vnghagid.apps.googleusercontent.com';
var developerKey = 'AIzaSyDDTPAGVNFWG2czBBx8QFjn4Vg3KZoEccE';
var oauthToken;
function onApiLoad() {
gapi.load('auth', authenticateWithGoogle);
gapi.load('picker');
}
function authenticateWithGoogle() {
window.gapi.auth.authorize({
'client_id': clientId,
'scope': ['https://www.googleapis.com/auth/drive']
}, handleAuthentication);
}
function handleAuthentication(result) {
console.log(result);
if(result && !result.error) {
oauthToken = result.access_token;
setupPicker();
}
}
function setupPicker() {
var picker = new google.picker.PickerBuilder().
.addView(new google.picker.DocsUploadView())
setOAuthToken(oauthToken).
setDeveloperKey(developerKey).
setCallback(pickerCallback).
build();
picker.setVisible(true);
}
function pickerCallback(data) {
console.log(data);
if (data.action == google.picker.Action.PICKED) {
alert(data.docs[0].name);
} else if (data.action == google.picker.Action.CANCEL) {
alert('goodbye');
}
}
</script>
<script src="https://apis.google.com/js/api.js?onload=onApiLoad"></script>
<p>Hello World</p>
</template>
</polymer-element>
