使用外部js文件从flask获取json

Question

我有一个flask服务器，输出从pandas dataframe转换的json数据，如下所示：

[{'name': 'FBtr0075557',
  'score': '164.00'},
 {'name': 'FBtr0075557',
  'score': '162.00'}]

我用于将数据帧转换为json并在flask中提供服务的python代码是：

result = df.to_json(orient="records")
parsed = json.loads(result)
return render_template('mirtar.html', targets=json.dumps(parsed))

当我使用内部javascript时，解析数据时不会出现任何错误：

<script type="text/javascript"> const targets = {{ targets|tojson }}; const entries = JSON.parse(targets); console.log(entries); </script>

Answer 1

Jinja语法只在flask html模板中解析，而不是外部加载的JS资产：因为它是python应用程序进行解析，并且在部署的环境中，您通常会使用像nginx这样的Web服务器为静态资产提供服务

排序的最快方法可能是使用this method，而不是在HTML元素中使用数据属性。这意味着您将数据作为参数传递给模板render_template，因此数据在页面加载时存在于模板中

在您的情况下，这可能看起来像

<!  a hidden tag  >
<input type='hidden' id='targetid' data-thetargets='{{ targets|tojson }}' />

然后在javascript中加载以下内容：

var targets = JSON.parse(document.getElementById("targetid").dataset.thetargets);