i using sample feed calendar. have created client id after run project 2 errors in console shown:
code:
<html> <head> <script type="text/javascript"> // client id can retrieved project in google // developer console, https://console.developers.google.com var client_id = '633454716537-7npq10974v964a85l2bboc2j08sc649r.apps.googleusercontent.com'; // quickstart requires read-only scope, check // https://developers.google.com/google-apps/calendar/auth if want // request write scope. var scopes = ['https://www.googleapis.com/auth/calendar.readonly']; /** * check if current user has authorized application. */ function checkauth() { gapi.auth.authorize( { 'client_id': client_id, 'scope': scopes, 'immediate': true }, handleauthresult); } /** * handle response authorization server. * * @param {object} authresult authorization result. */ function handleauthresult(authresult) { var authorizediv = document.getelementbyid('authorize-div'); if (authresult && !authresult.error) { // hide auth ui, load calendar client library. authorizediv.style.display = 'none'; loadcalendarapi(); } else { // show auth ui, allowing user initiate authorization // clicking authorize button. authorizediv.style.display = 'inline'; } } /** * initiate auth flow in response user clicking authorize button. * * @param {event} event button click event. */ function handleauthclick(event) { gapi.auth.authorize( {client_id: client_id, scope: scopes, immediate: false}, handleauthresult); return false; } /** * load google calendar client library. list upcoming events * once client library loaded. */ function loadcalendarapi() { gapi.client.load('calendar', 'v3', listupcomingevents); } /** * print summary , start datetime/date of next ten events in * authorized user's calendar. if no events found * appropriate message printed. */ function listupcomingevents() { var request = gapi.client.calendar.events.list({ 'calendarid': 'primary', 'timemin': (new date()).toisostring(), 'showdeleted': false, 'singleevents': true, 'maxresults': 10, 'orderby': 'starttime' }); request.execute(function(resp) { var events = resp.items; appendpre('upcoming events:'); if (events.length > 0) { (i = 0; < events.length; i++) { var event = events[i]; var when = event.start.datetime; if (!when) { when = event.start.date; } appendpre(event.summary + ' (' + when + ')') } } else { appendpre('no upcoming events found.'); } }); } /** * append pre element body containing given message * text node. * * @param {string} message text placed in pre element. */ function appendpre(message) { var pre = document.getelementbyid('output'); var textcontent = document.createtextnode(message + '\n'); pre.appendchild(textcontent); } </script> <script src="https://apis.google.com/js/client.js?onload=checkauth"> </script> </head> <body> <div id="authorize-div" style="display: none"> <span>authorize access calendar</span> <!--button user click initiate auth sequence --> <button id="authorize-button" onclick="handleauthclick(event)"> authorize </button> </div> <pre id="output"></pre> </body> </html>
console errors:
[error] failed load resource: server responded status of 400 (bad request) (auth, line 0) [error] refused display 'https://accounts.google.com/o/oauth2/auth?client_id=633454716537-7npq10974v964a85l2bboc2j08sc649r.apps.googleusercontent.com&scope=https%3a%2f%2fwww.googleapis.com%2fauth%2fcalendar.readonly&immediate=true&include_granted_scopes=true&proxy=oauth2relay396521106&redirect_uri=postmessage&origin=file%3a%2f%2f&response_type=token&state=338793751%7c0.4135151437&authuser=0' in frame because set 'x-frame-options' 'sameorigin'. (about:blank, line 0)
all want know show upcoming events calendar. have idea how solve this?
you might try make sure public calendar.
you can embed googles calendar in webpage directly- in calendars/settings
you try this: http://mikeclaffey.com/google-calendar-into-html/
Comments
Post a Comment