Question

我继承维护的应用程序在尝试加载Fullcalendar呈现的事件JSON流时超时。

我希望我能获得批准在这个问题上投入更多的计算资源，希望能够解决它，但除此之外，我很难弄清楚如何解决这个问题。

我的一个想法是将数据请求分成更小的部分，一次请求1周的数据（而不是1个月）。

这看起来应该是可行的，但我无法弄清楚如何捕捉时间范围的变化，将其拆分为较小的块，然后从中发出多个请求，而不仅仅是一个。

Answer 1

您似乎正试图解决主要问题为什么要超时？不知道很多细节，它可能像简单一样数据库服务器上的索引或某些其他进程正在消耗许多资源。我建议您分析数据库和框架/服务器以解决问题。

那就是说，你可以做两件事：

禁用month视图以强制FullCalendar使用agendaWeek或agendaDay。像这样：

$('#calendar').fullCalendar({
    header: {
        left: 'prev,next',
        center: 'title',
        right: 'agendaWeek,agendaDay'
    },
    defaultView: 'agendaWeek'
});

See an example。

如果您确实需要month视图，则可以使用events as a function。您必须计算该月每周的开始和结束日期，然后调用回调。像这样：

$('#calendar').fullCalendar({
    events: function(start, end, timezone, callback) {
        // do this in chunks only when view is month
        if ($("#calendar").fullCalendar( 'getView' ).name == 'month') {
            // You'll need to get the start and end day of each week.
            // The parameters `start` amd `end` relate to the first day of
            // the month and the last day of the month.

            // You should get an array of objects, like this
            var weeks = [
                {start: '2014-09-28', end: '2014-10-04'},
                {start: '2014-10-05', end: '2014-10-11'},
                {start: '2014-10-12', end: '2014-10-18'},
                {start: '2014-10-19', end: '2014-10-25'},
                {start: '2014-10-26', end: '2014-11-01'}
            ];

            // When you have that:
            for(var i in weeks) {
                getEvents(weeks[i].start, weeks[i].end, callback);
            }
        }
        // if its another view, get all events at once
        else {
            getEvents(start, end, callback);
        }
    }
});

function getEvents(start, end, callback) {
    $.ajax({
        url: 'events',
        dataType: 'json',
        async: false,
        data: {
            start: start,
            end: end
        },
        success: function(events) {
            callback(events);
        }
    });
}

为了计算周开始和结束，你可以看一下这个问题：get next week start and end using jquery and moment js，它应该可以帮到你。

请注意，我已将async: false添加到$.ajax，以便一次只能有一个请求。

另请注意，此代码适用于FullCalendar 2. *。既然你在谈论现有的应用程序，那么有些东西会有所不同。 documentation for events of version 1.*表示签名略有不同：function( start, end, callback ) { }

在月视图中每周（或每个块）启用一个请求

1 个答案: