Google Calendar API Javascript Quickadd

时间:2012-05-18 14:00:21

标签: javascript html google-api google-calendar-api

尝试允许用户使用带有javascript的Google日历API v3对事件进行身份验证和快速添加。我没有看到验证按钮。我对编码很缺乏经验。

控制台:

Uncaught SyntaxError: Unexpected token } test.html:47
Uncaught TypeError: Cannot read property 'qainput' of undefined test.html:62
onload test.html:62

html文件:

<html>
  <head>
    <meta charset='utf-8' />
    <style>
      #info {
        border: 0px solid black;
        padding: 0.25em;
        margin: 0.5em 0;
      }
    </style>
    <script type="text/javascript"> 
      var apiKey = 'AIzaSyDcbjOvAT85hCdVrjgUAqylf_QtxE2Gx60';
      var clientId = '202852486259.apps.googleusercontent.com';
      var scopes = 'https://www.googleapis.com/auth/calendar';
      function handleClientLoad() {
        gapi.client.setApiKey(apiKey);
        window.setTimeout(checkAuth,1);
      }

      function checkAuth() {
        gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: true}, handleAuthResult);
      }


      function handleAuthResult(authResult) {
        var authorizeButton = document.getElementById('authorize-button');
        if (authResult) {
          authorizeButton.style.visibility = 'hidden';
          makeApiCall();
        } else {
          authorizeButton.style.visibility = '';
          authorizeButton.onclick = handleAuthClick;
        }
      }

      function handleAuthClick(event) {
        gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: false}, handleAuthResult);
        return false;
      }

      function makeRpcRequest() {
        var qatext = document.qaform.qainput.value;
        var request = gapi.client.calendar.events.quick_add({
          'calendarId': 'primary',
          'text': +qatext+
        });
        request.execute(writeResponse);
      }

      function writeResponse(response) {
        console.log(response);
        var name = response.summary;
        var infoDiv = document.getElementById('info');
        var infoMsg = document.createElement('P');
        infoMsg.appendChild(document.createTextNode(+ name' sucessfully created!'));
        infoDiv.appendChild(infoMsg);
      }
    </script>
    <script src="https://apis.google.com/js/client.js?onload=handleClientLoad"></script>
  </head>
  <body onload="document.qaform.qainput.focus();">
    <button id="authorize-button" style="visibility: hidden">Authorize to Use QuickAdd</button>
    <form id="qaform">
    <input placeholder='QuickAdd' name='qainput' />
    <button id="rpc" onclick="makeRpcRequest();">Add</button>
    </form>
    <div id="info"></div>
  </body>
</html>

1 个答案:

答案 0 :(得分:1)

因为几周之后你可能已经找到了答案,但我最近遇到了同样的问题,从你使用的基本相同的代码开始。我根本没有在谷歌控制台的“服务”下激活谷歌日历。如果所有控制台设置都不正确,则“授权”按钮将保持隐藏状态(默认情况下隐藏)。一旦所有设置都正确并且脚本与api正确通信,授权按钮就会变得可见,然后您可以添加事件并通过单击按钮来编写响应。