后端集成问题排查指南

症状

1. 无论是手动实现后端 API,还是按照我们的教程操作,打开页面时甘特图未显示任何任务或链接。

2. 在将更改保存到后端时遇到困难。

原因

导致不同平台上行为异常的原因和解决方法有很多,这里不做详细展开。

本指南旨在引导你排查此类问题的常见步骤。一旦定位到问题并理解应用为何无法正常工作,通常解决方法都很直接。

检查页面上的错误信息

1. 打开浏览器开发者工具并刷新页面。浏览器控制台是否有错误信息?

检查错误

2. 如果出现错误,请评估是否可以自行解决。如果无法解决,请继续下一步。

检查客户端请求

1. 打开Network面板,确保XHR请求可见。

2. 刷新页面,找到负责从后端加载数据的请求。确认其目标 URL 是否正确,并检查响应状态。

检查请求

是否有错误?

404 响应状态通常表示传递给gantt.init方法的 URL 不正确,或应用的路由配置有误。

检查服务器返回内容

选中该请求,查看响应预览或原始响应内容。

检查响应

响应内容是否符合预期数据格式

如果看到来自 Web 服务器的错误信息而不是 Gantt 数据

这通常说明后端代码或数据库连接配置存在问题。

一般来说,错误响应会包含足够的信息帮助定位原因。如果只看到通用的 500 server error 消息,可能需要临时禁用服务器上的自定义错误页面,以便查看真实错误。不同平台操作方式不同。如不确定,可搜索“disable custom error page in <%your server or framework%>”。

如果数据大体正确

请检查idstart_dateend_datedurationparent属性。

  • id – 具有相同 id 的任务会被合并。例如,若有五个任务 id 相同,甘特图只会显示其中一个。

  • parentparent值等于root_id配置的条目会显示在任务树的根级(默认情况下,任何空值,包括 0 或 null)。如果设置了parent属性,但数据集中没有对应的父任务,该项不会显示。

  • start_dateend_dateduration – 每项至少应包含这三者中的任意两项,比如start_dateduration。详见 数据加载

同时,请确保start_date/end_date的格式与 date_format 配置中指定的格式一致。

如果属性值有异常

请检查数据库中的内容,问题可能源于此。如果日期格式不匹配,可以调整date_format配置,或修改序列化任务日期的代码后再发送给客户端。

检查加载到 Gantt 的数据

  1. 打开浏览器控制台,运行gantt.getTaskByTime()

  2. 在控制台查看输出,结果应为任务数组。

检查数据

再次检查任务的start_dateend_dateparent属性。

过滤器

如果上述内容都没问题,请检查代码,任务可能被过滤器隐藏

最后手段

如果以上方法均无法解决问题,或页面既无任务也无控制台错误,请考虑在我们的论坛发帖或联系技术支持。

请务必附上排查过程中收集的所有信息。

此外,我们团队需要一个最小可复现的示例:可以是包含简化 app 的独立包(gantt 页面、所有必需文件、带测试数据的数据库备份,或包含你尝试加载数据的静态 JSON 文件),也可以是能在浏览器中直接检查问题的在线链接。

Back to top