我的完整日历上没有显示任何事件。（来自 Google 日历）

Question

我正在使用 JavaScript 插件 'fullcalendar' 和 google 日历模块在网页上查看 google 日历。问题是没有显示任何事件，控制台中也没有任何伴随的错误消息。

空日历显示正常。

我已经生成了 API 密钥，并检索了我要显示的日历的日历 ID。

我的JS如下：

    $(document).ready(function(){
      console.log("Function running");
      var calendar = $('#calendar'); 
      calendar.fullCalendar({
        googleCalendarApiKey: 'my-api-key',
        events: {
          googleCalendarId: 'my-calendar-id'
        }
      });
     });

我的html中的头像如下：

<link rel='stylesheet' href='fullcalendar/fullcalendar.css' />
<link rel='stylesheet' href='fullcalendar/fullcalendar.print.css' rel='stylesheet' media='print' />
<link href='style.css' rel='stylesheet' />
<script src='fullcalendar/lib/jquery.min.js'></script>
<script src='fullcalendar/lib/moment.min.js'></script>
<script src='fullcalendar/fullcalendar.js'></script>
<script src='fullcalendar/gcal.js'></script>
<script src="https://apis.google.com/js/client.js?onload=handleClientLoad"></script>
<script src='app.js' type='text/javascript'></script>
<script src='calendar.js' type='text/javascript'></script>

我有这么多参考资料的原因是因为我同时将日历 API 用于应用程序的一个稍微不同的部分。我查看了 chrome 开发工具中的网络选项卡，试图识别类似 JSON 的东西，将事件数据带到站点，但什么也没有。

我知道 fullcalendar 使用 AJAX 来更新屏幕上的日历，所以我尝试在我的 google 日历上创建一个新事件，并查看网络选项卡以防我看到变化, 但什么都没有。

console.log() 是运行快乐，所以我知道正在加载 js。

我尝试使用 gcal 提要返回到旧方法，但 $.fullcalendar.gcalFeed(url) 不再是一个函数（这很公平）。我有最新版本的 gcal.js 文件（V2.0 不再工作，所以必须对该文件进行微小的更改）。

如果有人能找出我哪里出错了，或者指出我尝试其他事情的新方向，我将非常感激，我现在已经完全没有想法了。

更新

我没有使用日历 ID，而是尝试使用日历中的提要（通过选择日历设置下的 xml 选项并将其复制到 JQuery 中）。这给了我一个错误：

XMLHttpRequest cannot load     https://google.com/calendar/feeds/ed.prince5769%40gmail.com/public/basic?start=2015-06-28&end=2015-08-09&_=1436196005956. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://edprince.uk' is therefore not allowed access. The response had HTTP status code 404.

如果我遵循这个 url，我就会得到我要找的东西，一大堆 XML，包括我日历上活动的所有详细信息。所以我认为这就是问题所在，无论出于何种原因，我都无法将所有这些数据加载到我的网站上。我现在要研究解决这个问题

更新#2

我刚刚通读了这篇关于这个问题的精彩 article。似乎有 3 种方法可以使用 JSONP、服务器端代理或 CORS。作者提到前两个解决方案会产生潜在的安全漏洞，而这个项目不允许这样做。 CORS 看起来像是一条可行的路线。

Answer 1

您正在尝试访问需要身份验证的 link。

如果您尝试在隐身模式 window 中访问相同的 URL，您是否收到相同的错误（“404 未找到”）？

我的完整日历上没有显示任何事件。 （来自 Google 日历）

No events being displayed on my fullcalendar. (From Google Calendar)

javascript

jquery

calendar

fullcalendar

更新

更新#2

我的完整日历上没有显示任何事件。（来自 Google 日历）