I am intgrating google Calendar with Angular UI Calendar, to get the data of events of google Calendar This is my HTML
<div ng-controller="newCalendarCtrl">
<button ng-click="handleAuthClick()">Authorize</button>
<script src="https://apis.google.com/js/client.js"></script>
</div>
And this is my JS
angular.module('loginApp').controller('newCalendarCtrl', function ($scope, $log) {
var clientId = '*******'
//var apiKey = '{API KEY}';
var scopes = 'https://www.googleapis.com/auth/calendar';
function handleAuthResult(authResult) {
console.log(authResult);
var authorizeButton = document.getElementById('authorize-button');
if (authResult && !authResult.error) {
// authorizeButton.style.visibility = 'hidden';
makeApiCall();
} else {
authorizeButton.style.visibility = '';
authorizeButton.onclick = handleAuthClick;
}
}
$scope.handleAuthClick=function (event) {
gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: false}, handleAuthResult);
return false;
}
function makeApiCall() {
gapi.client.load('calendar', 'v3', function() {
var request = gapi.client.calendar.calendarList.list();
request.execute(function(resp){
$.each( resp.items, function( key, value ) {
console.log(resp.items[key].id);
});
});
var request1 = gapi.client.calendar.events.list({
'calendarId': 'primary',
'timeMin': '2015-12-23T04:26:52.000Z'//Suppose that you want get data after 23 Dec 2014
});
request1.execute(function(resp){
$.each( resp.items, function( key, value ) {
console.log(resp.items[key].id);
});
});
});
}
});
When I try to acces the data upon click Authorize Button then it goes to google login and login procedure proceed successfully but when response come then Error message comes on my page origin-mismatch .