Web编程，简单但适用于机器人项目
Web programming , simple but for a robotic project
构建一个通过网页控制的基于Arduino的机器人。该建筑是Arduino UNO和Adafruit CC3000无线网络板。
连接侧良好！Arduino连接到家庭调制解调器，我的笔记本电脑也连接到了。
机器人的内部IP为192.168.1.7，当我从浏览器192.168.1.7/forward转到链接时，机器人会移动。
然而，令人怀疑的是，我想设置网页上的所有按钮并添加CSS，我想在按下按钮时控制机器人！
这将是最适合我的方法。
#include <Adafruit_CC3000.h>
#include <ccspi.h>
#include <SPI.h>
#include "utility/debug.h"
#include "utility/socket.h"
#include <avr/wdt.h>
//#include <stdlib.h>
const int IN1=4;
const int IN2=2;
const int IN3=7;
const int IN4=8;
char input;
// These are the interrupt and control pins
#define ADAFRUIT_CC3000_IRQ 3 // MUST be an interrupt pin!
// These can be any two pins
#define ADAFRUIT_CC3000_VBAT 5
#define ADAFRUIT_CC3000_CS 10
// Use hardware SPI for the remaining pins
// On an UNO, SCK = 13, MISO = 12, and MOSI = 11
Adafruit_CC3000 cc3000 = Adafruit_CC3000(ADAFRUIT_CC3000_CS,
ADAFRUIT_CC3000_IRQ, ADAFRUIT_CC3000_VBAT,
SPI_CLOCK_DIV2);
// you can change this clock speed
#define WLAN_SSID "aa" // cannot be longer than 32 characters!
#define WLAN_PASS "00"
// Security can be WLAN_SEC_UNSEC, WLAN_SEC_WEP, WLAN_SEC_WPA or
WLAN_SEC_WPA2
#define WLAN_SECURITY WLAN_SEC_WPA2
#define LISTEN_PORT 80
Adafruit_CC3000_Server httpServer(LISTEN_PORT);
String readString;
void setup()
{
pinMode( IN1 ,OUTPUT);// Right Motor 1st wire
pinMode( IN2 ,OUTPUT);// Right Motor 2nd wire
pinMode( IN3 ,OUTPUT);// left Motor 1st wire
pinMode( IN4 ,OUTPUT);// left Motor 2nd wire
Serial.begin(115200);
Serial.println(F("Hello, CC3000!'n"));
//Serial.print("Free RAM: "); Serial.println(getFreeRam(), DEC);
Serial.println(F("'nInitializing..."));
if (!cc3000.begin())
{
Serial.println(F("Couldn't begin()! Check your wiring?"));
while(1);
}
Serial.print(F("'nAttempting to connect to "));
Serial.println(WLAN_SSID);
if (!cc3000.connectToAP(WLAN_SSID, WLAN_PASS, WLAN_SECURITY)) {
Serial.println(F("Failed!"));
while(1);
}
Serial.println(F("Connected!"));
Serial.println(F("Request DHCP"));
while (!cc3000.checkDHCP())
{
delay(100); // ToDo: Insert a DHCP timeout!
}
// Display the IP address DNS, Gateway, etc.
while (! displayConnectionDetails()) {
delay(1000);
}
// Start listening for connections
httpServer.begin();
Serial.println(F("Listening for connections..."));
wdt_enable(WDTO_4S);
}
void loop() {
// Try to get a client which is connected.
Adafruit_CC3000_ClientRef client = httpServer.available();
if (client)
{
delay(5);
Serial.println(F("Client connected."));
// Process this request until it completes or times out.
// An HTTP request ends with a blank line
boolean currentLineIsBlank = true;
while (client.connected())
{
if (client.available())
{
char c = client.read();
//Serial.write(c);
if (readString.length() < 100) {
readString += c;
Serial.print(c);
}
if (c == ''n' && currentLineIsBlank) {
client.println(F("HTTP/1.1 200 OK"));
client.println("Access-Control-Allow-Origin: *");
// client.println("HTTP/1.1 200 OK");
client.println("Connection: Keep-Alive");
client.println("Content-Type: text/html");
client.println();
client.println("<!DOCTYPE HTML>");
//send the HTML stuff
client.println(F("<html><head><title>Randi Control Panel</title><style type='"text/css'">"));
client.println(F("body { font-family: sans-serif }"));
/*
client.println("h1 { font-size: 14pt; }");
client.println("p { font-size: 10pt; }");
client.println("a { color: #2020FF; }");
client.println("</style>");
client.println("</head><body text='"#A0A0A0'" bgcolor='"#080808'">");
*/
client.println(F("<h1>Randi Controls</h1><br/>"));
client.println(F("<form method='"link'" action='"/forward'"><input type='"submit'" value='"Go!'"></form>"));
client.println(F("<form method='"link'" action='"/backward'"><input type='"submit'" value='"Reverse!'"></form>"));
client.println("<form method='"link'" action='"/stop'"><input type='"submit'" value='"Stop'"></form>");
client.println(F("<form method='"link'" action='"/Fleft'"><input type='"submit'" value='"Front Left'"></form>"));
client.println(F("<form method='"link'" action='"/Fright'"><input type='"submit'" value='"Front Right'"></form>"));
client.println(F("<form method='"link'" action='"/Bleft'"><input type='"submit'" value='"Back Left'"></form>"));
client.println(F("<form method='"link'" action='"/Bright'"><input type='"submit'" value='"Back Right'"></form>"));
client.println(F("<br/>"));
client.println(F("</body></html>"));
client.println();
break;
}
if (c == ''n') {
// You're starting a new line.
currentLineIsBlank = true;
}
else if (c != ''r') {
// You've gotten a character on the current line.
currentLineIsBlank = false;
}
}
}
// Give the web browser time to receive the data.
process(client);
readString = "";
}
}
void process (Adafruit_CC3000_ClientRef client)
{
if(readString.length() > 0){
if (readString.indexOf("/forward") > 0)
{
// put your main code here, to run repeatedly:
/*if (Serial.available()) {
// read the most recent character
*/
// input = Serial.read();
// switch based on the character
// switch(input){
// case 'F':
// forward
analogWrite(IN1,0);
analogWrite(IN2,255);
analogWrite(IN3,255);
analogWrite(IN4,0);
//break;
}
else if (readString.indexOf("/backward") > 0)
{
// case 'B': // backwards
// v=Serial.read();
analogWrite(IN1,200);
analogWrite(IN2,0);
analogWrite(IN3,0);
analogWrite(IN4,200);
// break;
}
// case 'S': // stop
else if (readString.indexOf("/stop") > 0)
{
analogWrite(IN1,0);
analogWrite(IN2,0);
analogWrite(IN3,0);
analogWrite(IN4,0);
// break;
}
// case 'L': // left
else if (readString.indexOf("/left") > 0)
{
analogWrite(IN1,0);
analogWrite(IN2,150);
analogWrite(IN3,0);
analogWrite(IN4,200);
}
// break;
// case 'R': // right
else if (readString.indexOf("/right") > 0)
{
analogWrite(IN1,150);
analogWrite(IN2,LOW);
analogWrite(IN3,200);
analogWrite(IN4,LOW);
}// break;
// default: // if character not recognized then stop
else if (readString.indexOf("/stop") > 0)
{
analogWrite(IN1, 0);
analogWrite(IN3, 0);
// break;
}
}}
// Tries to read the IP address and other connection details
bool displayConnectionDetails(void)
{
uint32_t ipAddress, netmask, gateway, dhcpserv, dnsserv;
if(!cc3000.getIPAddress(&ipAddress, &netmask, &gateway, &dhcpserv,
&dnsserv))
{
Serial.println(F("Unable to retrieve the IP Address!'r'n"));
return false;
}
else
{
Serial.print(F("'nIP Addr: ")); cc3000.printIPdotsRev(ipAddress);
Serial.print(F("'nNetmask: ")); cc3000.printIPdotsRev(netmask);
Serial.print(F("'nGateway: ")); cc3000.printIPdotsRev(gateway);
Serial.print(F("'nDHCPsrv: ")); cc3000.printIPdotsRev(dhcpserv);
Serial.print(F("'nDNSserv: ")); cc3000.printIPdotsRev(dnsserv);
Serial.println();
return true;
}
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Shaeens Bot</title>
<script>
var URL='http://192.168.1.7/';
function command(dir)
{
var x=document.getElementById('frm');
frm.src=URL+dir;
}
</script>
</head>
<body>
<button onclick="command('forward')">Forward</button>
<button onclick="command('left')">Left</button>
<button onclick="command('right')">Right</button>
<button onclick="command('stop')">Stop</button>
<iframe src="" id="frm" style="display:none;"></iframe>
</body>
</html>
这个是我的一个朋友编码的！它正在发挥作用，还有其他更好的想法吗？我还计划在这个摄像头上加一个IP摄像头！
扩展您朋友的代码。。。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Roberto Novelo</title>
<script>
//Non jQuery AJAX Lib (0.4 kb) to avoid using an iframe and make it easier to read the server response...
function microAjax(B,A){this.bindFunction=function(E,D){return function(){return E.apply(D,[D])}};this.stateChange=function(D){if(this.request.readyState==4){this.callbackFunction(this.request.responseText)}};this.getRequest=function(){if(window.ActiveXObject){return new ActiveXObject("Microsoft.XMLHTTP")}else{if(window.XMLHttpRequest){return new XMLHttpRequest()}}return false};this.postBody=(arguments[2]||"");this.callbackFunction=A;this.url=B;this.request=this.getRequest();if(this.request){var C=this.request;C.onreadystatechange=this.bindFunction(this.stateChange,this);if(this.postBody!==""){C.open("POST",B,true);C.setRequestHeader("X-Requested-With","XMLHttpRequest");C.setRequestHeader("Content-type","application/x-www-form-urlencoded");C.setRequestHeader("Connection","close")}else{C.open("GET",B,true)}C.send(this.postBody)}};
var URL='http://192.168.1.7/'; //Or whatever IP
function commandResponse(data)
{
//Get a command response from the robot code.
}
function readState(data)
{
//Polling function to read your robot's state (position, moving, etc)...
}
function readCam(data)
{
//decode image data and show it somewhere on the html
}
function command(dir)
{
microAjax(URL+dir, commandResponse);
}
setInterval(function()
{
microAjax(URL+"currentState", readState);
}, 500);
setInterval(function()
{
microAjax(URL+"cam", readCam);
}, 500);
</script>
</head>
<body>
<button onclick="command('forward')">Forward</button>
<button onclick="command('left')">Left</button>
<button onclick="command('right')">Right</button>
<button onclick="command('stop')">Stop</button>
</body>
</html>
在你的机器人代码中。。。
void process (Adafruit_CC3000_ClientRef client)
{
if(readString.length() > 0)
{
if (readString.indexOf("/currentState") > 0)
{
if(1==moving)
{
client.println(F("Moving"));
}
//Exec remaining code...
不确定代码的client.println（）部分，因为它说它将循环，所以你必须看看回复是否到达客户端。如果没有，您可能必须找到一种方法来停止循环并回复客户端（如果这不会中断其他请求循环）。
这是指向micro-ajax-lib
相关文章：
- AddEventListener适用于浏览器，但不适用于Android
- 查找仅适用于原始图像的图像放大算法的名称
- 如何在category.php中执行jquery，这应该适用于类别wordpress中的每个帖子
- Web编程，简单但适用于机器人项目
- JavaScript不适用于internet explorer和Firefox，但适用于谷歌
- Jquery事件处理程序仅适用于匿名函数
- jQuery调整大小函数只适用于窗口
- 火灾在卸载前确认警报仅适用于外部站点
- EmberJS-适用于各种模型的适配器动态名称空间
- Facebook共享链接适用于用户，但不适用于粉丝页面管理员
- jQuery-适用于移动设备的多级菜单
- 循环中的切换脚本只适用于第一次迭代
- 为什么setTimeout适用于无休止的递归调用
- 我未保存的更改指令需要适用于具有不同名称的所有表单
- 适用于多种浏览器的Selenium-需要能够执行javascript的webDriver
- Sails.js/Waterline.add(）和.remove(）仅适用于第二次调用
- jQuery点击事件仅适用于横向(iPhone）
- HTML5 Canvas toDataURL(“image/png”）适用于一些绘画，而有些则不然，不确定原因
- jQuery表单验证(如果==“执行此操作”）仅适用于第一次输入
- 使用Jquery.click显示/隐藏切换，适用于新用户，但不适用于种子
