javascript - 谷歌日历 API Javascript Quickadd-6ren

javascript - 谷歌日历 API Javascript Quickadd

转载作者：行者123 更新时间：2023-11-28 02:07:19

尝试允许用户使用带有 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>

最佳答案

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

关于javascript - 谷歌日历 API Javascript Quickadd，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10654064/