Fullcalendar-diplsay Google日历不起作用

编程问答 2022-10-27

问题描述

我一直在尝试将我的Google日历集成到FullCalendar.io中。

没有Google集成的我的代码如下：

<div id="calendarElem">
<link href='fullcalendar/main.css' rel='stylesheet' />
<script src='fullcalendar/main.js'></script>
<script>
$(function(){
    var calendarEl = document.getElementById('calendarElem');
    var calendar = new FullCalendar.Calendar(calendarEl,{
        initialView: 'dayGridMonth'
    });
    calendar.render();
});
       
</script>
</div>

使用该代码，我得到了一个空的日历-到目前为止一切都很好。

然后，我尝试按照the docs集成Google日历。

我去为Google日历创建了一个API密钥，公开了我的日历并复制了URL。

然后，使用以下代码，我收到一条错误消息：“未定义googleCalendarPlugin”：

var calendar = new FullCalendar.Calendar(calendarEl,{
        initialView: 'dayGridMonth',plugins: [ googleCalendarPlugin ],googleCalendarapiKey: 'aGeneratedKey',events: {
            googleCalendarId: 'myCalendarURL'
        }
    });

然后我尝试从那里简单地删除该插件，这解决了先前的问题，但是，现在我从Google那里得到了结果，说我的API密钥不正确...。这可能是有道理的，因为我无法并没有遵循Fullcalendar的确切程序，例如在文档中说创建“浏览器密钥”，但是Google只为我提供了创建OAuth客户端ID或服务帐户的可能性，而不是创建浏览器密钥...

有人知道如何使它工作吗？

或者没有人知道在网站上显示您的Google日历的好方法（除非使用google提供的iframe方法，因为这无法设置样式）？

EDIT ：似乎我设法以某种方式创建了适用于日历的API密钥...但是，现在我得到的是404，我想这意味着{{1} }是不正确的……可能是这样，因为它看上去也与文档显示的完全不同。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

fullcalendarfullcalendar-5google-calendar-apihtmljavascript