我正在尝试制作一个web界面来远程控制GoPro。到目前为止,我有一个树莓皮3B,我计划用它作为一个网络服务器,通过USB连接到皮零,通过WiFi连接到GoPro。因此,每当我从pi3b SSH到pizero时,我都可以控制GoPro。现在,我想用CherryPy和Ajax创建一个web服务器,这样我就可以创建一个web界面,在连接到与Pi 3B(web服务器)相同的WiFi网络时控制GoPro
我一直在阅读CherryPy documentation,试图了解如何将Ajax与CherryPy结合使用。我以前能够用一个更基本的CherryPy方法(没有Ajax)实现它,但它使它进入了另一个网页,而对于这个,我希望它保持在同一个网页上,这就是我使用Ajax的原因。我以前从未真正使用过Ajax,所以我非常不熟悉,我基本上尽了最大努力在CherryPy文档中复制这个示例,但没有成功,所以如果我遗漏了一些简单的东西,请原谅
以下是HTML页面代码:
<html>
<head>
<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#takePhotos").click(function(e){
$.post("/take", {"count": $("input[name='count']").val()})
.done(alert("Running Take Photos!"));
})
e.preventDefault();
});
</script>
</head>
<body>
<input type="text" value="" name="count"/>
<button id="takePhotos">Take Photos</button>
</body>
下面是web服务器的python代码:
import cherrypy
import os, os.path
import GoPro as gp
import requests
class RaspiServer(object):
@cherrypy.expose
def index(self):
return open('index.html')
@cherrypy.expose
class GPWebService(object):
@cherrypy.tools.accept(media="text/plain")
def GET(self,count):
print("running")
def POST(self,count):
print("running")
gp.connect("pi", "raspberrypizero.local", "raspberry")
gp.takePhotos(count)
return count
if __name__ == '__main__':
conf = {
'/': {
'tools.sessions.on': True,
'tools.staticdir.root': os.path.abspath(os.getcwd())
},
'/takePhotos':{
'request.dispatch': cherrypy.dispatch.MethodDispatcher(),
'tools.response_headers.on': True,
'tools.response_headers.headers': [('Content_Type', 'text/plain')]
},
'/static':{
'tools.staticdir.on': True,
'tools.staticdir.dir': "./public"
}
}
cherrypy.config.update({'server.socket_host': '0.0.0.0'})
webapp = RaspiServer()
webapp.takePhotos = GPWebService()
cherrypy.quickstart(webapp, '/', conf)
我面临的问题是,每当我在输入字段中输入一个值并单击该按钮时,就会出现警告:“正在运行拍照!”在控制台中,我可以看到web服务器已经收到了请求,但是python脚本没有在“POST”方法中运行。 我想做的是执行POST方法,并执行两个python方法“connect”和“takePhotos”(现在还没有)
非常感谢
在玩了一上午的Ajax并学习了更多关于Ajax的知识之后,我终于找到了答案,它和我想象的一样愚蠢和简单
在index.html文件的第7行,我必须将
$.post("/take")
更改为$.post("/takePhotos")
相关问题 更多 >
编程相关推荐