我想在我的网站(前端)上构建一个界面，使客户能够在我自己的 Google 日历(后端)中创建事件。我想通过 Google Calendar API v3 使用 JavaScript 和/或 PHP 技术来实现这一目标。
虽然使用这个 API 对我来说是全新的，但我从下面的代码开始，它是 this mockup 的略微修改版本。 .它实际上就像一个魅力，但不能满足我的需要。
我需要的是授权我的特定网站(例如“axel.com/calendar”)“永久”访问我的 Google 日历的事件，并能够根据特定的操作添加事件用户。界面的实际用户根本不需要授权任何东西。
对于 UI，我倾向于使用 FullCalendar到现在为止。
<!DOCTYPE html>
<html>
<head>
<title>Google Calendar API Quickstart</title>
<meta charset='utf-8' />
</head>
<body>
<button id="authorize-button" style="display: none;">Authorize</button>
<button id="signout-button" style="display: none;">Sign Out</button>
<pre id="content"></pre>
<script type="text/javascript">
var CLIENT_ID = '<YOUR_CLIENT_ID>';
var API_KEY = '<YOUR_API_KEY>';
var DISCOVERY_DOCS = ["https://www.googleapis.com/discovery/v1/apis/calendar/v3/rest"];
var SCOPES = "https://www.googleapis.com/auth/calendar.readonly";
var authorizeButton = document.getElementById('authorize-button');
var signoutButton = document.getElementById('signout-button');
function handleClientLoad() {
gapi.load('client:auth2', initClient);
}
function initClient() {
gapi.client.init({
apiKey: API_KEY,
clientId: CLIENT_ID,
discoveryDocs: DISCOVERY_DOCS,
scope: SCOPES
}).then(function () {
gapi.auth2.getAuthInstance().isSignedIn.listen(updateSigninStatus);
updateSigninStatus(gapi.auth2.getAuthInstance().isSignedIn.get());
authorizeButton.onclick = handleAuthClick;
signoutButton.onclick = handleSignoutClick;
});
}
function updateSigninStatus(isSignedIn) {
if (isSignedIn) {
authorizeButton.style.display = 'none';
signoutButton.style.display = 'block';
listUpcomingEvents();
} else {
authorizeButton.style.display = 'block';
signoutButton.style.display = 'none';
}
}
function handleAuthClick(event) {
gapi.auth2.getAuthInstance().signIn();
}
function handleSignoutClick(event) {
gapi.auth2.getAuthInstance().signOut();
}
function appendPre(message) {
var pre = document.getElementById('content');
var textContent = document.createTextNode(message + '\n');
pre.appendChild(textContent);
}
function listUpcomingEvents() {
gapi.client.calendar.events.list({
'calendarId': 'primary',
'timeMin': (new Date()).toISOString(),
'showDeleted': false,
'singleEvents': true,
'maxResults': 10,
'orderBy': 'startTime'
}).then(function(response) {
var events = response.result.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.');
}
});
}
</script>
<script async defer src="https://apis.google.com/js/api.js"
onload="this.onload=function(){};handleClientLoad()"
onreadystatechange="if (this.readyState === 'complete') this.onload()">
</script>
最佳答案
您可以使用服务帐户凭据代替 OAuth key 。
OAuth 用于访问需要用户同意的客户端日历。
相反，您应该使用服务帐户凭据来修改您自己的日历中将与用户共享的事件。
在 Google API 开发人员控制台上选择项目并选择服务帐户作为凭据而不是 OAuth。
您将获得相应的 json 凭据文件，您可以使用该文件在后端进行身份验证。
此链接将帮助您解决问题 (特别是如果您使用的是 PHP Laravell)
关于javascript - 如何通过 Google Calendar API v3 永久访问我自己的 Google Calendar？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47359988/