Flask项目中图片已保存但页面无法显示问题求助

你猜的没错，核心问题就是图片URL没保存到page对象的image_url属性，另外还有个隐藏问题：你把图片存在了CONTENT_DIR，但这个目录大概率不是Flask的静态资源目录，就算存了URL前端也访问不到。下面是具体修复步骤：

1. 调整图片保存目录到静态资源文件夹 #

Flask只有放在static目录下的文件才能通过URL直接访问，先在项目根目录创建static/uploads文件夹（专门存上传的图片）。

2. 修改路由代码，保存图片URL到page对象 #

更新你的edit路由，补充生成静态URL并绑定到page对象的逻辑：

@bp.route('/edit/<path:url>/', methods=['GET', 'POST'])
@protect
def edit(url):
    page = current_wiki.get(url)
    form = EditorForm(obj=page)
    if form.validate_on_submit():
        if not page:
            page = current_wiki.get_bare(url)
        form.populate_obj(page)

        if 'file' in request.files:
            file = request.files['file']
            if file.filename != '':
                filename = secure_filename(file.filename)
                # 切换到静态uploads目录保存图片
                upload_dir = os.path.join(current_app.root_path, 'static', 'uploads')
                # 自动创建目录，避免不存在时报错
                os.makedirs(upload_dir, exist_ok=True)
                file.save(os.path.join(upload_dir, filename))
                # 生成Flask可识别的静态资源URL，赋值给page的image_url属性
                page.image_url = url_for('static', filename=f'uploads/{filename}')

        page.save()
        flash('"%s" was saved.' % page.title, 'success')
        return redirect(url_for('wiki.display', url=url))
    return render_template('editor.html', form=form, page=page)

3. 确认Page模型存在image_url字段 #

确保你的页面模型（比如Wiki的Page类）有image_url这个属性/字段，不然赋值后无法持久化保存。如果是SQLAlchemy模型，示例定义如下：

class Page(db.Model):
    # 其他已有字段...
    image_url = db.Column(db.String(255))

4. 模板代码无需改动 #

你的模板已经通过{% if page.image_url %}判断并渲染图片标签，路由修复后就能正常生成图片URL并显示了。

内容的提问来源于stack exchange，提问作者Alex Jones