Phoenix LiveView 中处理 GLB 文件上传的类型检测问题

在 Phoenix LiveView 项目中处理 3D 模型文件上传时，开发者可能会遇到一个特殊问题：当上传 GLB 格式（GLTF 二进制格式）文件时，上传进度回调函数无法正常触发。本文将深入分析这一问题的成因，并提供专业的解决方案。

问题现象分析

当使用 LiveView 的文件上传功能处理 GLB 文件时，开发者可能会观察到以下现象：

1. 上传进度条卡在 0% 不动
2. 检查 UploadEntry 结构体发现 client_type 字段为空字符串
3. 尽管在 allow_upload 中明确指定了接受 .glb 扩展名，问题依然存在

根本原因

经过深入分析，我们发现问题的根源在于浏览器行为：

1. 浏览器在上传 GLB 文件时通常不会自动设置正确的 Content-Type 头信息
2. LiveView 的 UploadEntry 结构体中 client_type 字段直接来自浏览器提供的元数据
3. 当 client_type 为空时，某些上传处理逻辑（特别是外部存储集成）可能会中断上传流程

解决方案

推荐方案：在外部存储预处理阶段处理

最优雅的解决方案是在 :external 回调函数中进行类型修正：

allow_upload(socket, :model,
  external: fn entry, socket ->
    # 修正缺失的 content-type
    entry = if entry.client_type == "" do
      %{entry | client_type: "model/gltf-binary"}
    else
      entry
    end
    MyApp.Asset.presign_upload(entry, socket)
  end
)

这种方式的优势在于：

• 不违反 LiveView 的内部状态管理规则
• 在适当的生命周期阶段进行修正
• 保持代码整洁且符合框架设计理念

备选方案：MIME 类型配置

虽然配置 MIME 类型不能直接解决此问题，但对于项目完整性仍然是推荐做法：

config :mime, :types, %{
  "model/gltf-binary" => ["glb"]
}

最佳实践建议

1. 不要直接修改 UploadEntry 结构体：这会导致 LiveView 内部状态不一致
2. 处理所有可能的空类型情况：不仅限于 GLB 文件，其他特殊格式文件也可能有类似问题
3. 在正确的生命周期阶段处理：:external 回调是最合适的修正点
4. 浏览器兼容性考虑：不同浏览器对 GLB 文件的处理方式可能不同，要做充分测试

技术深度解析

LiveView 的文件上传机制中，client_type 直接来自浏览器的 File API 提供的 type 属性。对于某些非标准文件类型，浏览器可能无法正确识别或提供 MIME 类型。这种情况下，开发者需要在保证不破坏框架状态管理的前提下，智能地补充缺失的类型信息。

通过本文的分析和解决方案，开发者可以优雅地处理 GLB 等特殊格式文件的上传问题，同时保持代码的健壮性和可维护性。