【严重】知识库/门户上传文件后，拖动页面或改变窗口宽度会导致已上传文件列表消失

## 【严重】知识库/门户上传文件后，拖动页面或改变窗口宽度会导致已上传文件列表消失

**例行检查**

[//]: # "方框内填 x 表示打钩"

* [x] 我已确认目前没有类似 issue
* [x] 我已完整查看过项目 README，以及[[项目文档](https://doc.fastgpt.io/introduction/)](https://doc.fastgpt.io/introduction/)
* [x] 我使用了自己的 key，并确认我的 key 是可正常使用的
* [x] 我理解并愿意跟进此 issue，协助测试和提供反馈
* [x] 我理解并认可上述内容，并理解项目维护者精力有限，**不遵循规则的 issue 可能会被无视或直接关闭**

**你的版本**

* [x] 公有云版本
* [x] 私有部署版本, 具体版本号: V4.14.9

**问题描述, 日志截图，配置文件等**

在 FastGPT 知识库上传文件时，文件上传完成后，如果拖动页面、调整浏览器窗口宽度，或触发 PC / 移动端响应式布局切换，页面上已经上传成功的文件会直接消失。

这个问题在 **公有云版本和私有化版本中都存在**，并且不是偶发体验问题，已经存在较长时间。

典型场景：

```text
知识库上传文件 -> 文件显示已上传 -> 拖动页面 / 调整窗口宽度 -> 已上传文件消失
```

门户场景也可以复现：

```text
企业门户中上传文件 -> 文件显示已上传 -> 拖动页面 / 调整窗口宽度 -> 已上传文件消失
```

这个问题影响比较严重，尤其是企业用户场景：

1. 企业用户很多是非开发人员，不会理解这是前端状态丢失；
2. 文件上传后突然消失，会让用户误以为上传失败、文件丢失或系统不稳定；
3. 大文件上传耗时较长，用户可能会重复上传，增加使用成本；
4. 在知识库建设、企业门户交付、客户培训场景中，这会明显影响产品可信度；
5. 如果用户已经上传多个文件，只要误拖动窗口或触发响应式切换，就可能丢失当前页面上的上传列表，体验非常差。

从接口现象看，上传流程已经请求过类似接口：

```text
/api/core/dataset/presignDatasetFilePostUrl
```

后续也有训练队列轮询：

```text
/api/core/dataset/training/getDatasetTrainingQueue?datasetId=xxx
```

所以这个问题看起来不像是后端上传接口失败，更像是前端上传页状态在页面响应式切换时被重置。

**复现步骤**

方式一：知识库页面复现

1. 进入知识库；
2. 点击上传文件；
3. 选择一个 PDF / Word / 文档文件；
4. 等待文件上传完成，页面上出现已上传文件；
5. 拖动浏览器窗口边缘，改变页面宽度；
6. 或者打开浏览器开发者工具，在 PC / mobile 宽度之间切换；
7. 观察上传文件列表。

方式二：企业门户复现

1. 在企业门户中进入知识库上传入口；
2. 上传文件；
3. 文件上传完成后，页面上出现已上传文件；
4. 拖动页面或调整浏览器窗口大小；
5. 已上传文件从页面上消失。

**预期结果**

上传成功后的文件列表不应该因为拖动页面、改变浏览器窗口宽度、缩放页面，或触发 PC / mobile 响应式布局切换而消失。

即使页面布局发生变化，已上传文件也应该继续保留，用户可以继续下一步导入 / 训练操作。

**实际结果**

上传成功后的文件会在拖动页面、改变窗口宽度、触发响应式布局切换后，从页面上直接消失。

用户无法判断文件是否真的上传成功，会误以为上传失败或数据丢失。

**可能原因分析**

我不确定判断是否完全准确，供参考。

我看了一下前端实现，怀疑问题可能和知识库详情页 PC / mobile 两套布局切换有关。

如果上传组件 `<Import />` 挂在类似下面这种响应式分支里：

```tsx
{isPc ? (
  // PC layout
  <Import />
) : (
  // mobile layout
  <Import />
)}
```

那么当窗口宽度变化导致 `isPc` 切换时，React 会卸载当前分支里的 `<Import />`，再挂载另一个分支里的 `<Import />`。

如果上传文件列表状态是在 `<Import />` 内部或其 Context Provider 内通过 `useState` 临时维护，例如：

```tsx
const [sources, setSources] = useState([]);
```

组件重新挂载后，`sources` 会重新初始化为空数组，页面上已上传的文件列表就会消失。

**建议修复方向**

建议不要让知识库上传流程组件因为 PC / mobile 响应式切换而被卸载。

可以考虑：

1. 上传流程组件使用稳定的组件树；
2. PC / mobile 只调整样式，不切换整个上传组件实例；
3. 将上传文件列表状态提升到不会被响应式切换卸载的父级；
4. 或者在上传成功后，将已上传文件信息做临时持久化，避免 remount 后丢失。

比较理想的是：导入页本身保持稳定，不参与 PC / mobile 两套分支切换，例如：

```tsx
if (currentTab === TabEnum.import) {
  return <StableImportLayout />;
}
```

这样拖动页面或切换响应式布局时，上传组件不会被卸载，已上传文件列表也不会丢失。

**相关截图**

我可以补充录屏，录屏内容包括：

1. 上传文件成功；
2. 页面出现已上传文件；
3. 拖动页面或调整窗口宽度；
4. 文件列表消失。

注：上传接口中包含 presigned URL、签名参数、datasetId、文件名等敏感信息，相关请求地址会做脱敏处理后再补充。

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

【严重】知识库/门户上传文件后，拖动页面或改变窗口宽度会导致已上传文件列表消失 #7053