如何将HTML/JS变量传递给Python?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (1)
  • 关注 (0)
  • 查看 (1051)

我正在创建一个将运行在嵌入式设备上的站点,该设备为用户提供了一个与站点上的多个功能交互的界面。HTML站点上的这些函数将与Python脚本接口,Python脚本将控制连接到嵌入式设备的外部物理设备。

到目前为止,我有几个按钮看起来像这样:

<button class="ui left attached button white" value="Button A - OFF" onClick='buttonTrigger(this.value)'>Button A</button>

按钮Tigger.js方法如下所示:

function buttonTrigger(value) {
  document.location = "cgi-bin/command.cgi"
}

cgi看起来如下:

#!/bin/bash

echo "Hello World!"

我的最终目标是让.cgi脚本将按钮的值传递给Python脚本。

下面是我的问题:如何从keyonTrigger.js调用Command.cgi并传递value参数的buttonTrigger用这个方法?我的Python脚本将如何访问传递给.cgi脚本的变量?或者,如果没有.cgi脚本,我的Python脚本如何直接访问JS中的变量值?

提问于
用户回答回答于

这是一个使用bottle framework的例子。若要运行此操作,请使用pip install bottle,然后使用python app.py上运行应用程序的http://localhost:8000/默认情况下。

app.py

from bottle import request, route, run, static_file

@route('/')
def index():
    return static_file('index.html', './')

@route('/command')
def command():
    value = request.query.value
    return 'Value was set to: ' + value

run(host='0.0.0.0', port=8000, debug=True)

index.html

<!doctype html>
<html>
<head>
    <title>Python Example</title>
    <script>
        function buttonTrigger(value) {
            var output = document.getElementById('output');
            output.innerText = 'Button clicked, waiting for response...';

            fetch('command?value=' + value)
                .then(function(response) { 
                    return response.text();
                })
                .then(function(text) {
                    console.log(text);
                    output.innerText = text;
                });
        }
    </script>
</head>
<body>
    <button value="Button A - OFF" onClick='buttonTrigger(this.value)'>Button A</button>
    <div id="output"></div>
</body>
</html>

扫码关注云+社区

领取腾讯云代金券