Python Flask运行HTML时本地图片无法加载，本地打开正常的问题求助

核心原因 #

本地双击HTML时，浏览器直接从本地文件系统读取图片，绝对路径能生效；但Flask通过HTTP服务运行时，受服务器路径映射规则和浏览器安全限制，本地绝对路径无法被服务端解析。下面是两种可靠的解决方法：

方法一：遵循Flask静态文件约定（推荐）

Flask默认约定静态资源（图片、CSS、JS等）放在项目根目录的static文件夹下，按以下步骤调整：

1. 调整文件夹结构：

Codes
  |-- basic.py
  |-- static
      |-- Images
          |-- Logo.jpg
  |-- Templates
      |-- basic.html

2. 修改basic.html中的img标签，使用Flask内置的url_for函数生成可靠的资源路径：

<img src="{{ url_for('static', filename='Images/Logo.jpg') }}" alt="Logo">

方法二：手动指定静态文件路径（无需修改文件夹结构）

如果不想调整现有文件夹结构，可在初始化Flask应用时，指定静态资源目录：

1. 修改basic.py代码：

from flask import Flask, render_template

# 指定Images文件夹为静态资源目录
app = Flask(__name__, static_folder='Images')

@app.route('/')
def index():
    return render_template('basic.html')

if __name__ == '__main__':
    app.run(debug=True)

2. 对应修改basic.html的img标签：

<img src="{{ url_for('static', filename='Logo.jpg') }}" alt="Logo">

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