form 的 action 属性应优先使用根相对路径（如 /api/login），避免绝对 url；含文件上传时必须设 enctype="multipart/form-data"，部署在子路径需通过构建配置、 标签或反向代理统一处理路径。
form 的 action 属性到底填什么路径
填相对路径最稳妥，比如 /api/login 或 ./submit.php，而不是 http://localhost:3000/api/login 这种完整 URL。浏览器会自动补全协议、域名和端口，硬写死反而容易在部署后 404。
常见错误现象：本地开发能提交，上线后报 404 或 CORS 错误——大概率是 action 写了绝对地址，或路径漏了前置斜杠。
- 根路径开头的
/api/xxx从网站根目录解析（如访问https://example.com/admin/user，action="/api/save" → 请求https://example.com/api/save） - 无斜杠开头的
api/xxx是相对当前 URL 路径（如当前页是/admin/user，action="api/save" → 请求/admin/api/save） - 以
.开头的./api/xxx和不加斜杠行为一致，但语义更明确，推荐用
POST 提交时后端收不到数据？检查 enctype 和 method
默认 form 的 enctype 是 application/x-www-form-urlencoded，适合普通字段；如果用了 <input type="file">，必须显式设为 multipart/form-data，否则后端拿不到文件，甚至整个表单解析失败。
同时确认 method 是 POST —— 少数人误设成 GET，导致长文本截断、特殊字符乱码，或后端路由匹配不到。
-
<form method="POST" enctype="application/x-www-form-urlencoded"></form>：默认值，不用写，适合纯文本字段 -
<form method="POST" enctype="multipart/form-data"></form>：含文件上传时必须写，且后端框架（如 Express、Django）需配对应中间件 - 不要写
method="post"（小写）——HTML 不区分大小写，但部分老旧代理或安全网关可能异常，统一用大写POST
前端拦截提交再发请求，action 还需要吗
不需要。如果你用 event.preventDefault() 拦住原生提交，并用 fetch 或 axios 手动发请求，action 属性就完全失效了，删掉或留空都行。强行保留还可能误导协作者以为走的是原生提交。
典型场景：需要校验、加 token、处理上传进度、捕获网络错误——这些都超出原生 form 能力范围。
- 删掉
action或设为action="#"（仅占位，无实际作用） - 确保 JS 中绑定的是
submit事件，不是click，否则回车提交会被绕过 - 注意：若服务端接口要求
Content-Type: application/json，而你仍用FormData提交，后端解析会失败——要手动转成 JSON 并设 header
部署到子路径时 action 路径错乱怎么办
比如项目部署在 https://example.com/myapp/，但 form 的 action="/api/submit" 会请求根路径下的 /api/submit，而非 /myapp/api/submit。这时不能靠 JS 动态拼接，应由构建工具或后端注入基础路径。
Vue CLI、Create React App 等默认支持 homepage 字段；Next.js 用 basePath；纯静态页可由后端模板（如 EJS、Jinja）注入变量。
- 避免在 JS 里写
location.origin + '/myapp/api/...'—— 环境一换就崩 - Nginx 反向代理时，可通过 rewrite 规则把
/myapp/api/代理到后端/api/，让前端继续用根路径 action - 如果必须前端控制，用
<base href="/myapp/">标签，之后所有相对 action 都以此为基准（但注意它会影响页面内所有相对链接）
enctype 和部署路径的组合问题：一个没设 multipart/form-data 的带文件表单，在开发环境可能因后端宽容没报错，上线后直接静默失败；子路径部署时又忘了调整反代规则或 base 标签，结果接口全 404。这两处不看网络面板，很难一眼定位。
