在JS文件中处理python生成的JSON

时间:2018-03-13 02:42:07

标签: javascript jquery html flask

我是网络开发的新手。事实上,一周前我对此一无所知。现在我有一个由高级同事分配的项目。 数据是使用python获得的,从python到javascript的桥是Flask,在main.py中。实际上data更长,并且由其他函数返回,但格式为jsonify()

@app.route("/")
def home():
    # JSON
    data = '{ "name":"John", "age":30, "city":"New York"}'
    response = render_template('home.html', data=data)

我的问题是如何在data这样的JS文件中访问此JSON handle_data.js?我想从这些数据到我的home.html高清图 Django Template Variables and Javascript这个对我不起作用。

3 个答案:

答案 0 :(得分:2)

如果你创建data作为字典而不是python中的字符串会很有用,因为它很容易被jinja2模板引擎解释。 (此外,看起来您的数据已经被jsonified - 您提到的数据由另一个函数返回并由jsonify()格式化。)要访问JS文件中的数据变量,首​​先需要在视图中包含js文件(即html页面)使用标签。然后,在该脚本标记下面,您需要将数据变量传递给js文件中定义的函数(handle_bar.js)

html文件的示例代码:

<html>
<head>
<body>
Some text
<script src="path/to/handle_bar.js"></script>
<script>
loadData({{data}});
 </script>
</body>
</html>

现在你的handle_bar.js应该是这样的:

var myData;

function loadData(data){

myData = data;
console.log(myData);
}
//Use data freely in js file now using myData variable

答案 1 :(得分:0)

您可以将这种替换放入JavaScript中。

<script type="text/javascript"> 
   var a = "{{someDjangoVariable}}";
</script>

var data = '{ "name":"John", "age":30, "city":"New York"}'

var parseData = JSON.parse(data)

console.log(parseData);

如果您关注Django Template Variables and Javascript,您会收到什么错误?

答案 2 :(得分:0)

以下是步骤:

  1. 获取JSON数据。这可能来自本地文件或API。如果您需要有关此步骤的帮助,请参阅Google如何将JSON文件导入JavaScript或如何进行HTTP调用。
  2. 解析JSON数据并将其分配给对象:var myData = JSON.parse(data);
  3. 数据现在位于典型的JavaScript对象中。