gpt4 book ai didi

angular - 使用 Flask 为 Angular 前端提供服务不会渲染图像

转载 作者:行者123 更新时间:2023-12-02 03:57:03 26 4
gpt4 key购买 nike

我创建了一个 Angular 网站,该网站向我使用 Flask 开发的后端发出请求。我的第一个任务是使用 Flask 为网站提供服务。

按照这个答案 here ,我设法在 Flask 服务器上提供我的网站。

唯一的问题是我在网站中使用的图像没有出现。在使用 Flask 提供网站之前,一切正常。但我不会收到这样的错误:

GET http://localhost:5000/assets/img/green_circle.png 404 (NOT FOUND)

我想显示的所有图像都会发生这种情况。我的文件夹结构是这样的:

mainFolder
|-static
| |- contains all js and css files
| |- assets (CONTAINS IMAGES)
|-templates
| |-index.html
|-server.py

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

<!doctype html>
<html>
<head>
<base href="./">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="CoreUI - Free Angular Admin Template">
<meta name="author" content="Łukasz Holeczek">
<meta name="keyword" content="Bootstrap,Admin,Template,Free,Angular,Dashboard,Typescript">
<link rel="icon" href="assets/favicon.ico">
<title>WINGS Smart Parking System</title>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-118965717-3"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
// Shared ID
gtag('config', 'UA-118965717-3');
// Angular ID
gtag('config', 'UA-118965717-4');
</script>
</head>
<body class="app">
<!-- App Loading... -->
<script src="/static/runtime.js"></script>
<script src="/static/polyfills-es5.js" nomodule></script>
<script src="/static/polyfills.js"></script>
<script src="/static/styles.js"></script>
<script src="/static/scripts.js"></script>
<script src="/static/vendor.js"></script>
<script src="/static/main.js"></script>
<script src="/static/views-dashboard-dashboard-module.js"></script>
<script src="/static/views-buttons-buttons-module.js"></script>
<script src="/static/views-chartjs-chartjs-module.js "></script>


</body>
</html>

你有什么想法吗?提前致谢!

最佳答案

server.py 中,添加 static_proxy 以确保提供支持文件。

from flask import Flask, send_from_directory

app = Flask(__name__)


@app.route('/<path:path>', methods=['GET'])
def static_proxy(path):
return send_from_directory('./', path)


@app.route('/')
def root():
return send_from_directory('./', 'index.html')


if __name__ == '__main__':
# This is used when running locally only. When deploying use a webserver process
# such as Gunicorn to serve the app.
app.run(host='127.0.0.1', port=8080, debug=True)


@app.errorhandler(500)
def server_error(e):
return 'An internal error occurred [main.py] %s' % e, 500

其他资源

Python (Flask) serving Angular project's index.html file

提问者的补充说明

为了能够从为 Angular 前端提供服务的 Flask 服务器向自身发出请求,在 app.run() 中,您还必须设置 threaded=True.

关于angular - 使用 Flask 为 Angular 前端提供服务不会渲染图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58101303/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com