为了账号安全,请及时绑定邮箱和手机立即绑定

使用 Flask 将 JavaScript 连接到 Python 脚本

使用 Flask 将 JavaScript 连接到 Python 脚本

胡说叔叔 2022-07-12 14:51:00
我自己创建了一个完全使用 HTML/CSS 的网站。还对事件使用 Javascript(单击按钮,...)。现在我想用它连接一个python脚本,更重要的是,将python的结果返回到我的网站并在那里显示(使用)它们。考虑这样的事情:带有输入和按钮的网站。如果您单击按钮,则应该运行 python 脚本,如果输入是奇数或偶数,则返回(当然,对于这种特定情况,您不需要 python,但我想这样做)根据我的研究,我相信 Flask 是做它的库(?),但我真的不知道该怎么做。我发现的例子很少。如果有人可以实现上述示例或告诉我如何正确执行,我将不胜感激。我知道网上已经有一些关于这个概念的问题,但正如我所说,例子很少。
查看完整描述

2 回答

?
Helenr

TA贡献1780条经验 获得超3个赞

你说 Flask 是一个很好的解决方案是对的,到处都有例子和教程。如果您想要的只是在按下按钮时运行特定功能并在 javascript 中返回某些内容,那么我在下面提供了一个快速示例。


# app.py

from flask import Flask, render_template

from flask import jsonify


app = Flask(__name__)


# Display your index page

@app.route("/")

def index():

    return render_template('index.html')


# A function to add two numbers

@app.route("/add")

def add():

    a = request.args.get('a')

    b = request.args.get('b')

    return jsonify({"result": a+b})


if __name__ == "__main__":

    app.run(host='0.0.0.0', port=80)

然后可以运行它python app.py并确保您的 index.html 位于同一目录中。然后您应该可以访问http://127.0.0.1/并查看您的页面加载情况。


这实现了一个添加两个数字的函数,这可以通过调用http://127.0.0.1/add?a=10&b=20在您的 javascript 中调用。这应该返回{"result": 30}。


您可以使用下面的代码在您的 javascript 中获取此代码,并将此代码放在单击回调的按钮中。


let first = 10;

let second = 20;

fetch('http://127.0.0.1/add?a='+first+'&b='+second)

  .then((response) => {

    return response.json();

  })

  .then((myJson) => {

    console.log("When I add "+first+" and "+second+" I get: " + myJson.result);

  });


这应该是最基本的基础,但是一旦您可以将数据提交到 Flask 并取回数据,您现在就有了一个可以在 Python 中运行的接口。


编辑:完整的前端示例


https://jsfiddle.net/4bv805L6/


查看完整回答
反对 回复 2022-07-12
?
弑天下

TA贡献1818条经验 获得超8个赞

我非常感谢您的帮助和所花费的时间。但是您的回答并没有以我需要的方式帮助我。那时我不知道该怎么做,但自从我前段时间想出来(我看了一个 youtube 视频......)我想我在这里分享我的解决方案(贴两个字符串):


那是app.py:


from flask import Flask, render_template, request


app = Flask(__name__)


@app.route('/stick', methods=['GET', 'POST'])

def stick():

    if request.method == 'POST':

        result = request.form['string1'] + request.form['string2']

        return render_template('index.html', result=result)

    else:   

        return render_template('index.html')


if __name__ == "__main__":

    app.run()

还有那个 index.html(放在文件夹templates中):


<!DOCTYPE html>

<html>

<body>

    <h3> Stick two strings </h3>

    <form action="{{ url_for('stick') }}" method="post">

            <input type="text" name="string1">

            <input type="text" name="string2">

            <input type="submit" value="Go!">

            <p id="result"></p>

    </form>

<script>


document.getElementById("result").innerHTML = "{{result}}"


</script>

</body>

</html>

在python app.py的终端类型中,它应该可以工作。


查看完整回答
反对 回复 2022-07-12
  • 2 回答
  • 0 关注
  • 159 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信