jquery - 使用 ASP.NET MVC 的 FullCalendar 中的 DateTimeOffset

Question

我将此 DateTimeOffset 2016-08-01 09:30:00.0000000 -04:00 从我的 SQL Server 数据库传递到 FullCalendar。事件似乎正在渲染，但总是提前 4 小时。我想指出的是，当我使用 datetime2 时，它做了完全相同的事情。我检查了 SQL Server，它显示了正确的当前时间，所以我不确定问题是什么。

这是我的 FullCalendar 实现:

<script type="text/javascript">
    $(document).ready(function ()
    {
        $('#calendar').fullCalendar(
        {
            header:
            {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
            editable: false,
            events: "/home/loadevents/"

        })
    });
</script>

View 模型:

public class CalendarEventsViewModel
{
    //Properties have to conform to the following API standards
    //or the FullCalendar.js library will reject all incoming data.
    //http://fullcalendar.io/docs/event_data/Event_Object/

    public int id { get; set; }
    public string title { get; set; }
    public DateTimeOffset start { get; set; }
    public DateTimeOffset end { get; set; }
}

操作结果/Linq:

public ActionResult LoadEvents (DateTime start, DateTime end)
{

    IEnumerable<CalendarEventsViewModel> model =
    db.CalendarEvents
    .Select(r => new CalendarEventsViewModel
    {
        id = r.EventID,
        title = r.EventName,
        start = r.EventScheduleDateTime,
        end = r.EventScheduleDateTime,
    });


    return Json(model, JsonRequestBehavior.AllowGet);
}

编辑:

通过断点仔细观察后，我注意到不是将 2016-08-01 09:30:00.0000000 -04:00 推送到 FullCalendar，而是推送 8/1/2016 09:30:00 AM 但它仍然显示比我的本地时间早四个小时。我不确定偏移量是否从 linq 语句中的数据库中丢失，即使我在数据库和 viewmodel 属性中都使用了 datetimeoffset。我还在上面添加了更多代码。

编辑2:

看来我错了，它正在发送 {8/1/2016 9:30:00 AM -05:00}，所以我还不确定问题是什么。我的猜测是，这可能不符合 FullCalendar 要求？

编辑3:

在我的数据库中，我存储了2016-08-01 09:30:00.0000000 -04:00。当它到达 linq 查询时，根据调试，它变成 8/1/2016 9:30:00 AM -04:00 。当日期/事件显示在 FullCalendar.js 中时，它显示为比下午 1:30 晚四个小时。我肯定对偏移有一些误解，但我不知道是什么。

Answer 1

因为你使用的是MVC的JsonResult (通过调用 Controller 的 Json 方法返回)，JSON 序列化由 JavaScriptSerializer 处理类(class)。不幸的是，这个特定的序列化器无法处理 DateTimeOffset值非常好。它将它们标准化为 UTC，然后将它们呈现在 an antiquated format 中。 .

虽然 moment.js 确实可以读取该格式(因此也可以读取 FullCalendar)，但规范化过程意味着所有时间都将显示为 UTC，因此(在您的示例中)显示为提前四个小时。

您可以考虑通过两种方法来解决此问题:

1. 您可以通过设置 the timezone parameter 来告诉 FullCalendar 调整用户本地时间的所有时间戳。至local 。这不需要对后端进行任何更改，但意味着不同时区的用户将看到相对于自己的事件，而不是事件的本地时间。 (无论如何，这通常是需要的，所以首先考虑这一点。)

2. 您可以将 MVC 代码中使用的序列化器更改为使用 JSON.Net而不是 JavaScriptSerializer 。默认情况下，JSON.Net 将使用标准 ISO8601 格式，并将保留 DateTimeOffset 的偏移量。值(value)。如果您想在整个项目中全局执行此操作，请参阅 this approach ，尽管您可以简单地更改 LoadEvents 的最后一行方法:

   string json = JsonConvert.SerializeObject(model);
   return Content(json, "application/json");
   

   还值得一提的是，ASP.Net WebAPI 没有这个问题，因为它已经默认使用 JSON.Net。