使用 webbapp2 将数据从后端发送到前端的正确方法？

Question

我正在学习，但遇到了一些我无法理解的问题。

我有一个使用 python GAE 和 webbapp2 构建的简单的 hello world 应用程序。

我想在前端使用 D3.js

显示图表

如果我能够将某些数据直接显示到前端的 HTML 部分 (<p>{{data}}</p>)，我将无法在 <script> </script> 中传递任何数据] 我的前端标签。

这是我后端的 MainHandler :

MainHandler(webapp2.RequestHandler):
    def get(self):
        data = [{'Letter': 'A', 'Freq': 20  },{'Letter' : 'B','Freq': 12},{'Letter' : 'C','Freq': 47}]
        template_values = {
            'data' : data
        }
        path = os.path.join(os.path.dirname(__file__), 'index.html')
        self.response.out.write(template.render(path, template_values))

app = webapp2.WSGIApplication([
    ('/', MainHandler),
], debug=True)

在前端我有一个简单的 console.log({{data}}) 导致以下错误 Unexpected token &

我想这里有些东西我不明白，但我不知道是什么。

Answer 1

模板引擎是 escaping 您的数据，以防止它混淆浏览器的呈现引擎，或导致安全问题。所以

[{'Letter': 'A', 'Freq': 20 }]

呈现为

[{'Letter': 'A', 'Freq': 20}]

或

[{&#quot;Letter&#quot;: &#quot;A&#quot;, &#quot;Freq&#quot;: 20}]

这令人困惑 console.log，这是一个 javascript 不知道 html 转义的函数。

您可以使用 safe 过滤器在 Jinja2 中覆盖此行为。

console.log({{ data|safe }})

请注意，您应该只覆盖受信任数据的转义。

使用 webbapp2 将数据从后端发送到前端的正确方法？

Correct way to send data from the back-end to the front-end with webbapp2?

python

webapp2