獲取燒瓶數據請求

Question

Web開發和編寫將與我的rapiberry pi交互的網頁非常新。 我使燒瓶正常工作，並且在樹莓派上將引腳23設置為“高”和“低”時，當我運行python腳本並瀏覽到http：192.168.1.45：8080時，它將正確打印“高”和“低”。 我無法弄清楚如何在HTML文檔中執行“獲取”以從flask返回“高”，“低”或“錯誤”。

這是我的文件：

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傳遞的高，低和錯誤文本字符串並將其打印到消息框中？

非常感謝，埃德

Answer 1

假設其余代碼正確無誤，那么我至少會看到您使用cgi和python腳本的方式存在一個問題。

根據您的描述，cgi-bin / ckconttest.cgi腳本僅以sudo模式調用./ckconttest.py，而./ckconttest.py根據GPIO引腳狀態返回字符串“ High”或“ Low”。

由於Web服務器正在調用cgi-bin / ckconttest.cgi，並且該cgi腳本僅消耗ckcontest.py的輸出並且不返回任何內容，因此您不會將High和Low返回到瀏覽器。

您有兩種選擇-

直接調用ckconttest.py而不是cgi-bin / ckconttest.cgi
如果由於某種原因不能這樣做，則使用子進程模塊來調用PY文件，讀取其輸出，然后將其返回。

這是使用子流程調用其他可執行文件的不錯參考-http: //pymotw.com/2/subprocess/

Answer 2

您需要修改您的ckcont函數，該函數當前如下所示：

function ckcont() {
    $.ajax({
        type: "POST",
        url: "/cgi-bin/ckconttest.cgi"
    })
    alert ("test");
};

首先，您的@app.route("/")不接受POST請求，僅接受GET請求。 並且您需要為成功（和錯誤）條件指定一些回調。 這些內容如下： http : //jsfiddle.net/FQeg8/4/ ：

$.ajax({
    url: "/cgi-bin/ckconttest.cgi",
    type: "GET",
    success: function(data, status, xhr) {
        alert(data.ip);
    },
    error: function(xhr, status, error) {
        console.log(xhr, status, error);
    }
});

獲取燒瓶數據請求

問題描述

2 個解決方案

解決方案1
1 已采納 2014-03-09 08:09:44

解決方案2
0 2014-03-09 08:10:54

獲取燒瓶數據請求

問題描述

2 個解決方案

解決方案1 1 已采納 2014-03-09 08:09:44

解決方案2 0 2014-03-09 08:10:54

解決方案1
1 已采納 2014-03-09 08:09:44

解決方案2
0 2014-03-09 08:10:54