Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/449.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
使用javascript中的API v3检索Google日历事件_Javascript_Jquery_Calendar_Google Calendar Api - Fatal编程技术网

使用javascript中的API v3检索Google日历事件

使用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

去年,我使用这里找到的代码从一个公共谷歌日历的“现在”中检索所有事件,然后将结果显示在一个网页中。 我修改了代码以满足我的需要(参见下面的代码)

现在,使用API v3,代码不再工作,我无法理解哪些代码行被弃用,以及如何更新它们。 请有人帮我查一下这个密码好吗

非常感谢:-)


/*加载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>