2015-05-08 6 views
0

Я использую этот образец для подачи своего календаря. Я создал идентификатор клиента, но после того, как я запускаю этот проект я получаю 2 ошибки в консоли, как показано на рисунке:Как подать Календарь Google?

Код:

<html> 
    <head> 
    <script type="text/javascript"> 
     // Your Client ID can be retrieved from your project in the Google 
     // Developer Console, https://console.developers.google.com 
     var CLIENT_ID = '633454716537-7npq10974v964a85l2bboc2j08sc649r.apps.googleusercontent.com'; 

     // This quickstart only requires read-only scope, check 
     // https://developers.google.com/google-apps/calendar/auth if you want to 
     // request write scope. 
     var SCOPES = ['https://www.googleapis.com/auth/calendar.readonly']; 

     /** 
     * Check if current user has authorized this application. 
     */ 
     function checkAuth() { 
     gapi.auth.authorize(
      { 
      'client_id': CLIENT_ID, 
      'scope': SCOPES, 
      'immediate': true 
      }, handleAuthResult); 
     } 

     /** 
     * Handle response from authorization server. 
     * 
     * @param {Object} authResult Authorization result. 
     */ 
     function handleAuthResult(authResult) { 
     var authorizeDiv = document.getElementById('authorize-div'); 
     if (authResult && !authResult.error) { 
      // Hide auth UI, then load Calendar client library. 
      authorizeDiv.style.display = 'none'; 
      loadCalendarApi(); 
     } else { 
      // Show auth UI, allowing the user to initiate authorization by 
      // clicking authorize button. 
      authorizeDiv.style.display = 'inline'; 
     } 
     } 

     /** 
     * Initiate auth flow in response to 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 is loaded. 
     */ 
     function loadCalendarApi() { 
     gapi.client.load('calendar', 'v3', listUpcomingEvents); 
     } 

     /** 
     * Print the summary and start datetime/date of the next ten events in 
     * the authorized user's calendar. If no events are found an 
     * appropriate message is 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) { 
      for (i = 0; i < 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 a pre element to the body containing the given message 
     * as its text node. 
     * 
     * @param {string} message Text to be 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 to calendar</span> 
     <!--Button for the user to click to initiate auth sequence --> 
     <button id="authorize-button" onclick="handleAuthClick(event)"> 
     Authorize 
     </button> 
    </div> 
    <pre id="output"></pre> 
    </body> 
</html> 

консоли ошибок:

[Error] Failed to load resource: the server responded with a status of 400 (Bad Request) (auth, line 0) 
[Error] Refused to 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 a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'. (about:blank, line 0) 

Все, что я хочу знать чтобы показать предстоящие события из моего календаря. Есть ли у кого-нибудь идеи, как это решить?

ответ

0

Вы пытаетесь, чтобы сделать общедоступный календарь.

Вы также можете встроить календарь Googles в веб-страницы directly- в календари/настройки

Вы также можете попробовать что-то вроде этого: http://mikeclaffey.com/google-calendar-into-html/

Смежные вопросы