Simple implementation of Raspberry Pi WEB control, Raspberry Pi web
Final Effect
#! /Usr/bin/env python3from bottle import get, post, run, request, template @ get ("/") def index (): return template ("index ") @ post ("/cmd") def cmd (): print ("press the button:" + request. body. read (). decode () return "OK" run (host = "0.0.0.0 ")
That's right. I just want to explain 10 sentences:
1 .#! /Usr/bin/env python3: Tell shell that the file is Python source code, and let bash call python3 to explain the code.
2. from bottle import get, post, run, request, template, the methods and objects I used are imported from the bottle framework.
The following sentence defines two routes, one is "/" and the other is "/cmd". The former is of the get type (decorated with @ get ), the latter is POST type (decorated with @ post)
The first route is very simple, that is, reading the index template (the template is html) and sending it to the client (browser), because the path is "/", that is, for example, the IP address of Raspberry Pi is 192.168.0.10.
Use http: // 192.168.0.10: 8080 to access our "/" route (the default port of the bottle is 8080)
Similarly, the second route path is "/cmd", that is, access http: // 192.168.0.10: 8080/cmd to access the second route.
The last sentence: run (host = "0.0.0.0") is to call the run method of bottle to create an http server so that we can access our interface through a browser.
Below I will explain in detail the functions of these codes:
The role of the first route is to throw the browser an HTML (index. tpl) document to display this interface:
<! DOCTYPE html>
This content is a bit more, but it is very simple. It refers to the two front-end frameworks of jquery bootstrap and adds 5 buttons (code between <body> </body> ). Of course, I used bootstrap's built-in icons, such as up, down, left, right, and stop. The IDS of these five buttons are defined as up, down, left, right, and stop. Then the following key code is written:
$(function(){ $("button").click(function(){ $.post("/cmd",this.id,function(data,status){}); }); });
That's right. There are three codes ......
Line 2 binds a click event to all buttons, and line 3 calls the post method of jquery to call this. id (the id of the clicked button) is sent to the path "/cmd". At this time, the second route of the python code takes effect and receives the id of the clicked button on the webpage, and printed the "pressed Button: XXX"
Of course, you can write a few if statements here to make some actual control as needed. Well, for example, you can call wiringpi2 for python to control the GPIO of Raspberry Pi.
The complete source code is as follows (the bottle framework is provided, which can be directly run after decompression)
Http://pan.baidu.com/s/1qWYPHQs
Post by yafeng
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
