1

I am trying to query SQLite and return image paths that meet a certain condition in a flask for loop but I am getting a broken image icon. The image_path is saved into the SQLite table which I thought was a good solution here. The code I am using is below. The first set is where I am having trouble and the second set works when the images are saved to a static directory. Do I need to create a generator for this or I am just blundering somewhere else? This is what the SQLite table looks like,

enter image description here

Edit 1

I think it may help to explain what I want here. I want index.html to show a Recent Ad section which would display recently posted ads, like on Adverts

app.py*

@app.route("/")
def index():

sqliteConnection = sqlite3.connect('finance.db')
cursor = sqliteConnection.cursor()
ads = cursor.execute("SELECT image_path FROM food WHERE active = 'Y'")
ads = cursor.fetchall()
print(ads)

return render_template("index.html", ads=ads)

This is the output for print(ads)

`[('/home/ubuntu/final/freeood/dan.jpg',), ('/home/ubuntu/final/freeood/dan3.jpg',)]'

and this next is the results for the code

for row in ads:
    print(*row, sep='\t')

/home/ubuntu/final/freeood/dan.jpg

/home/ubuntu/final/freeood/dan3.jpg

index.html

{% for ad in ads %}
     <img src={{ad}}>
{% endfor %}

This yields the broken icon image. I have also tried adding `ads.

I am able to display images when jpegs are saved to the static directory with the follow code, but I am having a problem with saving to the static folder so I am trying to figure out a work around just in case.

app.py

ads = os.listdir(os.path.join(app.static_folder, "images"))
return render_template("index.html", ads=ads)

index.html

{% for ad in ads %}
      <img src='/static/images/{{ad}}'/>
{% endfor %}
SozDaneron
  • 165
  • 2
  • 15
  • Does this answer your question: https://stackoverflow.com/questions/26971491/how-do-i-link-to-images-not-in-static-folder-in-flask – jignatius Jun 28 '20 at 14:52
  • Well that answer calls the photos from a directory so I already have that working. What I wanted to know is if I could call them with a SQL query because, I want the picture to be 'active' (meaning the Y from the active column). I assumed that is why I would need a generator for that. – SozDaneron Jun 28 '20 at 19:59
  • You seem to be missing quotes around the image links. Have you tried: `` – jignatius Jun 28 '20 at 20:33
  • That is not it either. I tried the quotes inside and out. I tried the below `for row in ad: print(*row, sep='\t')` which prints. `/home/ubuntu/final/freeood/dan.jpg` `/home/ubuntu/final/freeood/dan3.jpg` `/home/ubuntu/final/freeood/dan.jpg` I believe that is what a generator / `yield` would return so I might try that. – SozDaneron Jun 28 '20 at 21:33

1 Answers1

1

Image files should be in the static folder of your website. This is because all file paths are relative to the root of your website.

There is, however, a work around if you really need to access files outside of your website using send_from_directory.

Add this function to app.py:

from flask import send_from_directory

@app.route('/uploads/<path:img_path>')
def download_file(img_path):
    directory, filename = img_path.rsplit('/', 1)
    return send_from_directory(directory, filename, as_attachment=True)

Then you can invoke this function in your template index.html:

{% for ad in ads %}
  <img src="{{ url_for('download_file', img_path=ad) }}"/>
{% endfor %}
jignatius
  • 6,304
  • 2
  • 15
  • 30
  • Sorry this just is not what I am looking for. It's a neat solution but when accessing `index.html` path, I want there to be a Recent Ads section that shows images of recently posted ads. That is why I want to query the `active` column in the SQLite table and why I have saved the path of the image to the SQLite table. – SozDaneron Jun 29 '20 at 17:27
  • @SozDaneron *"I want there to be a Recent Ads section that shows images of recently posted ads"* You didn't state that in the original question. You're database query is getting only ads that are active. I guess you want ads that are inactive too? Then you could pass in another list into your template. – jignatius Jun 29 '20 at 17:40
  • No, just the active images. I've made some edits to the original question. – SozDaneron Jun 29 '20 at 17:59
  • I am coming back to accept this answer because after a few iterations, I am keeping the images in the `static` folder. What I did was change the name of the jpg when saving. I am able to query SQLite and then call any images this way. I was not able to serve the image from SQLite even with the path saved though. The `send_from_directory` also worked but `static` folder is the way to go. – SozDaneron Jul 22 '20 at 20:02
  • @SozDaneron Sounds like a good solution. Sometimes these things only come after a few iterations! – jignatius Jul 22 '20 at 21:46