$_FILES为空主因是表单缺失enctype="multipart/form-data"，需同时检查method="POST"、name键名一致及file_uploads=On、upload_max_filesize和post_max_size配置足够大。
上传日志文件时后端没收到内容，$_FILES 为空
常见现象是 PHP 后端 var_dump($_FILES) 输出空数组，但前端明明选了日志文件。根本原因不是代码写错，而是表单漏了关键属性：enctype="multipart/form-data"。没有它，浏览器会把文件当普通文本字段发过去，服务端根本识别不了二进制数据。
必须检查以下三点：
-
<form>标签同时具备method="POST"和enctype="multipart/form-data"—— 缺一不可 -
<input type="file">的name属性值（如name="log_file"）要和 PHP 中$_FILES["log_file"]的键名严格一致 - PHP 配置项
file_uploads = On、upload_max_filesize和post_max_size要足够大（日志文件常超 2MB，建议设为10M）
用 JavaScript 读取日志并高亮报错行，不依赖后端解析
如果只是想在前端快速查看日志、定位错误，完全没必要上传——直接用 FileReader 读本地文件，再正则匹配关键词即可。这样快、安全、不占服务器资源。
核心逻辑很简单：
立即学习“前端免费学习笔记（深入）”；
- 监听
input[type="file"]的change事件，拿到files[0] - 用
new FileReader().readAsText(file)加载内容 - 加载完成后，用
split('\n')拆成行，对每行做.includes('ERROR') || .includes('Exception')判断 - 拼 HTML 时给匹配行加
<span style="background:#ffebee">…</span>包裹
注意：不要用 readAsDataURL，它会把文本转成 base64，增加处理负担；也不要一次性渲染几万行——加个 if (lines.length > 5000) lines = lines.slice(0, 5000) 防卡死。
XMLHttpRequest 上传日志时如何捕获真实错误原因
单纯看 xhr.status !== 200 不够。比如服务器磁盘满、PHP move_uploaded_file() 权限失败、或 tmp_name 被清掉，返回的都是 500，但具体原因藏在响应体里。
务必做两件事：
- 后端 PHP 在出错时输出明确信息，例如：
echo json_encode(['error' => 'Permission denied on uploads/ dir']); - 前端
xhr.onload中检查xhr.getResponseHeader('Content-Type')是否含application/json，再JSON.parse(xhr.responseText)提取错误字段 - 避免只写
alert('Upload failed')—— 用户根本不知道该去改权限还是删文件
另外，上传大日志文件时记得设超时：xhr.timeout = 30000，否则网络卡住会一直 pending，UI 无反馈。
日志高亮后导出为 HTML 文件再上传，结果样式丢失
你生成了一个带 <style> 和高亮 <span> 的 HTML 日志报告，本地打开正常，但上传到服务器后访问时样式全没了。问题不在上传过程，而在服务器配置。
典型原因有两个：
- Apache/Nginx 没配对
.html响应头，导致浏览器用text/plain解析，CSS 不生效。确认 Nginx 有types { text/html html; }，Apache 有AddType text/html .html - 你用了内联样式（
style="..."），但某些托管平台（如 GitHub Pages）会过滤 script/style 标签。解决方案是把样式抽成外部 CSS 文件，一起上传，并确保路径引用正确（如<link rel="stylesheet" href="log-style.css">）
最省事的办法：不用 CSS，改用纯 HTML 语义标签，比如用 <mark> 替代 <span style="...">，它原生支持高亮且兼容性好（IE9+）。
