如何使用获取从Flask获取POST数据

如何解决如何使用获取从Flask获取POST数据

我正在使用Flask开发Tweet情绪分析网站。我已经开发了网站的后端。

后端代码：

from flask import *

app=Flask(__name__)

@app.route('/')
def home():
    return render_template('tweet.html')

@app.route('/result',methods=['GET','POST'])
def check_tweet():
    if request.method=='POST':
        tweet=request.form['tweet']
        result=call_predict_function(tweet) #Returns a dictionary having label and score as keys
        return jsonify(tweet=tweet,label=result["label"],score=result["score"])
    else:    
        return render_template('tweet.html')

if __name__ == "__main__":
    app.run(debug=True)

我使用请求检查了代码，它按预期工作。我试图在前端获取。即使显示结果，也不会在控制台中打印数据。

前端代码：

<!DOCTYPE html>
<head>
       <div class="jumbotron text-center">
        <h4>Check Your Tweet</h4>
    </div>
</head>
<body>
    <div class="container">
        <form method="POST" action="http://localhost:5000/result">
            <textarea maxlength="300" name="tweet">
            </textarea>
            <br><br>
            <button type="submit" class="btn-dark" onclick="GetResults()">Check</button>
        </form>
    </div>
    <script>
        function GetResults()
        {
            fetch(`${window.origin}/result`,{
                method : "POST"
            }).then(function(response)
            {
                if(response.status!=200)
                {
                    console.log(response.statusText);
                }
                response.json().then(function(data)
                {
                    console.log(data);
                });
            }).catch(function(error)
            {
                console.log(error);
            });
        }
    </script>
</body>
</html>

我在前端不是很好。我在哪里出错了，如何从Python中获取POST数据？

解决方法

前端出现的第一个错误：

<head></head>不包含<div>或<h4>，它是文档标题的一部分，即标题，元数据（如字符集，描述，关键字）以及样式链接，用于例子。
此外，当我们使用表单时，有必要通过JS接管整个请求解决方案并抑制默认行为（即从表单中获取数据并转到操作中的url）。或者不使用“提交类型”按钮，而是使用<button type = "button">。
另一件事是，缺少要获取的数据附件，您正在向URL发送POST请求，而没有点数据。

还有一些更好的代码提示：

将标头放入提取中，至少说出内容是什么（Content-Type）
标记类型的脚本标记-application / javascript

带有表单编码请求和JSON ready请求的前端：

<!DOCTYPE html>
<head>
    <meta charset="UTF-8">
    <title>Check Your Tweet</title>
</head>
<body>
    <div class="jumbotron text-center">
        <h4>Check Your Tweet</h4>
    </div>
    <div class="container">
        <form>
            <textarea maxlength="300" name="tweet">
            </textarea>
            <br><br>
            <button type="button" class="btn-dark" onclick="GetResults()">Check</button>
        </form>
    </div>
    <script type="application/javascript">
        let tweet = document.querySelectorAll("textarea[name='tweet']");

        function GetResults()
        {
            // JSON Request
            let fetchJsonRequest = {
                cache: "no-cache",method: "POST",headers: {
                    'Content-Type': 'application/json',},body: {
                    tweet: tweet.value
                },}
            
            // Form-encoded Request,like from Form
            let fetchFormEncodedRequest = {
                cache: "no-cache",headers: {
                    'Content-Type': 'application/x-www-form-urlencoded',body: new URLSearchParams({
                    'tweet': tweet.value,}),}

            fetch(`${window.origin}/result`,fetchFormEncodedRequest).then(function(response)
            {
                if(response.status!=200)
                {
                    console.log(response.statusText);
                }
                response.json().then(function(data)
                {
                    console.log(data);
                });
            }).catch(function(error)
            {
                console.log(error);
            });
        }
    </script>
</body>
</html>

如何使用获取从Flask获取POST数据

如何解决如何使用获取从Flask获取POST数据

解决方法

相关推荐