传文件时最怕的就是不知道进度，点了上传按钮后界面没反应，也不知道是卡了还是传完了。其实上传进度条的位置并不固定，它藏在不同的地方，得看你在用什么平台、什么工具。
网页上传时的进度条
比如你在网盘传照片，像百度网盘、阿里云盘这些，上传进度条通常出现在上传区域的下方或旁边。你拖完文件松手，页面会立刻列出文件名，紧接着出现一个蓝色或绿色的细长条，上面还带着百分比数字，那就是进度条。有时候它会缩成一个小圆圈，在文件图标上转圈，这种叫环形进度指示器。
如果完全看不到任何动静，先检查是否弹出了拦截窗口。有些浏览器默认阻止文件读取，你得点一下地址栏右边的小图钉或者警告三角，允许网站访问文件系统才行。
手机App里的上传显示
用微信发视频给朋友，选完相册里的大文件后，聊天框里不会马上发出，而是先显示一个带进度的提示。这时候底部会出现一条渐变色的横条，从左往右慢慢填满，同时写着“正在发送”。要是你切到别的聊天窗口，下拉通知栏也能看到后台上传的实时进度。
抖音发短视频也类似，编辑完点击发布，跳转到上传页面后，顶部有一条动态增长的线，旁边标注“上传中 45%”这样的信息。千万别急着锁屏，部分老款机型锁屏后会暂停上传任务。
开发场景下的自定义进度条
如果你自己写前端代码处理文件上传，原生 HTML 并不自带可视化进度条，得靠 JavaScript 监听上传事件来实现。常见的做法是利用 XMLHttpRequest 的 upload.onprogress 回调：
const xhr = new XMLHttpRequest();
xhr.upload.onprogress = function(e) {
if (e.lengthComputable) {
const percent = e.loaded / e.total * 100;
document.getElementById('progress-bar').style.width = percent + '%';
document.getElementById('progress-text').innerText = Math.round(percent) + '%';
}
};
xhr.open('POST', '/upload');
xhr.send(formData);
上面这段代码会在每次收到服务器响应数据块时更新 DOM 元素，模拟出进度效果。记得给 #progress-bar 设置 overflow: hidden 和背景色，才能看出填充变化。
某些软件隐藏了进度条
像一些老旧的内部管理系统，可能只在控制台打印日志而不展示图形化进度。这时候按 F12 打开开发者工具，切换到 Network 标签页，找到对应的 POST 请求，点击查看详情，在 Preview 或 Timing 子标签里能看到传输状态和耗时。
还有些桌面程序把进度条放在任务栏图标上，比如 Windows 上的 OneDrive 客户端，虽然主界面关掉了，但鼠标悬停在任务栏云图标上，就能看到当前同步的百分比。
网络波动导致进度卡住
有时候进度条走到一半不动了，可能是网络抖动。可以试着刷新页面重新上传，但注意部分网站不支持断点续传，一刷新就得从头再来。建议传大文件前连上稳定 Wi-Fi，并关闭其他占用带宽的应用。
如果多次尝试都没法正常显示进度，不妨换个浏览器试试，Chrome 和 Edge 对大文件上传的支持相对更稳定。清除缓存后再试一次，有时积压的旧脚本会影响新上传逻辑的执行。