FullCalendar v6调用API时UTC日期带Z字符致接口报错求助

问题核心 #

v6默认会将start/end参数格式化为带UTC标识的ISO字符串（如2023-08-27T00:00:00Z），而v3使用的是纯日期格式（如2023-08-27），后端解析器无法处理带Z的格式，导致报错。

解决方法：自定义事件请求逻辑 #

放弃直接使用字符串URL作为events配置，改用自定义函数控制请求参数的生成，手动将日期格式转为v3兼容的纯日期字符串：

document.addEventListener('DOMContentLoaded', function() {
    var calendarEl = document.getElementById('calendar');
    var calendar = new FullCalendar.Calendar(calendarEl, {
        timeZone: user_timezone,
        // 替换原events字符串为自定义函数
        events: function(info, successCallback, failureCallback) {
            // 从ISO字符串中提取纯日期部分（截断T及之后的内容）
            const startDate = info.startStr.split('T')[0];
            const endDate = info.endStr.split('T')[0];
            
            // 拼接符合v3格式的请求URL
            const requestUrl = `/schedule/api/occurrences?calendar_slug={{request.user}}&timeZone=${user_timezone}&start=${startDate}&end=${endDate}`;
            
            // 发起请求并回调结果
            fetch(requestUrl)
                .then(response => response.json())
                .then(eventData => successCallback(eventData))
                .catch(err => failureCallback(err));
        },
        eventClick: function(info) {},
        // 其他配置项...
    });
    calendar.render();
});

关键说明 #

• info.startStr和info.endStr是v6提供的标准化日期字符串，通过split('T')[0]可以快速提取YYYY-MM-DD格式的纯日期。
• 手动拼接timeZone参数，保持和v3请求的参数结构一致，避免后端逻辑因参数缺失出错。
• 使用原生fetch发起请求，也可以根据项目需求替换为jQuery的$.ajax等请求方式。

内容的提问来源于stack exchange，提问作者haduki