有没有一种方法可以在我的网站上展示我的个人日历，以便人们可以看到我的空闲时间。所以我已经想了几个小时了，如果我进行了谷歌身份验证，我就能够做到这一点，但问题是我不想访问其他人的日历数据，我只想阅读我的日历数据来展示它们。我使用 apikey 、 client_id 在谷歌控制台云上进行了设置，但通过该路线，我只找到了要求“访问者”验证其帐户的方法。我已经完成了 iframe 方法，但我只想获取日历数据以在之后“设计”它。总结一下，想要在我的网站中设置我自己的日历，而不需要每次进入网站时都在谷歌上进行身份验证。 抱歉，如果这可能令人困惑，我可以发布一些我得到的代码并回答任何问题。请帮忙
function gapiLoaded() {
gapi.load('client', initializeGapiClient);
}
async function initializeGapiClient() {
try {
await gapi.client.init({
apiKey: API_KEY,
discoveryDocs: ["https://www.googleapis.com/discovery/v1/apis/calendar/v3/rest"],
});
gisLoaded();
} catch (error) {
console.error('Error initializing Google Calendar API client:', error);
}
}
function gisLoaded() {
const tokenClient = google.accounts.oauth2.initTokenClient({
client_id: CLIENT_ID,
scope: 'https://www.googleapis.com/auth/calendar.readonly',
callback: handleAuthResponse,
});
tokenClient.requestAccessToken();
}
function handleAuthResponse(response) {
if (response.error) {
console.error('Error authenticating:', response);
return;
}
loadCalendarEvents();
}
async function loadCalendarEvents() {
try {
const response = await gapi.client.calendar.events.list({
'calendarId': CALENDAR_ID,
'timeMin': (new Date()).toISOString(),
'showDeleted': false,
'singleEvents': true,
'maxResults': 10,
'orderBy': 'startTime'
});
const events = response.result.items;
const calendarDiv = document.getElementById('calendar');
calendarDiv.innerHTML = ''; // Clear loading message
events.forEach(event => {
const eventDiv = document.createElement('div');
eventDiv.className = 'event';
const titleDiv = document.createElement('div');
titleDiv.className = 'event-title';
titleDiv.textContent = event.summary;
eventDiv.appendChild(titleDiv);
const timeDiv = document.createElement('div');
timeDiv.className = 'event-time';
const start = event.start.dateTime || event.start.date;
timeDiv.textContent = new Date(start).toLocaleString();
eventDiv.appendChild(timeDiv);
calendarDiv.appendChild(eventDiv);
});
} catch (error) {
console.error('Error fetching calendar events:', error);
}
}
window.onload = function() {
console.log('window.onload: Page fully loaded');
gapiLoaded();
};
现在是 html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>St. Patrick's Irish Pub - Menu</title>
<link rel="stylesheet" href="calendar.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<script src="https://accounts.google.com/gsi/client" async defer></script>
<script src="https://apis.google.com/js/api.js"></script>
</head>
<body>
<div class="calendar" id="calendar"></div>
<script src="calendar2.js"></script>
</body>
</html>
我这里的js是要求身份验证的，并且它有效...但正如我所说，我不想要求访问者进行身份验证...
我可能很蠢，我希望我是。提前谢谢你，因为我知道你是机器！
OAuth 使用同意屏幕的设计目的是允许使用该应用程序的任何用户访问 API。但是，在您的用例中，您只想为一名用户提供此功能。最简单的方法是使用 OAuth Playground 预先生成访问令牌和刷新令牌，然后使用这 2 个令牌来调用 API。
通过使用刷新令牌，您不再需要通过同意屏幕请求访问令牌，因为为您的用户调用 API 只需保存生成的刷新和访问令牌，然后使用刷新令牌您将获得新的访问令牌每次您需要进行 API 调用时。这将允许您忽略此组合的同意屏幕。
为了获取刷新和访问令牌，请按照以下步骤操作：
有关如何实施 OAuth 的全面指南，请查看这篇文章。如果您是 Google Workspace 用户，另一种解决方案是使用模拟服务帐号，这已记录在here。这样，您就可以设置直接从代码访问 api 的用户。如需更明确的示例，您可以查看这篇文章。