Python Flask 图标未显示

问题描述

在过去的 45 分钟里,我一直在努力弄清楚如何在我的烧瓶页面显示我的网站图标。

这是我当前的代码

from flask import Flask,render_template,send_from_directory,url_for
import os

app = Flask(__name__)

@app.route("/")
def home():
    return render_template("index.html")

@app.route("/store")
def store():
    return render_template("store.html")

@app.route("/games")
def games():
    return render_template("games.html")

@app.route("/americanstudios")
def americanstudios():
    return render_template("as.html")

@app.route("/pear")
def pear():
    return render_template("pear.html")

@app.route("/favicon.ico")
def fav():
    return send_from_directory(os.path.join(app.root_path,'static'),'favicon.ico',minetype='image/vnd.microsof.icon')

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

基本 html 是这样的:

<!DOCTYPE html>
<html>
  <title>{% block title %}{% endblock %}</title>

  <Meta charset="UTF-8">

  <Meta name="viewport" content="width=device-width,initial-scale=1">

  <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">

  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Raleway">

  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-    awesome.min.css">

  <head>
    <link rel="shortcut icon" href="{{ url_for('static',filename='favicon.ico') }}">
  </head>

  <style>
  body,h1,h2,h3,h4,h5,h6 {font-family: "Raleway",Arial,Helvetica,sans-serif}
  </style>

  <body class="w3-light-grey">
    <!-- Navigation Bar -->
    <div class="w3-bar w3-white w3-large">
      <a href="/" class="w3-bar-item w3-button w3-red w3-mobile"></i>newtech</a>
      <a href="store" class="w3-bar-item w3-button w3-mobile">Store</a>
      <a href="games" class="w3-bar-item w3-button w3-mobile">Games</a>
      <a href="americanstudios" class="w3-bar-item w3-button w3-mobile">American Studios</a>
      <a href="pear" class="w3-bar-item w3-button w3-mobile">PEAR Electronics</a>
      <a href="login" class="w3-bar-item w3-button w3-right w3-light-grey w3-mobile">Log In</a>
  </body>

  <div class="w3-main" style="margin-left:250px">
    <div class="w3-row w3-padding-64">
        <div class="w3-twothird w3-container">
          {% block content %}
          {% endblock %}
        </div>
    </div>
  </div>
</html>

这是 index.html

{% extends "base.html" %}
{% block title %}newtech inc.{% endblock %}
{% block content %}
<h1 class="w3-text-teal">Home</h1>
<p>Welcome to newtech inc,where we have the coolest new items for all purposes. Whether it's a new     movie to watch,or a fun game,or maybe something else,we're here for you.</p>
{% endblock %}

base.html 中唯一的一行应该从静态文件夹加载我的收藏夹图标作为页面的收藏夹图标。但出于某种原因,收藏夹图标仍然是索引页和所有其他页面认收藏夹图标。

我的图标是一个 64 X 64 .ico 文件

favicon img

它位于我的静态文件夹中

favicon in folder

是的,静态文件夹与 main.py 位于同一目录中

static folder in main.py directory

但即便如此,网站图标仍然没有出现。

website's favicon

是的,我正在运行正确的 main.py

powershell output

也试过这个

code

但没有运气。有人可以帮我吗?

解决方法

要查找网络错误,您需要查看开发工具的网络选项卡。它表明您对 favicon.ico 的获取因 404 失败。修复了吗?将静态文件夹添加到您的应用程序中(参考代码中的 1),并为 favicon 添加 get 并返回文件 - 参考代码中的 2。

from flask import Flask,render_template,send_from_directory
app = Flask(__name__,static_folder='static') # 1 ( either add here or add through some os join)
import os

@app.route("/")
def home():
    return render_template("index.html")


@app.route("/static/favicon.ico") # 2 add get for favicon
def fav():
    print(os.path.join(app.root_path,'static'))
    return send_from_directory(app.static_folder,'favicon.ico') # for sure return the file

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

文件夹结构如下:
enter image description here

,

您是否已经查看了 Flask 文档?他们推荐的参考与您在那里的参考略有不同:

<link rel="shortcut icon" href="{{ url_for('static',filename='favicon.ico') }}">

https://flask.palletsprojects.com/en/1.1.x/patterns/favicon/?highlight=favicon