Flask中render_template传递数据至HTML失败求助

1. 修正模板路径格式 #

Flask的render_template函数默认从项目根目录下的templates文件夹读取模板文件，路径不需要开头的斜杠。你的代码里写了/barchart.html，会导致Flask找不到正确的模板文件，数据自然无法传递。修改为：

return render_template('barchart.html', screen = screenx)

2. 验证screenx变量的有效性 #

先确认screenx是否被正确赋值：

screenx = ((int(width[0][0]) - 0)) 
# 打印变量值，检查是否为有效数字
print(screenx)
return render_template('barchart.html', screen = screenx)

如果控制台无输出或输出异常，说明width[0][0]可能是空值、非数字类型，需要先排查width数据的来源是否正确。

3. 先在非脚本区域测试变量渲染 #

在HTML的<body>开头添加测试代码，确认模板引擎能正常渲染变量：

<body>
    <p>测试screen变量：{{ screen }}</p>
    <!-- 原有的canvas和script代码 -->

如果这行能正常显示数值，说明数据传递没问题，问题出在JavaScript代码里；如果还是没显示，回到前两步排查路径和变量赋值。

4. JavaScript中处理变量的注意事项 #

如果screen是数字类型，当前的screenx1={{screen}}写法没问题，但如果是字符串类型，需要加引号：

screenx1="{{screen}}"

另外，你代码里用到的{{ mydict }}在Flask中没有传递对应的变量，这会导致模板渲染出错，建议要么删除这个变量，要么在render_template中补充传递：

return render_template('barchart.html', screen = screenx, mydict = 你的字典数据)

内容的提问来源于stack exchange，提问作者ilaria Ciuffreda