使用javascript中的API v3检索Google日历事件
去年,我使用这里找到的代码从一个公共谷歌日历的“现在”中检索所有事件,然后将结果显示在一个网页中。 我修改了代码以满足我的需要(参见下面的代码) 现在,使用API v3,代码不再工作,我无法理解哪些代码行被弃用,以及如何更新它们。 请有人帮我查一下这个密码好吗 非常感谢:-)使用javascript中的API v3检索Google日历事件,javascript,jquery,calendar,google-calendar-api,Javascript,Jquery,Calendar,Google Calendar Api,去年,我使用这里找到的代码从一个公共谷歌日历的“现在”中检索所有事件,然后将结果显示在一个网页中。 我修改了代码以满足我的需要(参见下面的代码) 现在,使用API v3,代码不再工作,我无法理解哪些代码行被弃用,以及如何更新它们。 请有人帮我查一下这个密码好吗 非常感谢:-) /*加载Google数据JavaScript客户端库*/ google.load(“gdata”,“2.x”); 函数init(){ //使用错误处理程序初始化GoogleDataJS客户端库 google.gdata
/*加载Google数据JavaScript客户端库*/
google.load(“gdata”,“2.x”);
函数init(){
//使用错误处理程序初始化GoogleDataJS客户端库
google.gdata.client.init(handlederror);
//加载code.google.com日历
loadMyCalendar();
}
/**
*加载Google事件日历
*/
函数loadMyCalendar(){
loadCalendarByAddress('我的_ADDRESS@gmail.com“);/*地址在这里
}
/**
*将前导零添加到一位数字。用于显示日期。
*/
函数编号(num){
如果(数字0){
eventDiv.removeChild(eventDiv.childNodes[0]);
}
var ul=document.createElement('ul');
/*使用日历的名称设置calendarTitle div*/
/*document.getElementById('calendarTitle')。innerHTML=
日历:“+feedRoot.feed.title.$t+”
”*/
/*循环查看提要中的每个事件*/
var len=entries.length;
对于(变量i=0;i-1 | | cont.indexOf('WORD_2')>-1)){
var whereIs=entry.getLocations()[0].getValueString();
var startDateTime=null;
var startJSDate=null;
var times=entry.getTimes();
如果(乘以长度>0){
startDateTime=次[0]。getStartTime();
startJSDate=startDateTime.getDate();
}
var entryLinkHref=null;
if(entry.gethtmlink()!=null){
entryLinkHref=entry.gethtmlink().getHref();
}
var day=padNumber(startJSDate.getDate());
var month=padNumber(startJSDate.getMonth()+1);
var dateString=day+“/”+month+“/”+startJSDate.getFullYear();
if(title.indexOf('-')>-1){
cont=title.substring(0,title.indexOf('-')+3)+cont+“@”+其中为;
title=title.substring(title.indexOf('-')+3);
}else cont=“h:”这里是“+cont+”@”+;
var li=document.createElement('li');
/*如果我们有到事件的链接,请创建一个“a”元素*/
如果(entryLinkHref!=null){
entryLink=document.createElement('a');
setAttribute('href',entryLinkHref);
li.appendChild(document.createTextNode(dateString+'-');
appendChild(document.createTextNode(title));
li.附录儿童(entryLink);
}否则{
li.appendChild(document.createTextNode(dateString+'-'+title));
}
var p=document.createElement(“p”);
var lo=document.createElement('lo');
lo.appendChild(document.createTextNode(cont));
li.style.fontSize=“25px”;
lo.style.fontSize=“15px”;
/*将列表项附加到无序列表中*/
ul.儿童(li);
ul.儿童(lo);
ul.儿童(p);
}
事件子事件(ul);
}
}
setOnLoadCallback(init);
加载日历
SOLVED:-)下面是javascript代码,使用google Calendar API v3访问和显示公共google日历即将发生的事件
var clientId='您的客户ID在此'//选择web应用程序客户端Id,将URI和Javascript源重定向设置为http://localhost
var apiKey='YOUR_apiKey_HERE'//选择public apiKey,任意允许的IP(在Google开发控制台中,将允许的IP框留空)
var userEmail=“您的_ADDRESS@gmail.com"; //您的日历Id
var userTimeZone=“您所在的时区”//示例“罗马”“洛杉矶”ecc。。。
var maxRows=10//要显示的事件
var calName=“您的日历名”//日历名称(写下你想要的,没关系)
var作用域https://www.googleapis.com/auth/calendar';
//---------------------将0添加到数字
函数padNum(num){
if(num这里有一个基于Max的原始脚本的简化、注释和更新的脚本,它使用了Moment.js和JQuery.Read了解详细信息(包括如何获取API密钥),或者只需在下面的脚本中替换您的\u CALENDAR\u ID和\u API\u密钥即可:
<script>
/* This solution makes use of "simple access" to google, providing only an API Key.
* This way we can only get access to public calendars. To access a private calendar,
* we would need to use OAuth 2.0 access.
*
* "Simple" vs. "Authorized" access: https://developers.google.com/api-client-library/javascript/features/authentication
* Examples of "simple" vs OAuth 2.0 access: https://developers.google.com/api-client-library/javascript/samples/samples#authorizing-and-making-authorized-requests
*
* We will make use of "Option 1: Load the API discovery document, then assemble the request."
* as described in https://developers.google.com/api-client-library/javascript/start/start-js
*/
function printCalendar() {
// The "Calendar ID" from your calendar settings page, "Calendar Integration" secion:
var calendarId = 'YOUR_CALENDAR_ID@group.calendar.google.com';
// 1. Create a project using google's wizzard: https://console.developers.google.com/start/api?id=calendar
// 2. Create credentials:
// a) Go to https://console.cloud.google.com/apis/credentials
// b) Create Credentials / API key
// c) Since your key will be called from any of your users' browsers, set "Application restrictions" to "None",
// leave "Website restrictions" blank; you may optionally set "API restrictions" to "Google Calendar API"
var apiKey = 'YOUR_API_KEY';
// You can get a list of time zones from here: http://www.timezoneconverter.com/cgi-bin/zonehelp
var userTimeZone = "Europe/Budapest";
// Initializes the client with the API key and the Translate API.
gapi.client.init({
'apiKey': apiKey,
// Discovery docs docs: https://developers.google.com/api-client-library/javascript/features/discovery
'discoveryDocs': ['https://www.googleapis.com/discovery/v1/apis/calendar/v3/rest'],
}).then(function () {
// Use Google's "apis-explorer" for research: https://developers.google.com/apis-explorer/#s/calendar/v3/
// Events: list API docs: https://developers.google.com/calendar/v3/reference/events/list
return gapi.client.calendar.events.list({
'calendarId': calendarId,
'timeZone': userTimeZone,
'singleEvents': true,
'timeMin': (new Date()).toISOString(), //gathers only events not happened yet
'maxResults': 20,
'orderBy': 'startTime'
});
}).then(function (response) {
if (response.result.items) {
var calendarRows = ['<table class="wellness-calendar"><tbody>'];
response.result.items.forEach(function(entry) {
var startsAt = moment(entry.start.dateTime).format("L") + ' ' + moment(entry.start.dateTime).format("LT");
var endsAt = moment(entry.end.dateTime).format("LT");
calendarRows.push(`<tr><td>${startsAt} - ${endsAt}</td><td>${entry.summary}</td></tr>`);
});
calendarRows.push('</tbody></table>');
$('#wellness-calendar').html(calendarRows.join(""));
}
}, function (reason) {
console.log('Error: ' + reason.result.error.message);
});
};
// Loads the JavaScript client library and invokes `start` afterwards.
gapi.load('client', printCalendar);
</script>
/*这个解决方案使用“简单访问”google,只提供一个API密钥。
*这样我们只能访问公共日历。要访问私人日历,
*我们需要使用OAuth2.0Access。
*
*“简单”访问与“授权”访问:https://developers.google.com/api-client-library/javascript/features/authentication
*“简单”与OAuth 2.0访问的示例:https://developers.google.com/api-client-library/javascript/samples/samples#authorizing-以及提出授权要求
*
*我们将使用“选项1:加载API发现文档,然后组装请求”
*如中所述https://developers.google.com/api-client-library/javascript/start/start-js
*/
函数printCalendar(){
//“日历设置”页面中的“日历ID”,“日历集成”部分:
var calendarId='您的日历_ID@group.calendar.google.com';
//1.使用google的wizzard创建一个项目:https://console.developers.google.com/start/api?id=calendar
//2.创建凭据:
//a)去https://console.cloud.google.com/apis/credentials
//b)创建凭据/API密钥
//c)由于您的密钥将从任何用户的浏览器调用,请设置“应用程序限制”
<script src="https://cdn.jsdelivr.net/npm/moment@2/moment.min.js"></script>
<script src="https://apis.google.com/js/api.js"></script>