Variablen auslesen aus dem Internet Arduino Ethernet?
Guten Tag, ich habe eine Webseite erstellt für mein Arduino Ethernet Projekt und jetzt möchte ich, dass die Daten vom Slider, also die Position zum Arduino gesendet wird, aber leider habe ich keine Ahnung wie ich das anstellen soll.
Ich habe HTML und css Erfahrung um die Webseite zu erstellen und JavaScript mit der ist die Daten auslesen kann und in eine Variable verpacken kann, nur das rübersenden zum Arduino/ Auslesen da müsste mir jemand helfen wenn es geht.
Material: -Arduino mega -Ethnernet Modul
Danke im vorraus LG Joé
2 Antworten
Hallo Joe,
wie das vom Arduino her geht, kann ich dir spontan nicht sagen. Beim Javascript Code kann ich dir aber helfen. Es sollte folgendermaßen aussehen: https://jsfiddle.net/0n4n50h6/
Du musst dann am Arduino beim Webserver die Route /rotation "abfangen" und die Rotation deines Motors dem Wert entsprechend ändern, der über den Query Parameter "value" reinkommt.
LG SchönerElch
Okay, vielleicht hilft dir das hier weiter? https://github.com/sirleech/Webduino
Dazu gibt es auch im examples Ordner Beispiele für das Auslesen von AJAX Requests.
LG SchönerElch
Danke für deine schnelle Antwort SchönerElch
Ich hatte diese Library schonmal benutzt. Ich habe das Programm unverändert auf den Arduino überspielt und wenn ich dann auf die zugeordnete IP-Adresse gehe (bei mir 192.168.1.100) dann steht dort auf der Internetseite "Epic Fail"
Was ist der Fehler?
Danke schonmal im vorraus.
LG Joé
Schau mal, bei GitHub gibt es eine Issues Seite: https://github.com/sirleech/Webduino/issues/68
LG SchönerElch
Dort steht:
Modify the WEBDUINO_COMMANDS_COUNT variable in WebServer.h or #define it before including that file.
Also ich soll die WEBDUINO_COMMANDS_COUNT variable modifizieren, wie soll ich die denn Modifizieren? der Wert erhöhen?
oder define it bevor including that file, was soll ich vorher definieren? Bzw. wie?
Danke für deine schnellen Antworten SchönerElch
LG Joé
Danke für deine schnelle Antwort;
#define WEBDUINO_COMMANDS_COUNT 8ich habe das vor #include gesetzt und mit folgenden Werten probiert:
8
16
32
64
128
1024
keiner hat funktioniert oder habe ich da etwas falsch verstanden? ;)
danke schon mal im Vorraus
LG Joé
Da muss die Anzahl deiner Commands rein, wenn ich das auf GutHub richtig verstanden habe.
Danke für deine schnelle Antwort
Was ich nicht verstehe, was definiert ein Command?
/* Web_AjaxRGB.pde - example sketch for Webduino library */
#define WEBDUINO_COMMANDS_COUNT 1024
#include "SPI.h"
#include "Ethernet.h"
#include "WebServer.h"
// CHANGE THIS TO YOUR OWN UNIQUE VALUE
static uint8_t mac[6] = { 0x02, 0xAA, 0xBB, 0xCC, 0x00, 0x22 };
// CHANGE THIS TO MATCH YOUR HOST NETWORK
static uint8_t ip[4] = { 192, 168, 1, 100 }; // area 51!
/* all URLs on this server will start with /rgb because of how we
* define the PREFIX value. We also will listen on port 80, the
* standard HTTP service port */
#define PREFIX "/rgb"
WebServer webserver(PREFIX, 80);
#define RED_PIN 5
#define GREEN_PIN 3
#define BLUE_PIN 6
int red = 0; //integer for red darkness
int blue = 0; //integer for blue darkness
int green = 0; //integer for green darkness
/* This command is set as the default command for the server. It
* handles both GET and POST requests. For a GET, it returns a simple
* page with some buttons. For a POST, it saves the value posted to
* the red/green/blue variable, affecting the output of the speaker */
void rgbCmd(WebServer &server, WebServer::ConnectionType type, char *, bool)
{
if (type == WebServer::POST)
{
bool repeat;
char name[16], value[16];
do
{
/* readPOSTparam returns false when there are no more parameters
* to read from the input. We pass in buffers for it to store
* the name and value strings along with the length of those
* buffers. */
repeat = server.readPOSTparam(name, 16, value, 16);
/* this is a standard string comparison function. It returns 0
* when there's an exact match. We're looking for a parameter
* named red/green/blue here. */
if (strcmp(name, "red") == 0)
{
/* use the STRing TO Unsigned Long function to turn the string
* version of the color strength value into our integer red/green/blue
* variable */
red = strtoul(value, NULL, 10);
}
if (strcmp(name, "green") == 0)
{
green = strtoul(value, NULL, 10);
}
if (strcmp(name, "blue") == 0)
{
blue = strtoul(value, NULL, 10);
}
} while (repeat);
// after procesing the POST data, tell the web browser to reload
// the page using a GET method.
server.httpSeeOther(PREFIX);
// Serial.print(name);
// Serial.println(value);
return;
}
/* for a GET or HEAD, send the standard "it's all OK headers" */
server.httpSuccess();
/* we don't output the body for a HEAD request */
if (type == WebServer::GET)
{
/* store the HTML in program memory using the P macro */
P(message) =
""
"Webduino AJAX RGB Example"
""
""
""
""
"
"
"
"
"
"
""
"";
server.printP(message);
}
}
void setup()
{
pinMode(RED_PIN, OUTPUT);
pinMode(GREEN_PIN, OUTPUT);
pinMode(BLUE_PIN, OUTPUT);
Serial.begin(9600);
// setup the Ehternet library to talk to the Wiznet board
Ethernet.begin(mac, ip);
/* register our default command (activated with the request of
http://x.x.x.x/rgbgb */
webserver.setDefaultCommand(&rgbCmd);
/* start the server to wait for connections */
webserver.begin();
}
void loop()
{
// process incoming connections one at a time forever
webserver.processConnection();
Serial.print(red);
Serial.print(" ");
Serial.print(green);
Serial.print(" ");
Serial.println(blue);
analogWrite(RED_PIN, red);
analogWrite(GREEN_PIN, green);
analogWrite(BLUE_PIN, blue);
}
Danke schonmal im Vorraus
LG Joé
#define WEBDUINO_COMMANDS_COUNT 1024
#include "SPI.h"
#include "Ethernet.h"
#include "WebServer.h"
static uint8_t mac[6] = { 0x02, 0xAA, 0xBB, 0xCC, 0x00, 0x22 };
static uint8_t ip[4] = { 192, 168, 1, 100 };
#define PREFIX "/rgb"
WebServer webserver(PREFIX, 80);
#define RED_PIN 5
#define GREEN_PIN 3
#define BLUE_PIN 6
int red = 0;
int blue = 0;
int green = 0;
void rgbCmd(WebServer &server, WebServer::ConnectionType type, char *, bool)
{
if (type == WebServer::POST)
{
bool repeat;
char name[16], value[16];
do
{
/* readPOSTparam returns false when there are no more parameters
* to read from the input. We pass in buffers for it to store
* the name and value strings along with the length of those
* buffers. */
repeat = server.readPOSTparam(name, 16, value, 16);
/* this is a standard string comparison function. It returns 0
* when there's an exact match. We're looking for a parameter
* named red/green/blue here. */
if (strcmp(name, "red") == 0)
{
/* use the STRing TO Unsigned Long function to turn the string
* version of the color strength value into our integer red/green/blue
* variable */
red = strtoul(value, NULL, 10);
}
if (strcmp(name, "green") == 0)
{
green = strtoul(value, NULL, 10);
}
if (strcmp(name, "blue") == 0)
{
blue = strtoul(value, NULL, 10);
}
} while (repeat);
// after procesing the POST data, tell the web browser to reload
// the page using a GET method.
server.httpSeeOther(PREFIX);
// Serial.print(name);
// Serial.println(value);
return;
}
/* for a GET or HEAD, send the standard "it's all OK headers" */
server.httpSuccess();
/* we don't output the body for a HEAD request */
if (type == WebServer::GET)
{
/* store the HTML in program memory using the P macro */
P(message) =
"<!DOCTYPE html><html><head>"
"<title>Webduino AJAX RGB Example</title>"
"<link href='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css' rel=stylesheet />"
"<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js'></script>"
"<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js'></script>"
"<style> body { background: black; } #red,
#green, #blue { margin: 10px; } #red { background: #f00; } #green {
background: #0f0; } #blue { background: #00f; } </style>"
"<script>"
// change color on mouse up, not while sliding (causes much less traffic to the Arduino):
// "function changeRGB(event, ui) { var id =
$(this).attr('id'); if (id == 'red') $.post('/rgb', { red: ui.value } );
if (id == 'green') $.post('/rgb', { green: ui.value } ); if (id ==
'blue') $.post('/rgb', { blue: ui.value } ); } "
// "$(document).ready(function(){ $('#red, #green, #blue').slider({min: 0, max:255, change:changeRGB}); });"
// change color on slide and mouse up (causes more traffic to the Arduino):
"function changeRGB(event, ui) {
jQuery.ajaxSetup({timeout: 110}); /*not to DDoS the Arduino, you might
have to change this to some threshold value that fits your setup*/ var
id = $(this).attr('id'); if (id == 'red') $.post('/rgb', { red: ui.value
} ); if (id == 'green') $.post('/rgb', { green: ui.value } ); if (id ==
'blue') $.post('/rgb', { blue: ui.value } ); } "
"$(document).ready(function(){ $('#red, #green, #blue').slider({min: 0, max:255, change:changeRGB, slide:changeRGB}); });"
"</script>"
"</head>"
"<body style='font-size:62.5%;'>"
"<div id=red></div>"
"<div id=green></div>"
"<div id=blue></div>"
"</body>"
"</html>";
server.printP(message);
}
}
void setup()
{
pinMode(RED_PIN, OUTPUT);
pinMode(GREEN_PIN, OUTPUT);
pinMode(BLUE_PIN, OUTPUT);
Serial.begin(9600);
// setup the Ehternet library to talk to the Wiznet board
Ethernet.begin(mac, ip);
/* register our default command (activated with the request of
* http://x.x.x.x/rgb */
webserver.setDefaultCommand(&rgbCmd);
/* start the server to wait for connections */
webserver.begin();
}
void loop()
{
// process incoming connections one at a time forever
webserver.processConnection();
Serial.print(red);
Serial.print(" ");
Serial.print(green);
Serial.print(" ");
Serial.println(blue);
analogWrite(RED_PIN, red);
analogWrite(GREEN_PIN, green);
analogWrite(BLUE_PIN, blue);
}
Hier ist der Code, ich glaube so ist es besser
https://www.dropbox.com/s/4ru0zonezorko5z/Web_AjaxRGB.ino?dl=0
wieso er Epic Fail anzeigt habe ich keine Ahnung, hoffentlich kannst du mir helfen :)
Danke im vorraus
LG Joé
Ich habe jetzt mal folgendes daraus gemacht: http://pastebin.com/SrX8PUwR
Da ich aber ohne IDE das Ganze getippt habe und nichts testen konnte, sind da eventuell noch kleine Fehler drin. Der Server müsste aber so laufen.
LG SchönerElch
verbesserte Version:
https://www.dropbox.com/s/24g85mflr9clh1v/sketch_jan06a.ino?dl=0
diese funktioniert auch, nur jetzt muss ich mal schauen, wie du überhaupt die Daten rüber sendest und wie ich sie abfrage.
Danke SchönerElch für deine Hilfe!
LG Joé
Das habe ich in Kommentaren in rotationCmd() geschrieben (Korrektur: der Parameter heißt value, nicht rotation). Du erhältst die Rotation des Motors über deinen URL Parameter.
Die Website macht nichts anderes als die eingestellte Rotation vom Schieber auszulesen und dann auf dem Server die folgende URL aufzurufen: 192.168.1.100/rotation?value=GRADZAHL
LG SchönerElch
Danke, funktioniert schonmal, aber einen kleinen Fehler ist noch drin, hoffentlich hast du eine Idee, wie man Ihn raus fixen kann, also:
wenn ich den Slider grdückt halte und bewege werden falsche Werte übertragen, aber wenn ich auf der Leiste drücke geht er direckt zum richtigen Wert.
Danke für deine Hilfe!
LG Joé
Das liegt daran, dass der Code bei jeder kleinen Bewegung des Reglers Daten überträgt. Es ist nicht garantiert, dass die zuletzt gesendeten Daten auch als letztes ausgewertet werden. Ich ändere das mal eben ab...
So müsste es klappen: https://jsfiddle.net/0n4n50h6/1/
Der Code muss jetzt nur noch in den Quellcode eingefügt werden.
LG SchönerElch
Im einfachsten Fall würde ich ein verstecktes iframe nutzen welches die Seite von deinem Modul enthält zb: ip/slider.htm?pos=255
Dein Modul wertet die aufrufe dann aus. Lässt sich mit get oder Post oder auch ganz anders regeln. Aber ich hab Feierabend und von daher gibt es erst mal nur einen kleinen Vorschlag.
Danke SchönerElch,
aber ich glaube ich habe meine Frage falsch formuliert, die Webseite bekomme ich hin, nur was muss ich im Arduino Code schreiben?
Danke im Vorraus
LG Joé