Issue to upload a file into folder flask app after deployment - python

I am using Flask to upload image file into folder. Using this code in app.py
APP.py
import os
from flask import Flask, render_template, request
app = Flask(__name__)
UPLOAD_FOLDER = os.path.basename('/Desktop/hello_flask/uploads')
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
#app.route('/')
def hello_world():
return render_template('index.html')
#app.route('/upload', methods=['POST'])
def upload_file():
file = request.files['image']
f = os.path.join(app.config['UPLOAD_FOLDER'], file.filename)
file.save(f)
return render_template('index.html')
I created uploads folder within the project folder.
I tried removing os.path.basename and tried, even it is not working. Tried changing the directory address also. Everything is working fine in local IDE as visual studio, but is not working after deploying in AWS.

Related

Heroku deployment of React Flask app within the same repo

I was deploying my flask react application to Heroku. It's all located in the same folder. My app.py code is here
import time
from flask import Flask, send_from_directory
from flask_cors import CORS
app = Flask(__name__, static_folder='build/', template_folder="build", static_url_path='/')
CORS(app)
#app.route('/', defaults={'path': ''})
#app.route('/<path:path>')
def serve(path):
if path != "" and os.path.exists(app.static_folder + '/' + path):
return send_from_directory(app.static_folder, path)
else:
return send_from_directory(app.static_folder, 'index.html')
if __name__ == "__main__":
app.run()
Here's an image of my folder structure:
I deployed it on Heroku but I find 404 error. The code seems to work fine on localhost though, and I have tried everything I could do. My other APIs which send data seem to work fine. It's just the issue with this one.

How to run Flask app by flask run with blueprint template

In a Python authorization app, in my main py I have the following code:
# main.py
from flask import Blueprint, render_template
from flask_login import login_required, current_user
theapp = Blueprint('main', __name__)
#theapp.route('/')
def index():
return render_template('index.html')
When I try:
FLASK_APP=main.py
FLASK_DEBUG=1
flask run
I get the following error:
Error: Could not locate a Flask application. You did not provide the "FLASK_APP" environment variable, and a "wsgi.py" or "app.py" module was not found in the current directory.
Basically a Blueprint is a way for you to organize your flask application into smaller and reusable applications. I am not sure why you have used it here in the main.py.
You could do that some other file, for example, you have a set of endpoints to implement login functionality in a separate file then what you should be doing is:
Assume you have a login.py .Sample Code looks like follows:
from flask import Blueprint
bp = Blueprint('login_bp', __name__)
def login_bp():
return bp
And the following code goes into you main.py , you need to start the Flask Server using .run()
from flask import Flask
from flask import Blueprint, render_template
from login import login_bp #Assume you have a module login and I am importing login_bp from login.py
theapp = Flask(__name__) #Creating Flask instance
theapp.register_blueprint(login_bp()) # Registering Blueprint here
#theapp.route('/')
def index():
return render_template('index.html')
theapp.run(host="0.0.0.0", port=2019, debug=True) #Starting the Flask Server
Hope this works, please do look out for documents and code example to get deeper insights.

How to link flask with react application ? [duplicate]

I have a Flask back-end with API routes which are accessed by a React single page application created using create-react-app. When using the create-react-app dev server, my Flask back end works.
I would like to serve the built (using npm run build) static React app from my Flask server. Building the React app leads to the following directory structure:
- build
- static
- css
- style.[crypto].css
- style.[crypto].css.map
- js
- main.[crypto].js
- main.[crypto].js.map
- index.html
- service-worker.js
- [more meta files]
By [crypto], I mean the randomly generated strings generated at build time.
Having received the index.html file, the browser then makes the following requests:
- GET /static/css/main.[crypto].css
- GET /static/css/main.[crypto].css
- GET /service-worker.js
How should I serve these files? I came up with this:
from flask import Blueprint, send_from_directory
static = Blueprint('static', __name__)
#static.route('/')
def serve_static_index():
return send_from_directory('../client/build/', 'index.html')
#static.route('/static/<path:path>') # serve whatever the client requested in the static folder
def serve_static(path):
return send_from_directory('../client/build/static/', path)
#static.route('/service-worker.js')
def serve_worker():
return send_from_directory('../client/build/', 'service-worker.js')
This way, the static assets are successfully served.
On the other hand, I could incorporate this with the built-in Flask static utilities. But I do not understand how to configure this.
Is my solution robust enough? Is there a way to use built-in Flask features to serve these assets? Is there a better way to use create-react-app?
import os
from flask import Flask, send_from_directory
app = Flask(__name__, static_folder='react_app/build')
# Serve React App
#app.route('/', defaults={'path': ''})
#app.route('/<path:path>')
def serve(path):
if path != "" and os.path.exists(app.static_folder + '/' + path):
return send_from_directory(app.static_folder, path)
else:
return send_from_directory(app.static_folder, 'index.html')
if __name__ == '__main__':
app.run(use_reloader=True, port=5000, threaded=True)
Thats what I ended up with. So bascially catch all routes, test if the path is a file => send file => else send the index.html. That way you can reload the react app from any route you wish and it does not break.
First do npm run build to build the static production files as mentioned by you above
from flask import Flask, render_template
app = Flask(__name__, static_folder="build/static", template_folder="build")
#app.route("/")
def hello():
return render_template('index.html')
print('Starting Flask!')
app.debug=True
app.run(host='0.0.0.0')
Unfortunately, I don't think you can get it work with the development hot-reload.
A working solution here.
Ever thought why we need two separate folders for static and templates. To segregate the mess, right?
But, it's a problem with the production build since it has one folder for both static and templates type of files and all dependencies are linked like that.
The build folder will be served if you consider it both static and templates.
Use something like this
from flask import Flask, render_template
app = Flask(__name__, static_url_path='',
static_folder='build',
template_folder='build')
#app.route("/")
def hello():
return render_template("index.html")
Your flask app will run fine.
The accepted answer does not work for me. I have used
import os
from flask import Flask, send_from_directory, jsonify, render_template, request
from server.landing import landing as landing_bp
from server.api import api as api_bp
app = Flask(__name__, static_folder="../client/build")
app.register_blueprint(landing_bp, url_prefix="/landing")
app.register_blueprint(api_bp, url_prefix="/api/v1")
#app.route("/")
def serve():
"""serves React App"""
return send_from_directory(app.static_folder, "index.html")
#app.route("/<path:path>")
def static_proxy(path):
"""static folder serve"""
file_name = path.split("/")[-1]
dir_name = os.path.join(app.static_folder, "/".join(path.split("/")[:-1]))
return send_from_directory(dir_name, file_name)
#app.errorhandler(404)
def handle_404(e):
if request.path.startswith("/api/"):
return jsonify(message="Resource not found"), 404
return send_from_directory(app.static_folder, "index.html")
#app.errorhandler(405)
def handle_405(e):
if request.path.startswith("/api/"):
return jsonify(message="Mehtod not allowed"), 405
return e
I used a flask server with only one route / which read the index.html file from the build folder of Create react app(CRA)
from flask import Flask
app = Flask(__name__)
app.static_folder = '../build'
#app.route('/')
def index():
fref = open(r'../build/index.html')
html_text = fref.read()
fref.close()
return html_text
app.run()
Setting up this way I faced an error, the static files are not properly served due to path mismatch, so the solution I used is
Add a homepage property in package.json of CRA and set it to "/static"
{
"name":"App-name",
"version":"",
"dependencies":{}
"homepage":"/static",....[other keys]}
Add **homepage** key parallel to the **dependencies** key in the package.json file
This homepage property will be used during the build process of CRA and used in the place of %PUBLIC_URL% of index.html and gets appended to other static assets URL path (you can verify by viewing the index.html code after the build process)
After the build process, run the flask server,we can see the GET request coming with / for the first time and index.html will be served and followed by requests /static/static/js/[[filename]] for other static assets from HTML file and everything works correctly

flask html js css img reference 404 error

I have a large website with hundreds of href=".html, href="css/, href="img/ and src="js/ references throughout the various html pages. I've placed all the css, js, img, sound, etc... folders in the "static" folder and all the html files in the "template folder".
I do not want to go through all my html files and manually edit each href using Flask's "url_for" function.
Is there a way that I can leave my existing html files alone and tell flask to use the css/, js/, and image paths defined in these html files?
Right now the following code leads to a bunch of 404 errors
import os
from flask import Flask, render_template
PROJECT_PATH = os.path.dirname(os.path.realpath(__file__))
app = Flask(__name__,
template_folder=os.path.join(PROJECT_PATH, 'templates'),
static_folder=os.path.join(PROJECT_PATH, 'static')
)
#app.route('/')
def index():
return render_template('index.html')
if __name__ == '__main__':
app.run(host='0.0.0.0', port=8080, debug=True)
Okay, based on Martijn's script, I got my site running using the following code. However, to catch my many href=someHTMLfile.html links in my index.html file, I added #app.route('/'). I'm wondering if there is a better way to do this?
from flask import Flask, render_template, safe_join, send_from_directory
app = Flask(__name__)
#app.route('/<any(css, js, img, fonts, sound):folder>/<path:filename>')
def toplevel_static(folder, filename):
filename = safe_join(folder, filename)
cache_timeout = app.get_send_file_max_age(filename)
return send_from_directory(app.static_folder, filename, cache_timeout=cache_timeout)
#app.route('/<path:filename>')
def public(filename):
return render_template(filename)
# #app.route('/')
# def index():
# return render_template('index.html')
if __name__ == '__main__':
app.run(host='0.0.0.0', port=8080, debug=True)
You can register additional routes to serve files from your static folder:
from flask import app, safe_join, send_from_directory
#app.route('/<any(css, img, js, sound):folder>/<path:filename>')
def toplevel_static(folder, filename):
filename = safe_join(folder, filename)
cache_timeout = app.get_send_file_max_age(filename)
return send_from_directory(app.static_folder, filename,
cache_timeout=cache_timeout)
#app.route('/<path:htmlfile>.html')
def toplevel_static(htmlfile):
filename = htmlfile + '.html'
cache_timeout = app.get_send_file_max_age(filename)
return send_from_directory(app.template_folder, filename,
cache_timeout=cache_timeout)
This replicates what the static view does, but for routes starting with /css/, /img/, /js/ or /sound/ instead. HTML files are loaded from your template folder instead.

Flask: why having path converter in root route doesn't work?

from flask import Flask, render_template
app = Flask(__name__, static_url_path='')
#app.route('/')
def index():
return render_template('index.html')
#app.route('/page/<path:page>')
def article(page):
return render_template('page.html')
if __name__ == "__main__":
app.run()
Work just fine. But if i change the second route to #app.route('/<path:page>'), then any access to URL like /path/to/page yields 404.
Why doesn't #app.route('/<path:page>') work?
Related questions, that don't answer the question however:
Flask: Handle catch all url different if path is directory or file
Custom routing in Flask app
Capture arbitrary path in Flask route
static_url_path conflicts with routing. Flask thinks that path after / is reserved for static files, therefore path converter didn't work. See: URL routing conflicts for static files in Flask dev server
works flawless for me:
from flask import Flask, render_template
app = Flask(__name__)
#app.route('/')
def index():
return render_template('index.html')
#app.route('/page/<path:page>')
def article(page):
return render_template('page.html')
if __name__ == "__main__":
app.debug = True
app.run()
I can access: http://localhost/ -> index and http://localhost/page/<any index/path e.g.: 1> -> article

Categories

Resources