对谷歌的完整日历调用抛出不存在“访问控制允许来源”标题答案

【问题标题】：full calendar call to google throws No 'Access-Control-Allow-Origin' header present对谷歌的完整日历调用抛出不存在“访问控制允许来源”标题
【发布时间】：2015-07-11 17:58:07
【问题描述】：

我正在尝试使用完整日历将我的谷歌日历嵌入我的网站。我已经使用 bower 包含了全日历，并且 css 和 js 文件都在我的索引文件中。我还包含 id 'calendar' 中的 div。

我关注了http://fullcalendar.io/docs/google_calendar/上的文档

在我的 init.js 文件中，我有以下代码：

$(document).ready(function() {
  $('#calendar').fullCalendar({
    header: {
      left: 'prev,next today',
      center: 'title',
      right: 'month,basicWeek,basicDay'
    },
    googleCalendarApiKey: 'myApiKey',
    eventSources: [
      {
        url: "https://www.google.com/calendar/feeds/mycalendarid/public/basic",
        dataType : 'jsonp'
      }
    ],
    eventClick: function(event) {
      // opens events in a popup window
      window.open(event.url, 'gcalevent', 'width=700,height=600');
      return false;
    }
  });

我也尝试了事件而不是 eventSources：

events: 'https://www.google.com/calendar/feeds/mycalendarid/public/basic',

但我不断收到以下错误消息：

XMLHttpRequest 无法加载 https://www.google.com/calendar/feeds/mycalendarid/public/basic?start=2015-04-26&end=2015-06-07&_=1431414654809。请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，不允许访问 Origin 'http://localhost:9000'。

在控制台中，我的 api 密钥设置为“http://localhost:9000”，所以我的来源应该没问题。我还将我的日历设为公开。

我还能做错什么？

【问题讨论】：

标签： javascript fullcalendar

【解决方案1】：

我今天遇到了这个问题，我发现它是在包含fullcalendar/gcal.js之后旋转的。

<script type='text/javascript' src='fullcalendar/gcal.js'></script>

详细信息请查看FullCalendar Docs 上的依赖项部分。

【讨论】：