用户填完表单点提交,浏览器跳到一个没有任何内容的地址,数据也没入库。第一次遇到会往复杂处想,其实漏掉的多是个小前提。

<form action='/submit' method='post'>
<!-- 或异步 -->
fetch('/submit', {method: 'POST', body: new FormData(form)});

表单的提交地址写成了接口路径而不是页面地址,接口只返回数据不输出页面。这一点先确认清楚,后面就不用反复试。

「表单提交空白页」这个问题文档写得含糊,实际行为以当前版本为准,别照旧版本的结论套。把复现步骤压到三条以内,交给同事也能跑出来,才算真的定位清楚。

改动写完就同步给同事,下一个人踩同一个坑,成本还是你的。验证用真实数据走一遍,测试数据太干净,边界情况根本碰不到。

能分两步做的操作就别合成一步,中间看一眼返回值,出问题好判断。报错里带路径的,先去看那个路径在不在、权限对不对。

具体做法是,确认提交地址与处理方式;改用异步提交并处理返回;保留原生提交时输出跳转页。

改完照着核一遍,提交后显示成功提示,数据正确入库。

作者 9823189