A couple weeks ago I posted about modern convention for saving file uploads. BLOB vs File storage was the general topic. The group here informed me that saving files locally on the server in storage and then updating my database with a path to the storage location was the best practice.

I am attempting to build a profile page and I am having some unexpected results. I have an HTML form with action=POST. When I want to take in text information like a name or email address or integer information like age I am capable of receiving that information from my form and saving it as a variable and manipulating it. However, when i try to take in a file using the same form flask automatically reverts my action to a GET. The input type for this element is =file and type=image/*.

The problem, while unexpected, is recurrent and predictable. If the form is taking in name, email address, age, and profile picture the local server informs me that the action is GET (confirmed by print statements). If i comment out the file element on the form and refresh I am now able to enter name, email address, and age and flask confirms the action is POST.

I am to the point where I am thinking there must be some sort of issue with cloud 9/cs50IDE. Is it known/possible that the cs50 ide doesn't accept files. Perhaps for security or storage management reasons?

Thanks, Rob

PS please excuse the print statements. I have been trying to track this down for a while and they were helpful in determining if various conditionals where met.

HTML code


<html lang="en">
        <meta http-equiv="cache-control" content="max-age=0" />

        <form action="/upload" method="post" enctype="multipart/form-data">
            <input name="pet_name" placeholder="pet name" type=text>
            <input name="age" type=text>
            <!--<input name="pet_pic" placeholder="pet image"type=file accept=image/*>-->
            <input name="submit" type=submit>
        <h1>flask can be irritating</h1>

flask code

@app.route("/upload", methods = ['GET','POST'])
def upload_file():

    if request.method == 'GET':
        print("the method was get")

    if request.method == 'POST':
        print("the method was post")
        petname = request.form["pet_name"]
        petage = request.form["age"]
        print(petname, petage)

        if request.file:
            f = request.files['pet_pic']
            if allowed(filename):
                f.save(os.path.join(app.config['UPLOAD_FOLDER'], filename))
                flash("image uploaded")
        print("skip request.files")
    return render_template("./upload.html")
  • Suggest first step is validating the HTML as with Nu Html Checker. From an "eye-check" there are problems with the (commented) file input element: type "file" doesn't take placeholder; accept value not enclosed in quotes; space missing before type attribute. I don't know if this has any bearing on the problem, but from experience I know that errors from invalid HTML are like the Spanish Inquisition..... – DinoCoderSaurus Sep 1 '20 at 19:05

You must log in to answer this question.

Browse other questions tagged .