LiveView 原生不支持客户端直接解析 XML，需用 JS Hook 在上传前通过 FileReader 和 DOMParser 预览；服务端仅做透传校验，避免用 :xmerl 解析；预览渲染须区分源码展示（手动转义后 raw）与结构渲染（JS 生成 HTML）。
LiveView 里上传 XML 文件的核心限制
LiveView 原生不支持直接读取客户端文件内容（比如用 FileReader 解析 XML 字符串），因为它的上传机制基于 allow_upload + 服务端临时存储，文件内容不会自动暴露给前端 JS 或 LiveView 状态。想“实时预览”，必须绕过纯 LiveView 流程，在客户端先解析。
用 JS Hook 在上传前解析 XML 并预览
这是最可行的路径：用户选中文件后，不立即触发 LiveView 上传，而是用 handleInput 拦截 <input type="file">，用 FileReader 同步读取并解析 XML，再把结构化数据（如 DOM 或 JSON）传给 LiveView 更新预览区域。
- Hook 名必须匹配 LiveView 中定义的
phx-hook属性，例如phx-hook="XMLPreview" - 在
mounted()里监听input[type="file"]的change事件 - 用
new DOMParser().parseFromString(content, "application/xml")解析，检查parsererror元素判断是否格式错误 - 解析成功后调用
this.pushEvent("xml_preview", { xml: content })把原始字符串发给 LiveView（注意：不是 DOM 对象，LiveView 不认）
def handle_event("xml_preview", %{"xml" => xml}, socket) do
case parse_xml_preview(xml) do
{:ok, doc} -> {:noreply, assign(socket, :xml_preview, doc)}
{:error, msg} -> {:noreply, assign(socket, :xml_error, msg)}
end
end
允许上传但跳过服务端解析，只做透传校验
如果后续还需正式上传（比如存到 S3 或数据库），不要在 handle_event 里重复解析 XML —— 应该让 LiveView 的 allow_upload 走标准流程，仅用于传输和校验，实际解析仍由前端完成。否则会因编码、换行、BOM 等问题导致前后端 XML 内容不一致。
-
allow_upload的accept: "application/xml,text/xml"只控制 MIME 类型，不保证内容合法 - 服务端收到上传后，建议只做基础校验（如文件大小、扩展名、是否为空），不做
File.stream!+:xmerl解析 —— 这既慢又容易崩溃 - 若必须服务端解析（如生成摘要或验证 schema），应在上传完成回调
handle_event("upload_finished", ...)中异步处理，避免阻塞 LiveView 进程
预览渲染时注意 XML 特殊字符和安全性
前端解析出的 XML 字符串或节点，不能直接用 Phoenix.HTML.Safe.to_iodata/1 插入模板，否则会转义失败或引发 XSS（比如 XML 中含 <![CDATA[<script>...]]>）。必须明确区分“展示源码”和“渲染结构”两种模式。
- 展示源码：用
<pre><code class="xml"><%= raw(@xml_preview) %></code></pre>，但需先用String.replace_leading/3和String.replace(<%, "&")手动转义关键符号 - 渲染结构：用 JS Hook 把
documentElement遍历生成 HTML 树（带缩进、颜色、可折叠），再挂载到指定div，LiveView 只负责占位不参与渲染逻辑 - 服务端返回的
@xml_preview如果是 map 或 list，应来自前端JSON.stringify(doc)后发送，而非直接传 XML 字符串
handle_event 里用 :xmerl 解析大 XML，也别依赖 uploaded_files 的 metadata 获取内容 —— 它们都不包含原始字节流。 
