Question

我使用D3脚本在Flask构建的网站上显示pie charts，并使用JSON将数据提供给这些饼图。但是，当我打开它时，我收到了来自我的D3网站的错误消息：

SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data

我的D3驱动的.js文件包含这一行，它检索饼图的JSON：

var json_data = "http://the.site/dashboard-data"

我的Python代码在Flask驱动的＆＃34; app.py＆＃34;文件看起来像这样（特别是对于包含我的JSON的端点）：

@app.route('/dashboard-data')
def display_dashboard_data():
    parent_path = '\\'.join(os.path.realpath(__file__).split('\\')[:-1])
    file_path = os.path.join(parent_path, 'static\\js\\default_data.json')
    with open(file_path, 'r') as file_data:
        json_data = json.load(file_data)
    return render_template('dashboard_data.html', data=json_data)

JSON出现没有问题，但我的假设是上述网站错误是由单引号而不是双引号引起的。此外，问题还可能是JSON存储在HTML标记中。以下是包含JSON的网站的内容：

<html>
    <head>
        <meta http-equiv="Content-Type" content="application/json" charset="UTF-8">
    </head>
    <body>
        {&#39;data&#39;: [{&#39;id&#39;: [...the rest of the JSON is found here.]
    </body>
</html>

所以问题是：在我的D3页面上提供这个JSON的最佳方法是什么？

注意：我使用Github Gist开发了D3代码，它非常方便＆＃34; Raw＆＃34;查看JSON文件中的内容时的选项。该原始端点的扩展名为.json（类似于this），我的应用程序没有。有没有办法模仿＆＃34; Raw＆＃34;我自己的应用程序中的端点？

Answer 1

您应该考虑创建一个返回JSON响应的单独端点。

@app.route('/artists')
def artists():
    parent_path = '\\'.join(os.path.realpath(__file__).split('\\')[:-1])
    file_path = os.path.join(parent_path, 'static\\js\\default_data.json')
    with open(file_path, 'r') as file_data:
        json_data = json.load(file_data)
    return jsonify(json_data)

这样，让您的客户端javascript代码向此端点发出请求，以便在JSON中检索数据将毫无困难。

从Flask端点重新获取JSON

1 个答案: