如何使用 Flask 将 JavaScript 连接到 Python 脚本？-ajax-IT问答社区-解决你的IT疑问

如何使用 Flask 将 JavaScript 连接到 Python 脚本？

Ti Strga 2月前

80 0

我使用 HTML/CSS 创建了一个网站。我还使用 Javascript 处理事件（单击按钮等）。现在我想将 Python 脚本与其连接，更重要的是，从我的 Python 返回结果

我使用 HTML/CSS 创建了一个网站。我还使用 Javascript 处理事件（单击按钮等）。

现在我想将一个 Python 脚本与其连接，更重要的是，将我的 Python 函数的结果返回到我的网站并在那里显示（使用）它们。

考虑这样的情况：我有一个网站，上面有一个输入字段和一个按钮。如果你点击按钮，就会运行一个 Python 脚本，它会返回输入是奇数还是偶数（当然，对于这种特定情况，你不需要 Python，但这就是我想要做的）。

根据我的研究，我相信 Flask 是用于此目的的库，但我真的不知道该怎么做。我发现的例子很少。如果有人可以实现上述示例或告诉我如何做到这一点，我将不胜感激。

我知道网上已经有一些关于这个概念的疑问，但正如我所说，例子很少。

帖子版权声明 1、本帖标题：如何使用 Flask 将 JavaScript 连接到 Python 脚本？
本站网址：http://xjnalaquan.com/
2、本网站的资源部分来源于网络，如有侵权，请联系站长进行删除处理。
3、会员发帖仅代表会员个人观点，并不代表本站赞同其观点和对其真实性负责。
4、本站一律禁止以任何方式发布或转载任何违法的相关信息，访客发现请向站长举报
5、站长邮箱：yeweds@126.com 除非注明，本帖由Ti Strga在本站《ajax》版块原创发布，转载请注明出处！

最新回复 (0)

最新倒序只看楼主

Sumith 2月前 0 只看Ta

引用 2楼
我真的很感谢花时间回答这个问题。但答案并没有以我需要的方式帮助我。那时我不知道该怎么做，但从那时起，我前段时间就想通了，我想我应该在这里分享我的解决方案：

这是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 就可以工作了。
JianMing Wang 2月前 0 只看Ta

引用 3楼

您能否在 github repo 或此处分享您的文件夹结构以及代码？我也遇到了和您一样的问题，但无法摆脱该问题。我的目标是从客户端运行 Python 脚本，我正在考虑使用 Flask 作为中间媒介。除此之外，您还写了在终端上写入 python stackpy.py。它正确吗，还是应该是 python app.py？
Li Yingjun 2月前 0 只看Ta

引用 4楼

@user10634362 如果您想在客户端运行 python，那么用户必须安装 Python！如果您想在服务器端运行客户端提交的随机代码。我认为这代表您的设计存在问题。Python 可以做任何事情，包括删除文件。而且我不是如何限制您的 flask 服务器可以执行的操作的专家。
Yaroslav Admin 2月前 0 只看Ta

引用 5楼
您说得对，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/ 并查看你的页面加载情况。

这实现了一个将两个数字相加的函数，可以在 JavaScript 中通过 http://127.0.0.1/add?a=10&b=20 。然后应该返回 {"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/
byrondrossos 2月前 0 只看Ta

引用 6楼

非常感谢！但是您能更精确地说明一下 index.html 文件吗？我很难理解这些教程，因为它们不太清楚。我需要一个完整的示例，我不需要添加任何东西就可以理解如何使用 flask。谢谢！
Martin Volek 2月前 0 只看Ta

引用 7楼

看一下这里：jsfiddle.net/4bv805L6 当 flask 没有运行演示时，这将起作用，但是一旦 flask 运行，请确保删除第 13-16 行，以便您真正看到 flask 的响应。
Outhrics 2月前 0 只看Ta

引用 8楼

再次感谢您花费的时间！但我现在更加困惑了，因为我在您的代码示例中没有看到任何 flask 命令...
ScottexBoy 2月前 0 只看Ta

引用 9楼

从这些文件的目录运行“python app.py”将启动该应用程序。希望这对您有所帮助。