Javascript Google日历事件未显示在FullCalendar上_Javascript_Jquery_Api_Calendar_Fullcalendar

Javascript Google日历事件未显示在FullCalendar上

javascript jquery api calendar fullcalendar

Javascript Google日历事件未显示在FullCalendar上,javascript,jquery,api,calendar,fullcalendar,Javascript,Jquery,Api,Calendar,Fullcalendar,我正在尝试在我的网站上获取一个日历，该日历与谷歌日历上的数据同步，并显示在网页上为此，我使用了FullCalendar并按照文档中的步骤进行了操作。我得到了日历，但它没有显示谷歌日历上的事件。它只是空白。我有API和ID，它没有设置为private <html> <head> <title>calendario fiscal</title>  <li

我正在尝试在我的网站上获取一个日历，该日历与谷歌日历上的数据同步，并显示在网页上

为此，我使用了FullCalendar并按照文档中的步骤进行了操作。我得到了日历，但它没有显示谷歌日历上的事件。它只是空白。我有API和ID，它没有设置为private

<html>
<head>
  <title>calendario fiscal</title>
  <!--Fullcalendar Dependencies-->
  <link href='fullcalendar/fullcalendar.css' rel='stylesheet' />
  <link href='fullcalendar/fullcalendar.print.css' rel='stylesheet' media='print'/>

  <script src='fullcalendar/gcal.js'></script>

  <!--jQuery-->
  <script src='jquery/jquery-1.9.1.min.js'></script>
  <script src='jquery/jquery-ui-1.10.2.custom.min.js'></script>

  <!--FullCalendar-->
  <script src='fullcalendar/fullcalendar.min.js'></script>

  <script type="text/javascript">

  $(document).ready(function()
  {

    var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();

    var calendar = $('#calendar').fullCalendar(
    {
      googleCalendarApiKey: 'mykey',

      header:
      {
        left: "prev,next today",
        center: "title",
        right: "month,agendaWeek,agendaDay"
      },

      defaultView: "month",

      selectable: false,
      selectHelper: false,

      events: {
            googleCalendarId: "myid"
        }

  });
    });

  </script>
</head>


  <body>
  <div id="calendar">
  </div>

  </body>
  </html>


日历财政
$（文档）.ready（函数（）
{
变量日期=新日期（）；
var d=date.getDate（）；
var m=date.getMonth（）；
var y=date.getFullYear（）；
var calendar=$（“#calendar”）.fullCalendar(
{
googleCalendarApiKey:“我的钥匙”，
标题：
{
左：“上一个，下一个今天”，
中心：“标题”，
右：“月，agendaWeek，agendaDay”
},
defaultView:“月”，
可选：false，
selectHelper:false，
活动：{
谷歌日历ID：“myid”
}
});
});

/////////更新//////////// 根据@Victor Rocheron的建议，以下是我的建议：

`
<!DOCTYPE html>
<html>
<title>calendario fiscal</title>
<link href='fullcalendar/fullcalendar.css' rel='stylesheet' />
<link href='fullcalendar/fullcalendar.print.css' rel='stylesheet' media='print'/>

<script src='fullcalendar/gcal.js'></script>
<script src='jquery/jquery-1.9.1-min.js'></script>
<script src='jquery/jquery-ui-1.10.2.custom.min.js'></script>


    <script type="text/javascript">

    function doRequest(options, printResult){
    var x = new XMLHttpRequest();
    x.open(options.method, options.url);
    x.onload = x.onerror = function(){
        printResult(
            (x.responseText || '')
        );
    };
    x.send(options.data);
    }

    (function(){
        doRequest({
            method:'GET',
            url: 'https://www.google.apis.com/calendars/myid@group.calendar.google.com/events?key=mykey',
        }, function printResult(result){

        result = JSON.parse(result);
        var i;
        var str,end;
        eventsList = {
            events: []
        }
        for(i=0;i < result.items.length;i++) {

            str = result.items[i].start.dateTime;
            end = result.items[i].end.dateTime;

            eventsList.events.push({
                "title": result.items[i].summary,
                "start":str,
                "end":end,
                "description": result.items[i].description
            });
        }

                var myEvents = eventsList.events;
                $('#calendar').fullCalendar({

                header: {
                left: 'prev,next today controle',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
                },
                defaultView: 'agendaWeek',
                timezone: "Europe/Paris",
                selectable:true,
                selectHelper:true,
                minTime:"07:00:00",
                maxTime:"21:00:00",
                contentHeight: 685,
                lang: 'fr',
                select: function(start, end) {
                var title = prompt('Event Title:');
                var eventData;

                if(title) {
                eventData = {
                    title: title,
                    start: start,
                    end: end,
                    description: description
                    };
                $('#calendar').fullCalendar('renderEvent', eventData, true); //stick?=true
            }
            $('#calendar').fullCalendar('unselect');
            },
            editable:true,
            eventLimit: true, //allow "more" link when too many eventsevents: myEvents

            });

        setTimeout("$('.fc-today-button').click();", 50);



    </script>

    <style type="text/css">

        body{
            margin-top: 40px;
            text-align: center;
            font-size: 14px;
            font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
        }

        #calendar{
            width:  900px;
      height: auto;
            margin: 0 auto;
        }

    </style>

<body>
<div id="calendar">
</body>

</html>

`

`
日历财政
函数doRequest（选项、打印结果）{
var x=新的XMLHttpRequest（）；
x、 打开（options.method、options.url）；
x、 onload=x.onerror=function（）{
打印结果(
（x.responseText | |“”）
);
};
x、 发送（选项.数据）；
}
（功能（）{
多勒奎斯特({
方法：'GET'，
网址：'https://www.google.apis.com/calendars/myid@group.calendar.google.com/events？key=mykey'，
}，函数printResult（结果）{
result=JSON.parse（result）；
var i；
var-str，end；
事件列表={
事件：[]
}
对于（i=0；i


我不明白问题出在哪里。
这是我几个月前做的一个实现，请用您的替换并告诉我它是否有效

Javascript:
function doRequest(options, printResult) {
    var x = new XMLHttpRequest();
    x.open(options.method, options.url);
    x.onload = x.onerror = function() {
      printResult(
        (x.responseText || '')
      );
    };
    x.send(options.data);
  }


 (function() {
    doRequest({
        method: 'GET',
        url: 'https://www.googleapis.com/calendar/v3/calendars/<---YOURID-->/events?key=<--YOURKEY-->',
    }, function printResult(result) {

    result = JSON.parse(result);
    var i;
    var str,end;
    eventsList = {
        events: []
    }
    for(i=0;i < result.items.length;i++) {

        str = result.items[i].start.dateTime;
        end = result.items[i].end.dateTime;

        eventsList.events.push({
            "title": result.items[i].summary,
            "start": str,
            "end": end,
            "description": result.items[i].description
        });
    }
                    var myEvents = eventsList.events;
                      $('#calendar').fullCalendar({

                      header: {
                        left: 'prev,next today controle',
                        center: 'title',
                        right: 'month,agendaWeek,agendaDay'
                      },
                      defaultView: 'agendaWeek',
                       timezone: "Europe/Paris",
                      selectable: true,
                      selectHelper: true,
                      minTime:"07:00:00",
                      maxTime:"21:00:00",
                      contentHeight: 685, 
                      lang: 'fr',
                      select: function(start, end) {
                        var title = prompt('Event Title:');
                        var eventData;

                        if (title) {
                          eventData = {
                            title: title,
                            start: start,
                            end: end,
                            description: description
                          };
                          $('#calendar').fullCalendar('renderEvent', eventData, true); // stick? = true
                        }
                        $('#calendar').fullCalendar('unselect');
                      },
                      editable: true,
                      eventLimit: true, // allow "more" link when too many events
                      events: myEvents

                    });

                setTimeout("$('.fc-today-button').click();", 50);
    });
})();

函数doRequest（选项、打印结果）{
var x=新的XMLHttpRequest（）；
x、 打开（options.method、options.url）；
x、 onload=x.onerror=function（）{
打印结果(
（x.responseText | |“”）
);
};
x、 发送（选项.数据）；
}
（功能（）{
多勒奎斯特({
方法：“GET”，
网址：'https://www.googleapis.com/calendar/v3/calendars//events?key=',
}，函数printResult（结果）{
result=JSON.parse（result）；
var i；
var-str，end；
事件列表={
事件：[]
}
对于（i=0；i