Flask表单提交时文件字段缺失无法上传数据问题求助

问题描述 #

提交表单时分析请求发现，除文件数据外所有字段均正常提交，暂未排查到问题原因，希望有相关经验的开发者能给出解决提示。
检查请求体时发现除文件字段外其余字段均存在，且没有对应文件数据提交到数据库。

相关代码 #

route.py 代码 #

@users.route("/account",  methods=["GET", "POST"])
@login_required
def account():
    form = UpdateAccountForm()
    if form.validate_on_submit():
        if form.pic.data:
            file_data = save_pict(form.pic.data)
            current_user.picture = file_data
        else:
            print("no data was sent")
        current_user.username = form.username.data
        current_user.email = form.email.data
        db.session.commit()
        flash("Your profile was updated!", "success")

        return redirect(url_for("users.account"))

forms 文件代码 #

class UpdateAccountForm(FlaskForm):
    username = StringField("Username", validators=[DataRequired(), Length(min=5, max=15)])
    email = StringField("Email", validators=[DataRequired(), Email()])
    pic = FileField("Update Picture", validators=[FileAllowed(["jpeg", "png"])])
    submit = SubmitField("Update")

HTML 模板代码 #

<div class="content-section">
    <div class="media">
        <img class="rounded-circle account-img" src={{image}}>
        <br>
        <div class="media-body">
            <br>
            <h2 class="account-heading">{{current_user.username}}</h2>
            <p class="secondary">{{current_user.email}}</p>
        </div>
    </div>
    <div class="registration-form">
        <form method="post" action="" enctype="multipart/form-data">
            {{form.hidden_tag()}}
            <fieldset class="form-group"><br>
                <legend class="border-bottom mb-4">Account info</legend>
                <div class="form-group">
                    {{form.username.label(class="form-control-label")}}

                    {%if form.username.errors%}
                        {{form.username(class="form-control form-control-lg is-invalid")}}
                        <div class="invalid-feedback">
                            {%for error in form.username.errors%}
                                <span>{{error}}</span>
                            {%endfor%}
                        </div>
                    {%else%}
                        {{form.username(class="form-control form-control-lg")}}
                    {%endif%}
                </div>
                <div class="form-group">
                    {{form.email.label(class="form-control-label")}}

                    {%if form.email.errors%}
                        {{form.email(class="form-control form-control-lg is-invalid")}}
                        <div class="invalid-feedback">
                            {%for error in form.email.errors%}
                                <span>{{error}}</span>
                            {%endfor%}
                        </div>
                    {%else%}
                        {{form.email(class="form-control form-control-lg")}}
                    {%endif%}
                </div>

                <div class="form-group">
                    {{ form.pic.label() }}
                    {{ form.pic(class="form-control-file") }}
                    {% if form.pic.errors %}
                        {% for error in form.pic.errors %}
                            <span class="text-danger">{{ error }}</span></br>
                        {% endfor %}
                    {% endif %}
                </div>

            </fieldset>

            <div class="form-group">
                {{form.submit(class="btn btn-outline-info")}}
                
            </div>

        </form>
    </div>
</div>

排查解决步骤 #

• 先确认save_pict函数是否正常工作，可在该函数内部加打印日志，确认传入的文件对象是否存在、文件保存路径是否有权限写入，返回的文件名是否符合预期
• 检查Flask应用是否配置了正确的MAX_CONTENT_LENGTH，如果上传的图片大小超过限制，文件数据会被直接丢弃不会传入后端
• 可在form.validate_on_submit()之前打印request.files确认是否收到文件数据，验证FileAllowed校验是否拦截了上传请求，如果文件格式不符合要求，校验不通过会直接把form.pic.data置空
• 确认当前登录用户的picture字段对应的数据库列类型是否正确，是否为字符串类型可存储文件名/路径
• 如果是部署在Nginx等反向代理后，检查代理配置是否限制了上传文件大小，默认Nginx的client_max_body_size为1M，超过的文件会被截断丢弃

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