我正在本地运行一个flask应用程序,我的目标是将字典从python传递到Javascript。我目前可以将字典作为json文件存储在本地文件夹中,但我的ajax请求似乎无法访问本地json。为什么这不起作用,有没有一个flask模块可以让我在本地将python字典传递给javascript?
# app.py
dictionary_a = {
"a": {
"b": {
"function_handler": c,
"defaults": {'d':e, 'f':g},
},
"h": {
"function_handler": i,
"defaults": {'d':l},
},
},
}
def dumper(obj):
try:
return obj.toJSON()
except:
return obj.__dict__
@app.route('/')
def index():
jsonn = json.dumps(dictionary_a, default=dumper, indent=2)
with open('data.json', 'w') as json_file:
json.dump(jsonn, json_file)
return render_template('home.html')
这是我的python代码,
# code.js
$.getJSON("../../data.json", function(json) {
console.log(json); // this will show the info it in firebug console
});
这是javascript 中的代码
文件夹结构为
>project
-app.py
>static
>js
-code.js
-data.json
错误消息:GEThttp://localhost:5000/data.json404(未找到(
已解决:
# code.js
var script = document.currentScript;
var fullUrl = script.src;
这些行允许获取代码.js 的路径
var jsonUrl = fullUrl.replace("code.js", "data.json") // hard coded jsonUrl
$.getJSON(jsonUrl, function(from_to_conversions) {
console.log(from_to_conversions)
});
我已经将json文件转储到static/js文件夹中,以便工作
您是否试图在HTML文件中呈现您的python字典?你应该考虑使用Jinja。
如果您在响应中添加了一个字典,那么从flask 1.1开始,html页面将以JSON的形式接收该字典。
# app.py
dictionary_a = {
"a": {
"b": {
"function_handler": c,
"defaults": {'d':e, 'f':g},
},
"h": {
"function_handler": i,
"defaults": {'d':l},
},
},
}
@app.route('/')
def index():
jsonn = dictionary_a
return render_template('home.html', jsonn=jsonn)
然后你可以使用Jinja在你的html页面中处理它。
你可以循环浏览它的元素,添加if语句,等等…
你的home.html应该是这样的:
<html>
...
<body>
...
{{jsonn}}
...
</body>
...
</html>
如果需要,您也可以将其直接传递给javascript代码,并像json一样处理它
<script>
const jsonn = `{{jsonn | safe}}`
</script>