CODEWITHSUNDEEP
pythonflask
FCastell
FCastell

Reputation: 484

Python Flask: getting URL when moving to production

I'm using Python from quite some time but I am totally newbie in Flask. Can you help me with two simple questions I have been strugling two days?

I have a simple Flask app that supposed to import a XLSX or CSV, parse it and create a zip file to download. While I am begginig work on the parse part, I got an error when uploading the file, and I found out that the app is not saving the file altough it works when running flask locally. This is the code:

test2.py

``` from flask import Flask, render_template, request
from werkzeug.utils import secure_filename
import pandas as pd

app = Flask(__name__)

def work(arquivo):
    df = pd.read_excel(arquivo)
    return(str(df.shape))

@app.route('/')
def start():
   return "acesse /upload"


@app.route('/upload')
def upload_file():
   return render_template('upload.html')

@app.route('/uploader', methods = ['GET', 'POST'])
def upload_file():
   if request.method == 'POST':
       f = request.files['file']
       f.save('./inbox/'+secure_filename(f.filename))
       a = work('./inbox/'+secure_filename(f.filename))
       return 'file uploaded successfully '+a

if __name__ == '__main__':
   app.run(debug = True)
```

And this is the upload.html file that I put on templates folder in production (the app runs on http://www.fabianocastello.com.br/test2/upload):

    <html>
       <body>
          <form action = "http://www.fabianocastello.com.br/test2/uploaded" method = "POST" 
             enctype = "multipart/form-data">
             <p>Arquivo</p>
             <input type = "file" name = "file" accept=".csv, .xlsx" </input>
             <input type = "submit" value="Enviar arquivo"/>
          </form>   
       </body>
    </html>

when locally, the upload.html file that works is this:

    <html>
       <body>
          <form action = "http://localhost:5000/uploader" method = "POST" 
             enctype = "multipart/form-data">
             <p>Arquivo</p>
             <input type = "file" name = "file" accept=".csv, .xlsx" </input>
             <input type = "submit" value="Enviar arquivo"/>
          </form>   
       </body>
    </html>

The error I got after uploading the file is this: Not Found The requested URL was not found on the server. If you entered the URL manually please check your spelling and try again.

My questions are these: 1. Why the production app is not saving the uploaded file in "inbox" folder? 2. Is there a way that I substitute the URL in upload.html file from a variable so to I do not have to manually change the file before upload?

Thank you all in advance.

Upvotes: 0

Views: 974

Answers (1)

roganjosh
roganjosh

Reputation: 13185

This is what the url_for method is for. That will automatically fix "http://localhost:5000/uploader" for you.

However, <form action = "http://www.fabianocastello.com.br/test2/uploaded" ...> points at a bigger misunderstanding. It would be horrendous if you had to alter every route in your templates moving from development to production. Your Flask routes needn't point to the specific domain that you're running your app on; they need only point to the endpoint of the server running your app (which might be gunicorn, for example). The Mega Tuorial might be helpful here for deployment. There's also more info in the deployment docs.

With that out of the way, there's other issues that need to be dealt with:

  1. You have two route functions with the same name - upload_file. Why? It doesn't matter that you decorated them with different URLs, you can't have two functions with the same name in the same namespace.
  2. The second upload_file is set to accept both GET and POST requests, but you only handle the POST case. Sending a GET request to this route will error.

This fixes the form:

<html>
   <body>
      <form action = "{{ url_for('upload_file') }}" method = "POST" 
         enctype = "multipart/form-data">
         <p>Arquivo</p>
         <input type = "file" name = "file" accept=".csv, .xlsx" </input>
         <input type = "submit" value="Enviar arquivo"/>
      </form>
   </body>
</html>

This consolidates the two route functions into one:

@app.route('/uploader', methods = ['GET', 'POST'])
def upload_file():
   if request.method == 'POST':
       f = request.files['file']
       f.save('./inbox/'+secure_filename(f.filename))
       a = work('./inbox/'+secure_filename(f.filename))
       return 'file uploaded successfully '+a
   else:
       return render_template('upload.html')

return 'file uploaded successfully '+a is going to give a garbage result, if any, though. It's not going to render a template with the message, it's just going to be unstyled text. It looks like you want AJAX, which would look something like this:

<html>
   <body>
      <form action = "{{ url_for('upload_file') }}" method = "POST" 
         enctype = "multipart/form-data" id="upload_file_form">
         <p>Arquivo</p>
         <input type = "file" name = "file" accept=".csv, .xlsx" </input>
         <input type = "submit" value="Enviar arquivo"/>
      </form>
      <div id="response_div"></div>
   </body>
   <script>
   $("#upload_file_form").submit(function(e) {
       e.preventDefault();
       var form = $(this);
       var url = form.attr('action');

       $.ajax({
           type: "POST",
           url: url,
           data: form.serialize(),
           context: form,
           success: function(resp) {
               $("#response_div").html(resp);   
           }
       });
   });
</script>
</html>

Upvotes: 1

Related Questions