Flask 在 aws elastic beanstalk 上将 css 文件呈现为空

Posted

技术标签:

【中文标题】Flask 在 aws elastic beanstalk 上将 css 文件呈现为空【英文标题】:Flask renders css files as empty on aws elastic beanstalk 【发布时间】:2019-04-30 00:05:27 【问题描述】:

我有一个烧瓶应用程序,当我通过 flask run 在本地运行它时会加载 css,但当我将它上传到 aws elastic beanstalk 时不会。

css-test-app/ 应用程序.py 要求.txt 应用程序/ 初始化.py 路线.py 静止的/ 样式表/ 样式.css 模板/ index.html

我通过设置export FLASK_APP=application.pyflask run 将其部署到我的计算机上,然后在浏览器中转到 127.0.0.1:5000。

为了将它上传到 aws elastic beanstalk,我从 app/、application.py 和 requirements.txt 制作了一个 zip 文件,然后部署它,除了 css 文件之外它可以工作。当我使用开发工具检查页面时,它会在源代码下显示 css 文件在 static/stylesheets/style.css 中的位置,但它是空的。我在 URL MyApp-env.********.us-west-2.elasticbeanstalk.com 或 mydomain.com 上查看该站点

我的 init.py 文件如下所示:

from flask import Flask
application = app = Flask(__name__)
from app import routes

app.static_folder = 'static'

application.py 看起来像这样:

from app import application

我的模板 index.html 文件如下所示:

<html>
    <head>
        <link rel="stylesheet" href=" url_for('static', filename='stylesheets/style.css') " type="text/css" />
        <title> title  - Microblog</title>
    </head>
    <body>
        <h1>Hello,  user.username !</h1>
    </body>
</html>

style.css 文件为:

body 
    color: purple;
    background-color: #d8da3d 

如果我通过 chrome 中的 ctrl - (重新加载此页面图标)刷新页面或执行 ctrl f5,这不会改变任何内容。

如果我使用 ebcli ssh 进入 beanstalk 实例,我会在 /opt/python/current/app/ 下找到应用程序的所有文件,css 文件位于 /opt/python/current/app/app /static/stylesheets/style.css,包含全部内容。

【问题讨论】:

【参考方案1】:

在 AWS 中,您必须将静态文件的路径设置为 app/static

在您的 aws 控制台上,转到配置 > 软件 > 修改

向下滚动到“静态文件”。

您可能会在表格左侧看到 /static/,在右侧的 Directory 下,提及 app/static/

点击保存并重新加载您的应用。

【讨论】:

以上是关于Flask 在 aws elastic beanstalk 上将 css 文件呈现为空的主要内容,如果未能解决你的问题,请参考以下文章

如何使用应用程序工厂将 Flask 应用程序部署到 AWS Elastic beanstalk

Flask 在 aws elastic beanstalk 上将 css 文件呈现为空

AWS Elastic Beanstalk - Flask 应用程序无法导入自定义模块

Flask 应用程序 - 部署到 AWS Elastic Beanstalk 时出错

如何在aws elastic bean上安装redis和celery

运行 Python Flask 应用程序的 Elastic Beanstalk (AWS) 的 HTTPS。无法获取要解析的 URL