Forums

Show saved image in html page

Hello I am a newbie of the platform especially in web development, I wrote a simple application that simply open an excel file and save and save an histogram in png format:

app = Flask(__name__, static_url_path='/static')
@app.route('/')
def home():
    return render_template("index.html.j2")
@app.route('/', methods=['POST'])
def upload_file():
uploaded_file = request.files['file']
if uploaded_file.filename != '':

    noheader = request.form['no header']
    column = request.form['column']

    if noheader == 'on' and column.isnumeric():
        Data = pd.read_excel(uploaded_file, header=None)
        wb = Fit_Normal_2P(failures=Data.iloc[:, int(column)].to_numpy(), show_probability_plot=False)
        wb.distribution.PDF(label='stat')
        histogram(Data.iloc[:, int(column)].to_numpy())
        plt.savefig('/home/paullake85/mysite/templates/static/images/plot.png')
        return render_template('plot.html', url='/static/images/plot.png')
else:
    return redirect(url_for('home'))

the image is generated correctly and saved in my app space: '/home/****/mysite/templates/static/images/plot.png'

But the html code do not find the image and reply with error 404:

<!DOCTYPE html>
<html>
<head>
    <title>Index</title>
</head>
<body>
    <img src="{{url}}" alt="User Image">
</body>
</html>

Can someone explain me what's wrong with my html image viewer?

Thx

My guess would be that you have not configured Flask to use that directory as your static directory and it's using a different directory to the one you're saving into. You will probably have better luck using the PythonAnywhere staic files system: https://help.pythonanywhere.com/pages/StaticFiles/ and https://help.pythonanywhere.com/pages/DebuggingStaticFiles/