I am trying to display an image on my flask webpage, but I'm running into some issues. The web page loads but the image gets a 404 error.
Here's a snippet of my code:
main.py
from doctest import debug
import os
from flask import Flask, render_template
app = Flask(__name__, template_folder='templates', static_folder='static')
#define the absolute path of the App file
APP_ROOT = os.path.dirname(os.path.abspath(__file__))
# define the reference path for the images
pictureFolder = os.path.join("static", "images")
# Set the upload folder reference
app.config["UPLOAD_FOLDER"] = os.path.join(APP_ROOT, pictureFolder)
@app.route('/')
def upload_image():
# '''
# Def : Function to Front view of rasp berry images to a Flask web page
# params: None
# return : Rendered image
# '''
# define the image path
front_img = os.path.join(app.config["UPLOAD_FOLDER"], "frontImage.jpeg")
# Check if the image does not exist
if os.path.exists(front_img) is False:
print(f"File: {front_img}\n does not exist")
return render_template("index.html")
# return image
return render_template("index.html", front_img=front_img)
app.run()
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Streamer</title>
</head>
<div>
<center>
<h1> PI Viewer </h1>
</center>
<script>
alert("Page has been loaded successfully")
</script>
</div>
<body>
<div>
<img src= "{{ front_img }}" alt="Raspi-Front-View" width="500" height="400">
</div>
</body>
</html>
