如何将JavaScript或CSS文件加载到BottlePy模板中？

朱天逸

2023-03-14

问题内容：

我试图用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>

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

文件的结构为：

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

谢谢。

问题答案：

好吧，首先，您需要实际使用dev服务器main.js，否则浏览器将无法使用它。

通常将所有文件.js和.css文件static放在小型Web应用程序的目录下，因此布局应如下所示：

  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在/js/main.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/（根），但不低于http://example.com/myapp/。
如果更改/static/目录位置，则必须在整个模板中进行搜索，然后在每个模板中进行修改。

如何将JavaScript或CSS文件加载到BottlePy模板中？

相关阅读

相关文章

相关问答

相关工具

相关文档