Flask: невозможно отобразить загруженное изображение - PullRequest
Новая
       18

Flask: невозможно отобразить загруженное изображение

0 голосов
/ 14 апреля 2020

Я работаю над небольшой страницей блога, используя Flask. Я настроил страницу администратора, где я могу создавать статьи (используя wtforms), которые я хочу отображать на главной странице (front end). Все поля моей формы в Форме создания статьи (на моей странице администратора) сохраняют свои входные данные (заголовок, изображение, PreviewText, контент, категория). Когда я нажимаю на статью, она успешно помещается в базу данных sqlite, и все, кроме загруженного изображения, отображается на главной странице. В моей CreateArticleForm я использую e nctype = "multipart / form-data"

Вот мой route.py. Как вы можете видеть, я установил функцию сохранения изображения над маршрутом (чтобы сохранить загруженное изображение в мою папку static / images / article_imgs и включить его в маршрут. После загрузки изображения и проверки папки я можно увидеть, что изображение было добавлено в эту папку. 

def save_article_image(form_picture):
    random_hex = secrets.token_hex(8)
    _, f_ext = os.path.splitext(form_picture.filename)
    picture_fn = random_hex + f_ext
    picture_path = os.path.join(app.root_path, 'static/images/article_imgs', picture_fn)
    form_picture.save(picture_path)
    return picture_fn



######################admin-Routes
# create article
@app.route('/createarticle', methods=['GET', 'POST'])
@login_required
def create_article():
    form = CreateArticleForm()
    if form.validate_on_submit():
        if form.picture.data:
            picture_file = save_article_image(form.picture.data)
            article_image=picture_file
        article = Article(title=form.title.data, article_image=picture_file,
                        article_preview=form.preview.data, article_content=form.content.data, 
                        category=form.category.data, author=current_user)
        db.session.add(article)
        db.session.commit()
        flash('Article was posted.', 'success')
    return render_template('admin/createarticle.html', form=form)

Вот мой домашний маршрут, где отображается созданная мной статья: 

@app.route('/')
def home():
    article = Article.query.all()
    return render_template('home.html', article=article)

Наконец, мой дом. html, где данные помещаются в html. Здесь вы можете увидеть тег img, где я пытаюсь получить загруженное изображение для отображения. 

{% for article in article %}
<div class="col-xs1-12 col-sm-6 col-md-4">
    <div class="card mt-3">
        <img class="card-img-top" src="{{ url_for('static', filename='article.article_image') }}"
            alt=" Card image cap">
        <div class="card-body">
            <h6 class="card-category">{{ article.category }}</h6>
            <h5 class=" card-title">{{ article.title }}</h5>
            <p class="card-text">{{ article.article_preview }}</p>
            <p class="text-right">{{ article.date_posted.strftime('%d.%m.%Y') }}</p>
            <a href="#" class="btn read-more">Read More</a>
        </div>
    </div>
</div>
{% endfor %}

Все, что я получаю, это сообщение об ошибке в консоли : Не удалось загрузить ресурс: сервер ответил с состоянием 404 (НЕ НАЙДЕНО) . Снова я вижу статью с заголовком, предварительный текст и т. Д. c., Но article_image.

Ответы [ 2 ]

0 голосов
/ 14 апреля 2020

Я просто изменил sr c тега img на filename = form.picture.data, так как мне нужны данные, которые я помещаю в форму. Таким образом, я получаю сообщение об ошибке jinja:

jinja2.exceptions.UndefinedError: 'form' не определено, и оно указывает мне на мой домашний маршрут, говорящий: 

return render_template('home.html', article=article)

и мой дом. html говорю 

<img class="card-img-top" src="{{ url_for('static', filename=form.picture.data) }}" alt=" Card image cap">



{% for article in article %}
<div class="col-xs1-12 col-sm-6 col-md-4">
    <div class="card mt-3">
        <img class="card-img-top" src="{{ url_for('static', filename=form.picture.data) }}" alt=" Card image cap">
        <div class="card-body">
            <h6 class="card-category">{{ article.category }}</h6>
            <h5 class=" card-title">{{ article.title }}</h5>
            <p class="card-text">{{ article.article_preview }}</p>
            <p class="text-right">{{ article.date_posted.strftime('%d.%m.%Y') }}</p>
            <a href="#" class="btn read-more">Read More</a>
        </div>
    </div>
</div>
{% endfor %}

Я так понимаю, что мой домашний маршрут не знает данных об изображении, поэтому я пытаюсь определить аргумент в своем домашнем маршруте с именем файла = picture_file, а затем ошибка говорит 

NameError
NameError: name 'picture_file' is not defined

@app.route('/')
def home():
    article = Article.query.all()
    return render_template('home.html', article=article, filename=picture_file)
0 голосов
/ 14 апреля 2020

Это говорит о строке 59, которая является тегом img, где я хочу отобразить изображение. Filename = to picture_file Я сохранил изображение. 

{% for article in article %}
<div class="col-xs1-12 col-sm-6 col-md-4">
    <div class="card mt-3">
        <img class="card-img-top" src="{{ url_for('static', filename=picture_file) }}" alt=" Card image cap">
        <div class="card-body">
            <h6 class="card-category">{{ article.category }}</h6>
            <h5 class=" card-title">{{ article.title }}</h5>
            <p class="card-text">{{ article.article_preview }}</p>
            <p class="text-right">{{ article.date_posted.strftime('%d.%m.%Y') }}</p>
            <a href="#" class="btn read-more">Read More</a>
        </div>
    </div>
</div>
{% endfor %}
...