构建一个由网页控制的基于Arduino的机器人。该版本是Arduino UNO和Adafruit CC3000 wifi板。
连接方面没问题！ 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;
}
}
答案 0 :(得分：0)
<!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摄像头！
答案 1 :(得分：0)
扩展您朋友的代码......
<!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（）部分，因为它说它会循环，所以你必须看看回复是否到达客户端。如果没有，您可能必须找到一种方法来停止循环并回复客户端（如果这不会破坏其他请求循环）。