Javascript访问flask应用程序中的本地JSON文件



我正在本地运行一个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>

相关内容

  • 没有找到相关文章

最新更新