HTML5 required属性失效：为何空字段表单能提交至Flask服务器？

我的表单里有一个带required属性的textarea，代码如下：

<textarea class="form-control" 
  id="text-area" name="text-area-name" 
  rows="1" placeholder="Enter some information..." required
  autocomplete="off"></textarea>

我在桌面端和安卓Chrome上测试过，空字段时表单会阻止提交并提示填写，但Flask服务器日志显示有用户提交了空值的该字段，导致数据存不进数据库。想知道用户为什么能提交空值，需要排查哪些可能的问题？

可能的原因及排查方向 #

• 用户绕过前端验证：
  • 浏览器禁用了JavaScript：部分浏览器在禁用JS后会跳过HTML原生表单验证；
  • 用户手动篡改DOM：通过开发者工具删除required属性，或者直接用工具（如curl、Postman）构造POST请求提交数据，完全绕过前端页面。
• 浏览器兼容性问题：
  • 用户使用了不支持HTML5原生required属性的老旧浏览器（比如IE9及更早版本），这类浏览器不会触发原生验证逻辑。
• 自定义提交逻辑覆盖原生验证：
  • 页面中有自定义JS提交表单的代码，比如直接调用form.submit()，没有先调用form.checkValidity()触发原生验证，导致跳过必填校验。
• 空白字符被误认为有效内容：
  • 用户输入了空格、换行等纯空白字符，HTML原生required属性会认为字段有值（仅检查是否存在内容，不校验是否为空白），允许提交，但后端数据库要求非空且非空白，因此存入失败。
• 后端缺少校验：
  • 前端验证仅作为用户体验层的防护，不能替代后端校验。如果后端没有对该字段做非空（或非空白）校验，空值会直接进入数据库操作流程，导致存储失败。

内容的提问来源于stack exchange，提问作者Roge