gpt4 book ai didi

javascript - 如何将 javascript 或 css 文件加载到 BottlePy 模板中?

转载 作者:太空狗 更新时间:2023-10-29 17:24:54 25 4
gpt4 key购买 nike

我正在尝试使用 BottlePy 返回一个 html 模板。这很好用。但是如果我在我的 tpl 文件中插入这样的 javascript 文件:

<script type="text/javascript" src="js/main.js" charset="utf-8"></script>

我收到 404 错误。(无法加载资源:服务器响应状态为 404(未找到))

有谁知道如何解决这个问题?

这是我的脚本文件:

from bottle import route, run, view

@route('/')
@view('index')
def index():
return dict()
run(host='localhost', port=8080)

这是模板文件,位于“./views”子文件夹中。

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8" />
<script type="text/javascript" src="js/main.js" charset="utf-8"></script>
</head>
<body>
</body>
</html>

也许它是来自开发服务器的“rootPath/js/main.js”,它在其中查找我的 js 文件?

文件的结构是:

app.py
-js
main.js
-views
index.tpl

谢谢。

最佳答案

好吧,首先,您需要您的开发服务器实际服务于 main.js,否则浏览器将无法使用它。

在小型网络应用程序中,习惯将所有 .js.css 文件放在 static 目录下,因此您的布局应该如下所示这个:

  app.py
- static/
main.js
- views/
index.tpl

绝不需要这种确切的命名和布局,只是经常使用。

接下来,您应该为静态文件提供一个处理程序:

from bottle import static_file

# ...

@route('/static/:path#.+#', name='static')
def static(path):
return static_file(path, root='static')

这实际上会将您在 static/ 下的文件提供给浏览器。

现在,到了最后一件事。您将 JavaScript 指定为:

<script type="text/javascript" src="js/main.js" charset="utf-8"></script>

这意味着 .js 的路径与当前页面相对。在您的开发服务器上,索引页面 (/) 将在 /js/main.js 中查找 .js,而另一个页面(比如, /post/12) 将在 /post/12/js/main.js 中查找它,并且肯定会失败。

相反,您需要使用 get_url 函数来正确引用静态文件。您的处理程序应如下所示:

from Bottle import get_url

# ...

@route('/')
@view('index')
def index():
return { 'get_url': get_url }

并且在 index.tpl 中,.js 应该被引用为:

<script type="text/javascript" src="{{ get_url('static', path='main.js') }}" charset="utf-8"></script>

get_url 找到带有 name='static' 的处理程序,并计算到它的正确路径。对于开发服务器,这将始终是 /static/。您甚至可以在模板中对其进行硬编码,但我不推荐这样做,原因有二:

  • 在生产环境中,除了根目录之外,您将无法在任何地方安装您的应用程序;即,当您将其上传到产品服务器时,它可以放在 http://example.com/ 下(root),但不在 http://example.com/myapp/ 下.
  • 如果更改 /static/ 目录位置,则必须在整个模板中搜索它并在每个模板中修改它。

关于javascript - 如何将 javascript 或 css 文件加载到 BottlePy 模板中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6978603/

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