Изображения не отображаются правильно в приложении flask

Question

Я пытаюсь добавить поддержку аватаров в мое приложение flask, но я столкнулся с интересной ошибкой: я использую одни и те же суб-шаблоны для _post и _comment на своих домашних и пользовательских страницах со ссылками на изображения в папка static / uploads, но эти изображения отображаются только внутри моего домашнего шаблона:

суб-шаблон _post. html

<table class="table table-bordered">
    <tr style="border: solid; border-color: #1B1C1C; border-width: 2px;">
        <td width="70x" style="background-color: #DEE1E1; border-right: 1px solid grey;">
            <a href="{{ url_for('user', username=post.author.username) }}">
                <img height="150px" width="150px" src='static/uploads/{{post.author.username}}.jpg'>
            </a>
            <!-- <img style="border-style: solid; border-radius: 10%; border-color: black; border-width: 1px; background-color: white;" src="{{ avatars.robohash(post.author.username, size='80') }}" /> -->
        </td>
        <td>
            <p><a href="{{ url_for('user', username=post.author.username) }}">
                {{ post.author.username }}
            </a>said: </p> <p style="margin-left: 90%; margin-top: -2%;">..at {{post.timestamp.replace(microsecond=0)}}</p>
            <p style="width: 60%;" id="post{{ post.id }}">{{ post.body }}</p>
            <div class="button" style="margin-left: 95%; margin-top: -2%;">
            {% if current_user.liked_post(post) %}
                <a href="{{ url_for('like_action', post_id=post.id, action='dislike') }}">&#128078</a>
            {% else %}
                <a href="{{ url_for('like_action', post_id=post.id, action='like') }}">&#128077</a>
            {% endif %}
            </div>
            <p style="width: 11%;">{{ post.likes.count() }}&#128077</p>
        </td>
    </tr>
</table>
{% for comment in comments %}
    {% if comment in post.comments %}
        {% include "_comment.html" %}
    {% endif %}
{% endfor %}
<p style="margin-bottom: 4%; margin-top: 1%;"><a style="border: solid; border-radius: 4%; border-color: black; border-width: 1px;
 padding: 10px; margin-left: 10px; margin-top: 10%;" href="/comment/{{post.id}}"> Post Comment ▲</a></p>

суб-шаблон _comment. html

<table class="table table-bordered" style="border-left: 7px solid; border-color: #30F153">
    <tr style="border: solid; border-color: grey; border-width: 2px;">
        <td width="70x" style="background-color: #E8E8E8; border-right: 1px solid grey;">
            <a href="{{ url_for('user', username=comment.commenter.username) }}">
                <img height="100px" width="100px" src='static/uploads/{{comment.commenter.username}}.jpg'>
            </a>
            <!-- <img style="border-style: solid; border-radius: 10%; border-color: black; border-width: 1px; background-color: white;" src="{{ avatars.robohash(comment.commenter.username, size='40') }}" /> -->
        </td>
        <td>
            <p><a href="{{ url_for('user', username=comment.commenter.username) }}">
                {{ comment.commenter.username }}
            </a>commented: </p> <p style="margin-left: 90%; margin-top: -2%;">..at {{comment.timestamp.replace(microsecond=0)}}</p>
            <p style="width: 60%;">{{ comment.body }}</p>
            <div class="button" style="margin-left: 95%; margin-top: -2%; margin-bottom: -10%;">
            {% if current_user.liked_comment(comment) %}
                <a href="{{ url_for('comment_like_action', comment_id=comment.id, action='dislike') }}">&#128078</a>
            {% else %}
                <a href="{{ url_for('comment_like_action', comment_id=comment.id, action='like') }}">&#128077</a>
            {% endif %}
            </div>
            <p style="width: 11%;">{{ comment.comment_likes.count() }}&#128077</p>
        </td>
    </tr>
</table>

шаблон пользователя. html

{% extends "base.html" %}
{% block app_content %}
    <table style="margin-top: 1%; ">
        <tr valign="top" style="width: 100%;">
            <td>
                <img height="400px" width="400px" src="/static/uploads/{{user.username}}.jpg">
            </td>
            <td>
                <h3 style="margin-left: 1%;">{{ user.username }}</h3>
                {% if user.about_me %}<p style="margin-left: 2%; width: 470%;">About me: {{ user.about_me }}</p>{% endif %}
                <p style="margin-left: 2%;">Followers: {{ user.followers.count() }} Following: {{ user.followed.count() }}</p>
                {% if user == current_user %}
                <p style="margin-left: 2%;"></p>
                {% elif not current_user.is_following(user) %}
                <p style="margin-left: 2%;"><a href="{{ url_for('follow', username=user.username) }}">Follow</a></p>
                {% else %}
                <p style="margin-left: 2%;"><a href="{{ url_for('unfollow', username=user.username) }}">Unfollow</a></p>
                {% endif %}
            </td>
        </tr>
    </table>

<div style="margin-top: 1%;">
    {% for post in posts %}
        {% include "_post.html" %}
    {% endfor %}
</div>
{% endblock %}

шаблон дома. html

{% extends "base.html" %}
{% import "bootstrap/wtf.html" as wtf %}
{% block app_content %}
    <h2>Hi, {{current_user.username}}</h2>
    {% if form %}
    {{ wtf.quick_form(form, button_map={'submit':'btn btn-outline-dark'}) }}
    <br>
    {% endif %}
    {% for post in posts %}
        {% include "_post.html" %}
    {% endfor %}
{% endblock %}

функции моего просмотра:

# user page
@login_required
@app.route('/user/<username>')
def user(username):
    if current_user.is_authenticated:
        user = User.query.filter_by(username=username).first_or_404()
        posts = user.posts.order_by(Post.timestamp.desc())
        comments = Comment.query.all()
        return render_template('user.html', title='User Page', user=user, username=current_user.username,
                               posts=posts, comments=comments)
    return redirect(url_for('login'))

# home page
@login_required
@app.route('/', methods=['POST', 'GET'])
@app.route('/home', methods=['POST', 'GET'])
def home():
    if current_user.is_authenticated:
        form = PostForm()
        if form.validate_on_submit():
            post = Post(body=form.post.data, author=current_user)
            db.session.add(post)
            db.session.commit()
            flash('Your post has been posted!')
            return redirect(url_for('home'))
        posts = Post.query.order_by(Post.timestamp.desc()).all()
        comments = Comment.query.all()
        return render_template('home.html', title='Home', form=form, username=current_user.username,
                               posts=posts, comments=comments)
    return redirect(url_for('login'))

теперь для некоторых причина, когда я смотрю на ссылку на аватар для поста с домашней страницы, путь выглядит так: http://127.0.0.1:5000/static/uploads/image.jpg, а когда я смотрю на изображение с моей страницы пользователя, оно выглядит так: http://127.0.0.1:5000/user/static/uploads/SLDem.jpg Я предполагаю, что оно что-то делать с моей функцией маршрута, имеющей несколько разделов, но сам аватар на странице пользователя отображается правильно ..

Answer 1

Вы забыли '/' в _post. html и _comment. html в img sr c. (?)

частичные (запись, комментарий)

<img height="150px" width="150px" src='static/uploads/{{post.author.username}}.jpg'>

пользователь. html

<img height="400px" width="400px" src="/static/uploads/{{user.username}}.jpg">

url_for также можно использовать для файлов * stati c: {{ url_for('static', filename='css.css') }}

Ссылка на файлы Flask stati c с url_for