FastAPI图片上传仅Swagger UI可用 表单提交报422 job_image为None

返回422状态码、后端无法获取上传文件的核心原因是表单未配置文件上传必需的编码属性，和Starlette框架本身无关。
HTML表单如果包含文件上传控件，必须显式设置enctype="multipart/form-data"，否则浏览器默认使用application/x-www-form-urlencoded格式编码请求，该格式不支持传输二进制文件内容，后端无法正确解析UploadFile类型的参数，就会触发参数校验失败返回422。Swagger UI可以正常请求是因为它发起文件上传请求时会自动携带正确的编码头。

• 修改form标签，补充编码属性：不管是原生表单提交还是HTMX异步提交，都需要给form标签加上enctype="multipart/form-data"，修改后代码如下：

<form method="post" action="/jobs/create" hx-post="/jobs/create" enctype="multipart/form-data">

• 删除文件输入框的无效value配置：<input type="file">元素的value属性为只读状态，无法通过模板语法预赋值，保留该配置无实际作用，还可能触发部分浏览器的兼容问题，修改后的输入控件代码：

<input class="form-control" type="file" id="job_image" name="job_image" accept=".jpeg,.png,.jpg" placeholder="image">

完成上述修改后重启服务，重新提交表单即可正常获取job_image对应的上传文件对象，执行print(job_image.filename)可正常输出上传文件名，422错误会同步消失。

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