Flask 应用程序 - 如何 link 一个 javascript 文件到网站

Question

我在开始使用我的网站（一个 Flask 应用程序）上的 javascript 文件时遇到了一些问题。我通过运行 run.py 启动网站，看起来像这样：

#!flask/bin/python
from app import app
app.run(debug=True)

在我的 html 页面中，我有以下代码会出现 404 错误：

错误信息：

我的文件结构如下所示：

我哪里出错了？

Answer 1

尝试使用 src="app/javascript/jquery.js"。

此外，我注意到您在第 7 行和第 28 行两次包含 jquery.js。

Answer 2

所以你的 index.html 在 app/templates/index.html，你的 jQuery 在 app/javascript/jQuery.js 对吧？

我认为你的路径是错误的。试试这个：

<script src="../javascript/jquery.js"></script>

Answer 3

啊是的，幸运的是我目前正在开发一个烧瓶应用程序。

您目前缺少 static 文件夹，默认情况下 flask 查看该文件夹，文件夹结构如下所示：

|FlaskApp
----|FlaskApp
--------|templates
        - html files are here
--------|static
        - css and javascript files are here

Flask 将查看模板和 static 的两个重要默认文件夹。完成排序后，您可以使用它来 link 从您的 html 页面获取您的 javascript 文件：

<script src="{{url_for('static', filename='somejavascriptfile.js')}}"></script>

希望对任何问题有所帮助。

另外 - 一篇值得阅读但不是超级相关的好文章，但它谈到了 flask 的文件夹结构是这样的：https://www.digitalocean.com/community/tutorials/how-to-deploy-a-flask-application-on-an-ubuntu-vps

Answer 4

这是帮助我消除 Flask 项目的 jquery 部分的原因

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>

这是直接取自 http://getbootstrap.com/getting-started/

中的基本模板

Flask 应用程序 - 如何 link 一个 javascript 文件到网站

Flask Application - How to link a javascript file to website

html

javascript

flask

http-status-code-404