{"id":3857,"date":"2018-08-26T18:05:36","date_gmt":"2018-08-26T09:05:36","guid":{"rendered":"https:\/\/www.ws-meguro.com\/\/?p=3857"},"modified":"2018-08-26T18:05:36","modified_gmt":"2018-08-26T09:05:36","slug":"javascript%e3%81%a7google-calendar%e3%82%92%e5%8f%96%e5%be%97","status":"publish","type":"post","link":"https:\/\/www.wsmeguro.jp\/wp\/?p=3857","title":{"rendered":"JavaScript\u3067Google Calendar\u3092\u53d6\u5f97"},"content":{"rendered":"<p>Raspberry PI Zero W\u304c\u6b8b\u5ff5\u306a\u72b6\u6cc1\u306a\u306e\u3067\u3001\u5929\u5019\u60c5\u5831\u30da\u30fc\u30b8\u306b\u52a0\u3048\u3066\u3001\u30e1\u30fc\u30eb\u3084\u30b9\u30b1\u30b8\u30e5\u30fc\u30eb\u306e\u30c0\u30c3\u30b7\u30e5\u30dc\u30fc\u30c9\u3092\u4f5c\u3063\u3066\u307f\u3088\u3046\u304b\u3068\u601d\u3044\u307e\u3057\u305f\u3002\u30d9\u30fc\u30b9\u306fJavaScript\u3067\u4f5c\u3063\u305f<a href=\"https:\/\/www.wsmeguro.jp\/\/tools\/js\/calendar1\/index.html\" rel=\"noopener\" target=\"_blank\">\u30ab\u30ec\u30f3\u30c0\u30fc<\/a>\u3067\u3059\u3002<\/p>\n<p>Google\u306eBrowser GuickStart\u3092\u307f\u306a\u304c\u3089Google Calendar\u304b\u3089\u4e88\u5b9a\u3092\u53d6\u5f97\u3059\u308b\u6a5f\u80fd\u3092\u518d\u73fe\u3057\u3066\u307f\u307e\u3057\u305f\u3002<br \/>\n<a href=\"https:\/\/www.wsmeguro.jp\/\/tools\/dashboard\/test.html\" rel=\"noopener\" target=\"_blank\">\u7d50\u679c\u306f\u3053\u3061\u3089<\/a>\u3067\u3059\u3002Authorize\u30dc\u30bf\u30f3\u3092\u30af\u30ea\u30c3\u30af\u3059\u308b\u3068Google\u306e\u8a8d\u8a3c\u753b\u9762\u304c\u51fa\u3066\u304d\u3066\u3001\u30e1\u30fc\u30eb\u30a2\u30c9\u30ec\u30b9\u3068\u30d1\u30b9\u30ef\u30fc\u30c9\u3092\u5165\u308c\u308c\u3070OK\u3067\u3059\u3002<br \/>\n\u3053\u306e\u60c5\u5831\u3092\u30ab\u30ec\u30f3\u30c0\u30fc\u306b\u57cb\u3081\u8fbc\u3081\u3070\u30de\u30a4\u30ab\u30ec\u30f3\u30c0\u30fc\u306f\u3067\u304d\u305d\u3046\u3060\u3002<!--more--><\/p>\n<p>\u30b3\u30fc\u30c9\u306f\u4ee5\u4e0b\u306e\u901a\u308a\u3067\u3059\u3002CLIENT_ID\u3068API_KEY\u3092\u81ea\u5206\u306e\u3082\u306e\u306b\u5165\u308c\u66ff\u3048\u308c\u3070\u3001\u3054\u81ea\u8eab\u306eAPI\u3067\u52d5\u304b\u305b\u307e\u3059\u3002 <\/p>\n<pre class=\"lang:php decode:true \" >&lt;!DOCTYPE html&gt;\r\n&lt;html&gt;\r\n  &lt;head&gt;\r\n    &lt;title&gt;Google Calendar API Quickstart&lt;\/title&gt;\r\n    &lt;meta charset=\"utf-8\" \/&gt;\r\n  &lt;\/head&gt;\r\n  &lt;body&gt;\r\n    &lt;p&gt;Google Calendar API Quickstart&lt;\/p&gt;\r\n\r\n    &lt;!--Add buttons to initiate auth sequence and sign out--&gt;\r\n    &lt;button id=\"authorize_button\" style=\"display: none;\"&gt;Authorize&lt;\/button&gt;\r\n    &lt;button id=\"signout_button\" style=\"display: none;\"&gt;Sign Out&lt;\/button&gt;\r\n\r\n    &lt;pre id=\"content\"&gt;&lt;\/pre&gt;\r\n\r\n    &lt;script type=\"text\/javascript\"&gt;\r\n      \/\/ Client ID and API key from the Developer Console\r\n      var CLIENT_ID = '&lt;YOUR_CLIENT_ID&gt;';\r\n      var API_KEY = '&lt;YOUR_API_KEY&gt;';\r\n\r\n      \/\/ Array of API discovery doc URLs for APIs used by the quickstart\r\n      var DISCOVERY_DOCS = [\"https:\/\/www.googleapis.com\/discovery\/v1\/apis\/calendar\/v3\/rest\"];\r\n\r\n      \/\/ Authorization scopes required by the API; multiple scopes can be\r\n      \/\/ included, separated by spaces.\r\n      var SCOPES = \"https:\/\/www.googleapis.com\/auth\/calendar.readonly\";\r\n\r\n      var authorizeButton = document.getElementById('authorize_button');\r\n      var signoutButton = document.getElementById('signout_button');\r\n\r\n      \/**\r\n       *  On load, called to load the auth2 library and API client library.\r\n       *\/\r\n      function handleClientLoad() {\r\n        gapi.load('client:auth2', initClient);\r\n      }\r\n\r\n      \/**\r\n       *  Initializes the API client library and sets up sign-in state\r\n       *  listeners.\r\n       *\/\r\n      function initClient() {\r\n        gapi.client.init({\r\n          apiKey: API_KEY,\r\n          clientId: CLIENT_ID,\r\n          discoveryDocs: DISCOVERY_DOCS,\r\n          scope: SCOPES\r\n        }).then(function () {\r\n          \/\/ Listen for sign-in state changes.\r\n          gapi.auth2.getAuthInstance().isSignedIn.listen(updateSigninStatus);\r\n\r\n          \/\/ Handle the initial sign-in state.\r\n          updateSigninStatus(gapi.auth2.getAuthInstance().isSignedIn.get());\r\n          authorizeButton.onclick = handleAuthClick;\r\n          signoutButton.onclick = handleSignoutClick;\r\n        });\r\n      }\r\n\r\n      \/**\r\n       *  Called when the signed in status changes, to update the UI\r\n       *  appropriately. After a sign-in, the API is called.\r\n       *\/\r\n      function updateSigninStatus(isSignedIn) {\r\n        if (isSignedIn) {\r\n          authorizeButton.style.display = 'none';\r\n          signoutButton.style.display = 'block';\r\n          listUpcomingEvents();\r\n        } else {\r\n          authorizeButton.style.display = 'block';\r\n          signoutButton.style.display = 'none';\r\n        }\r\n      }\r\n\r\n      \/**\r\n       *  Sign in the user upon button click.\r\n       *\/\r\n      function handleAuthClick(event) {\r\n        gapi.auth2.getAuthInstance().signIn();\r\n      }\r\n\r\n      \/**\r\n       *  Sign out the user upon button click.\r\n       *\/\r\n      function handleSignoutClick(event) {\r\n        gapi.auth2.getAuthInstance().signOut();\r\n      }\r\n\r\n      \/**\r\n       * Append a pre element to the body containing the given message\r\n       * as its text node. Used to display the results of the API call.\r\n       *\r\n       * @param {string} message Text to be placed in pre element.\r\n       *\/\r\n      function appendPre(message) {\r\n        var pre = document.getElementById('content');\r\n        var textContent = document.createTextNode(message + '\\n');\r\n        pre.appendChild(textContent);\r\n      }\r\n\r\n      \/**\r\n       * Print the summary and start datetime\/date of the next ten events in\r\n       * the authorized user's calendar. If no events are found an\r\n       * appropriate message is printed.\r\n       *\/\r\n      function listUpcomingEvents() {\r\n        gapi.client.calendar.events.list({\r\n          'calendarId': 'primary',\r\n          'timeMin': (new Date()).toISOString(),\r\n          'showDeleted': false,\r\n          'singleEvents': true,\r\n          'maxResults': 10,\r\n          'orderBy': 'startTime'\r\n        }).then(function(response) {\r\n          var events = response.result.items;\r\n          appendPre('Upcoming events:');\r\n\r\n          if (events.length &gt; 0) {\r\n            for (i = 0; i &lt; events.length; i++) {\r\n              var event = events[i];\r\n              var when = event.start.dateTime;\r\n              if (!when) {\r\n                when = event.start.date;\r\n              }\r\n              appendPre(event.summary + ' (' + when + ')')\r\n            }\r\n          } else {\r\n            appendPre('No upcoming events found.');\r\n          }\r\n        });\r\n      }\r\n\r\n    &lt;\/script&gt;\r\n\r\n    &lt;script async defer src=\"https:\/\/apis.google.com\/js\/api.js\"\r\n      onload=\"this.onload=function(){};handleClientLoad()\"\r\n      onreadystatechange=\"if (this.readyState === 'complete') this.onload()\"&gt;\r\n    &lt;\/script&gt;\r\n  &lt;\/body&gt;\r\n&lt;\/html&gt;<\/pre>\n","protected":false},"excerpt":{"rendered":"<p>Raspberry PI Zero W\u304c\u6b8b\u5ff5\u306a\u72b6\u6cc1\u306a\u306e\u3067\u3001\u5929\u5019\u60c5\u5831\u30da\u30fc\u30b8\u306b\u52a0\u3048\u3066\u3001\u30e1\u30fc\u30eb\u3084\u30b9\u30b1\u30b8\u30e5\u30fc\u30eb\u306e\u30c0\u30c3\u30b7\u30e5\u30dc\u30fc\u30c9\u3092\u4f5c\u3063\u3066\u307f\u3088\u3046\u304b\u3068\u601d\u3044\u307e\u3057\u305f\u3002\u30d9\u30fc\u30b9\u306fJavaScript\u3067\u4f5c\u3063\u305f\u30ab\u30ec\u30f3\u30c0\u30fc\u3067\u3059\u3002 Google\u306eBr&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"footnotes":""},"categories":[560],"tags":[522,589,558],"class_list":["post-3857","post","type-post","status-publish","format-standard","hentry","category-javascript","tag-api","tag-google-calendar","tag-javascript"],"_links":{"self":[{"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=\/wp\/v2\/posts\/3857","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=3857"}],"version-history":[{"count":1,"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=\/wp\/v2\/posts\/3857\/revisions"}],"predecessor-version":[{"id":3858,"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=\/wp\/v2\/posts\/3857\/revisions\/3858"}],"wp:attachment":[{"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=3857"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=3857"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=3857"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}