完全是新手！对于如何通过flask发送json数据以显示在HTML网页上非常迷茫？_Html_Mysql_Json_Flask_Backend

完全是新手！对于如何通过flask发送json数据以显示在HTML网页上非常迷茫？

html mysql json flask

完全是新手！对于如何通过flask发送json数据以显示在HTML网页上非常迷茫？,html,mysql,json,flask,backend,Html,Mysql,Json,Flask,Backend,我对后端web开发人员和前端web开发人员都很陌生。现在，我有一个python脚本，它使用flask来启动web服务器。我在这个脚本中有一个方法，它将故事的名称作为输入，并将文本作为更大的JSON集的一部分返回（请参见代码片段）。另外，我有一个HTML页面，试图通过该页面显示从Web服务器返回的JSON数据。我想弄明白的是。。。如何使HTML页面和JSON服务器相互通信？现在我正在使用Postman访问返回的JSON数据。我知道render_template函数应该在返回函数中以变量“data”

我对后端web开发人员和前端web开发人员都很陌生。现在，我有一个python脚本，它使用flask来启动web服务器。我在这个脚本中有一个方法，它将故事的名称作为输入，并将文本作为更大的JSON集的一部分返回（请参见代码片段）。另外，我有一个HTML页面，试图通过该页面显示从Web服务器返回的JSON数据。我想弄明白的是。。。如何使HTML页面和JSON服务器相互通信？现在我正在使用Postman访问返回的JSON数据。我知道render_template函数应该在返回函数中以变量“data”作为参数调用。。。但我不知道那之后该怎么办？非常感谢您的帮助

我看过很多关于堆栈溢出的帖子，但是回复并不完全是我想要的。。。要么是这样，要么是答案太超前，我无法理解所描述的内容

@app.route('/story/<title>', methods=["GET"])
def display_story(title):

    db = MySQLdb.connect("mysql-server", "root", "secret", "mydb")
    cursor = db.cursor()
    cursor.execute("SELECT * FROM stories WHERE title = %s", (title,))
    rows = cursor.fetchone()
    if (rows != None):
        data = {"title": rows[0], "text": rows[1], "current_user": rows[2], "state": rows[3]}
        db.close()
        resp = Response(json.dumps(data), status=200, mimetype='application/json')
        return resp

    data = { "Error": "There is no story with that title." }
    resp = Response(json.dumps(data), status=404, mimetype='application/json')
    return resp

@app.route（'/story/'，methods=[“GET”]）
def显示_故事（标题）：
db=MySQLdb.connect（“mysql服务器”、“根目录”、“机密”、“mydb”）
cursor=db.cursor（）
cursor.execute（“从标题=%s的故事中选择*，（标题，））
rows=cursor.fetchone（）
如果（行！=无）：
数据={“标题”：行[0]，“文本”：行[1]，“当前用户”：行[2]，“状态”：行[3]}
db.close（）
resp=Response（json.dumps（数据），状态=200，mimetype='application/json'）
返回响应
data={“Error”：“没有这个标题的故事。”}
resp=Response（json.dumps（数据），status=404，mimetype='application/json'）
返回响应

好的，我马上给你一个快速解决问题的方法。首先，您的SQL查询方法是什么？没那么好。例如，您需要使用SQLAlchemy使其更好。其次，您不需要传递带有查询数据的JSON，您的web页面就可以访问它，有一种更简单的方法，JINJA

我会在下面附上一些优秀的资源，这些资源将帮助你在一周或更短的时间里学到更多。这和我在烧瓶里开始时用的一样。绝对简单，你所有的问题都会在那里得到回答。这是更详细的一个，如果你不在我下面的解决方案下，用它来学习

因此，解决方案是：

实施。让生活变得简单，让查询变得容易。它的工作原理可能需要几天的阅读，所以我会给你留下一个链接，你可以开始阅读，以便更好地理解。您在SQLAlchemy中的查询如下所示

然后可以在render_模板中调用变量查询并将其传递到HTML页面。这样,

return render_template('webpage.html', title='XYZ', query=query)

我还假设你的桌子看起来像这样

class stories(db.Model):
    __tablename__ = 'stories'

    id = db.Column(db.Integer, primary_key=True)
    title = db.Column(db.String)
    text = db.Column(db.String)

学习，它是一个模板引擎，使Python-HTML交互变得简单。在你的HTML页面中，你可以像这样使用他们在查询中得到的数据



标题：{{query.Title}
Text:{{query.Text}

您的HTML页面将显示查询数据，而无需使用JSON发送数据以及您当前正在执行的所有操作

学习资源：

因为你是个新手，这个问题表明你在这方面的知识非常有限。我将高度推荐这个Youtube系列

观看前4-5节，了解烧瓶、金甲和SQL炼金术的基本知识。此处链接：

每件事都解释得很清楚，也都显示出来了

在本系列视频的最后，至少在前4个视频中，您将能够使用Flask创建简单的数据库驱动网页，就像创建一个基本的博客网站一样（查看您的代码，这与您正在做的工作大致相同）。

如果您只想构建一个HTML页面，我发现将

resp

传递给

render_template（）

作为

dict

而不是

json

并使用它访问项目更容易。例如，

return render\u template（'index.html'，resp=resp）

。另外请注意，您的SQL极易受到SQL注入攻击。@PGHE这是正确的方法，我也一直在这样做，明白了-我会给您一些建议

class stories(db.Model):
    __tablename__ = 'stories'

    id = db.Column(db.Integer, primary_key=True)
    title = db.Column(db.String)
    text = db.Column(db.String)

<html>
<body>
<p>
Title : {{query.title}}
Text : {{query.text}}
</p>
</body>
</html>