对于网络开发和编写与我的树莓派交互的网页非常陌生。我让 Flask 正常工作,当我的树莓派上的引脚 23 设置为“高”和“低”时,当我运行 python 脚本并浏览到 http:192.168.1.45:8080 时,它会正确打印“高”和“低”。我不知道如何在 HTML 文档中执行“get”以从 Flask 返回“High”、“Low”或“Error”。
这是我的文件:
test5.html:
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
var countDownSecs = 10;
var check = null;
function printCountDown() {
if (check == null && document.getElementById("counter").innerHTML != 'Launched!') {
var cnt = countDownSecs;
check = setInterval(function () {
cnt -= 1;
document.getElementById("counter").innerHTML = cnt;
if (cnt == 0) {
launch();
}
}, 1000);
}
}
function stop() {
clearInterval(check);
check = null;
document.getElementById("counter").innerHTML = countDownSecs;
}
function launch() {
$.ajax({
type: "POST",
url: "cgi-bin/launch.cgi"
})
clearInterval(check);
check = null;
document.getElementById("counter").innerHTML = 'Launch';
setTimeout(function(){
document.getElementById("counter").innerHTML = countDownSecs;
$("#launch").attr("disabled","disabled");
} ,5000);
}
function ckcont() {
$.ajax({
type: "POST",
url: "cgi-bin/ckconttest.cgi"
})
alert ("test");
}
</script>
</head>
<body>
<style type="text/css">
* {
-webkit-touch-callout: none;
-webkit-user-select: none;
}
div.ex
{
font-size:350%;
width:230px;
padding:10px;
border:5px solid gray;
margin:0px;
}
</style>
<div class="ex"; div align="center"><span id="counter"><script>document.write(countDownSecs);</script></span></div>
<button id="continuity" style="font-size:20pt;font-weight:600;padding: 20px 15px">Check Continuity</button>
<script>
$(document).ready(function(){
$("#continuity").click(function(){
$("p").toggleClass("main");
$("#launch").removeAttr("disabled");
ckcont();
});
});
</script>
<button id="launch" disabled="disabled" style="font-size:20pt;font-weight:600;padding: 20px 15px">Hold to Launch
</button>
<script>
$("#launch").bind( "touchend mouseup", function(e) {
if (check != null){
stop();
}
//$( "body" ).append( "<span style='color:#f00;'>Mouse up.</span><br>" );
});
$("#launch").bind( "touchstart mousedown", function(e) {
printCountDown();
//$( "body" ).append( "<span style='color:#00f;'>Mouse down.</span><br>" );
});
</script>
</body>
</html>
CGI 脚本只是以 root 身份运行 python 脚本: ckconttest.cgi:
#!/bin/bash
sudo ./ckconttest.py
ckconttest.py:
#!/usr/bin/env python
from flask import Flask, render_template
import datetime
import RPi.GPIO as GPIO
app = Flask(__name__)
GPIO.setwarnings(False)
GPIO.setmode(GPIO.BCM)
GPIO.setup(18, GPIO.OUT)
GPIO.output(18, True)
GPIO.setup(23, GPIO.IN)
@app.route("/")
def readPin():
try:
if GPIO.input(23) == True:
return "High"
else:
return "Low"
except:
return "Error"
app.run(host='0.0.0.0', port=8080, debug=True)
在函数 ckcont() 中,如何读取 Flask 传递的 High、Low 和 Error 文本字符串并将该字符串打印到消息框?
非常感谢, 埃德
最佳答案
假设您的其余代码是正确的,我发现您使用 cgi 和 python 脚本的方式至少存在一个问题。
根据您的描述,cgi-bin/ckconttest.cgi 脚本只是在 sudo 模式下调用 ./ckconttest.py,并且 ./ckconttest.py 根据 GPIO 返回字符串“High”或“Low”引脚状态。
由于网络服务器正在调用 cgi-bin/ckconttest.cgi,并且该 cgi 脚本只是消耗 ckcontest.py 的输出并且不返回任何内容,因此您不会获得高值和低值返回浏览器。
你有两个选择 -
- 直接调用ckconttest.py而不是cgi-bin/ckconttest.cgi
- 如果由于某种原因你不能,那么使用 subprocess 模块来调用 PY 文件,读取其输出,然后返回它。
这是关于使用子进程调用其他可执行文件的一个很好的引用 - http://pymotw.com/2/subprocess/
关于jquery - 获取 flask 数据请求,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22279621/