js 脚本未加载到 jinja2 模板中

Question

我有一种情况，用 jinja2 变量 {{creditNumbers|safe}} 替换 url 字符串 "/CreditHistory/10216"，导致 javascript 文件的加载混乱。更具体地说，这有效；

{% block Scripter %}

<script type="text/javascript" src="./static/assets/js/crossfilter/crossfilter.js"></script>
<script type="text/javascript" src="./static/assets/js/d3/d3.js" charset="utf-8"></script>
<script type="text/javascript" src="./static/assets/js/dc.js/dc.js"></script>
<script type="text/javascript" src="./static/assets/js/queue/queue.js"></script>
<script src='./static/assets/js/graphsFordringer.js' type='text/javascript' charset="utf-8"></script>
<script type="text/javascript"> 

queue().defer(d3.json, "/CreditHistory/10216").await(makeGraphs);

</script>

{% endblock %}

但是，这不是；

{% block Scripter %}

<script type="text/javascript" src="./static/assets/js/crossfilter/crossfilter.js"></script>
<script type="text/javascript" src="./static/assets/js/d3/d3.js" charset="utf-8"></script>
<script type="text/javascript" src="./static/assets/js/dc.js/dc.js"></script>
<script type="text/javascript" src="./static/assets/js/queue/queue.js"></script>
<script src='./static/assets/js/graphsFordringer.js' type='text/javascript' charset="utf-8"></script>
<script type="text/javascript"> 

queue().defer(d3.json, "{{creditNumbers|safe}}").await(makeGraphs);

</script>

{% endblock %}

Web 浏览器中抛出的错误意味着已加载 javascript 个文件中的 none 个。例如，其中之一是队列不是定义的函数。同样明显的是 "{{creditNumbers|safe}}" 变量确实加载到 "/CreditHistory/10216"。所以，简而言之，变量加载似乎打破了 javascript 加载。并不是说我在文档中找到了对类似问题的引用，所以这可能不是正在发生的事情。

编辑：

现在看来，我是误会了整个情况。看起来根本原因是在 app.py 文件中声明 jinja2 模板变量的方式。

失败的@app.route代码是；

@app.route('/KundeFordringer/<int:KundeNr>')
def fordringer(KundeNr):

    jsonSti = "/CreditHistory/"+str(KundeNr)
    return render_template("fordringer.html", creditNumbers=jsonSti)

但是，如果我将代码更改为以下内容，它就可以正常工作；

@app.route('/KundeFordringer')
def fordringer():

    return render_template("fordringer.html", creditNumbers="/CreditHistory/10216")

如前所述，从网络浏览器查看源代码，可以看到在使用第一个 @app.route 声明时加载了 "/CreditHistory/10216"。但显然，这样做的方式总是有问题的。

如有任何帮助，我们将不胜感激

Answer 1

javascript 文件的加载是相对于当前 url 的。基本上如果你正在浏览

http://mywebsite.com/KundeFordringer/456

然后浏览器将尝试加载这些文件：

http://mywebsite.com/KundeFordringer/456/static/assets/js/crossfilter/crossfilter.js
http://mywebsite.com/KundeFordringer/456/static/assets/js/d3/d3.js
http://mywebsite.com/KundeFordringer/456/static/assets/js/dc.js/dc.js
http://mywebsite.com/KundeFordringer/456/static/assets/js/queue/queue.js

你想要的大概是

http://mywebsite.com/static/assets/js/crossfilter/crossfilter.js
http://mywebsite.com/static/assets/js/d3/d3.js
http://mywebsite.com/static/assets/js/dc.js/dc.js
http://mywebsite.com/static/assets/js/queue/queue.js

它们可能与您的脚本标签有关：

<script type="text/javascript" src="./static/assets/js/dc.js/dc.js"></script>

需要重命名

<script type="text/javascript" src="/static/assets/js/dc.js/dc.js"></script>

或者你的static_url_path有问题。

js 脚本未加载到 jinja2 模板中

js scripts not loading in jinja2 template

javascript

python

jinja2

flask