Не можете найти изображение из HTML-кода из Flask?

Question

Я создаю интерфейс приложения Flask, мой index.html не может найти изображения и файлы, на которые есть ссылки в коде.

Я пытался перейти в ту же папку, но безуспешно.

Сервер:

from flask import Flask
app = Flask(__name__)

@app.route('/')
def hello():
    return open('html/index.html').read()

if __name__ == '__main__':
    app.run(host='localhost', port=8000, debug=True)

Строки HTML:

<img src="shards-logo-white.svg" alt="Example Navbar 1" class="mr-2" height="30">

<script src="js/shards.min.js"></script>
<script src="js/demo.min.js"></script>

Вывод отладочной информации сервера:

127.0.0.1 - - [30/Jan/2019 12:19:28] "GET / HTTP/1.1" 200 -
127.0.0.1 - - [30/Jan/2019 12:19:29] "GET /shards-logo-white.svg HTTP/1.1" 404 -
127.0.0.1 - - [30/Jan/2019 12:19:29] "GET /html/js/shards.min.js HTTP/1.1" 404 -
127.0.0.1 - - [30/Jan/2019 12:19:29] "GET /html/js/demo.min.js HTTP/1.1" 404 -

• Изображение shards-logo-white.svg isв той же папке.
• Сценарии js находятся в подкаталоге html -> js -> FILES .

Answer 1

Нет, Flask не обслуживает произвольные файлы из файловой системы.Переместите любые статические файлы, подобные этим, в подкаталог static, а затем ссылайтесь на них по этому пути;Вы можете использовать полный путь вложенных каталогов в пределах пути static:

<img src="/static/shards-logo-white.svg" alt="Example Navbar 1" class="mr-2" height="30">

<script src="/static/html/js/shards.min.js"></script>
<script src="/static/html/js/demo.min.js"></script>

Вы могли бы обслуживать ваш HTML , визуализированный из шаблона , после чеговы можете использовать {{ url_for('static', filename="shards-logo-white.svg") }} и {{ url_for('static', filename="html/js/shards.min.js") }} и т. д., чтобы Flask генерировал действительные URL-адреса для этих путей.

См. раздел Статические файлы быстрого запуска ,а также глава Static Files учебного пособия .

Если вы не используете шаблон, то можете также использовать файл html/index.html в качестве статического файла.тоже.В его нынешнем виде вы не отображаете его как шаблон и не вносите никаких других изменений во время выполнения в содержимое файла.

Даже если вам иногда требуется условно передать файл с диска, а не прочитать его все впамяти я бы использовал функцию flask.send_file() , чтобы обеспечить эффективное обслуживание файла и разумный заголовок типа содержимого:

from flask import send_file

@app.route('/')
def hello():
    return send_file('html/index.html')

Относительные пути разрешаются по отношению к Flask.root_path.Возможно, вы также захотите рассмотреть flask.send_from_directory(), который гарантирует, что пользовательский ввод имени файла не может быть использован для обслуживания произвольных файлов за пределами указанного каталога.