RFID-RC522+ETHERNET W5100+ ARDUINO MEGA+AJAX E HTML

International Português
#1

OLÁ ESTOU COM UM PROBLEMA COM MEU CÓDIGO, ESTOU TENTANDO ENVIAR AS TAGS DO RFID PARA UMA PÁGINA HTML COM AJAX, ESTÁ FUNCIONANDO PARCIALMENTE N SEI QUAL ERRO ESTOU COMETENDO, NA PAGINA HTML AJAX RECEBE AS TAGS DE FORMA LENTA E N COMPLETA E AS VEZES ELA SE MISTURAM, SEGUE MEU CÓDIGO DO ARDUINO E A PAGINA HTML COM AJAX, AGRADEÇO MTO QUEM PUDER ME AUXILIAR!

#include <SPI.h>
#include <Ethernet.h>
#include <MFRC522.h>
#define SS_PIN 53
#define RST_PIN 49
MFRC522 mfrc522(SS_PIN, RST_PIN);  // Create MFRC522 instance.

byte mac[] = {0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED};
IPAddress ip(192,168,0,150);
IPAddress gateway(192,168,0,1);
IPAddress subnet(255,255,255,0);
EthernetServer server(8090);

char st[20];
String tag= "";
String conteudo= "";
byte letra;

void setup() 
{
  Serial.begin(9600); // Inicia a serial
  Serial.println("Iniciando programa..");
  Ethernet.begin(mac,ip,gateway,subnet);
  Serial.println("Servidor ativo no IP: ");
  Serial.println(Ethernet.localIP());
  mfrc522.PCD_Init(); // Inicia MFRC522
  server.begin();
  SPI.begin();    // Inicia  SPI bus
  Serial.println("Aproxime o seu cartao do leitor...");
  Serial.println();
}

void loop(){

  // Look for new cards
  if ( ! mfrc522.PICC_IsNewCardPresent()) 
  {
    return;
  }
  // Select one of the cards
  if ( ! mfrc522.PICC_ReadCardSerial()) 
  {
    return;
  }

  for (byte i = 0; i < mfrc522.uid.size; i++){
    Serial.print(mfrc522.uid.uidByte[i]);
    tag += String(mfrc522.uid.uidByte[i]);
  } 
    EthernetClient client = server.available();
     if(client){
      boolean continua = true;
         while(client.connected()){
            if(client.available()){

            client.println("HTTP/1.1 200 OK");
            client.println("Content-Type: text/javascript");
            client.println("Access-Control-Allow-Origin: *");
            client.println();             
            client.print("dados({ tag : ");
            client.println(tag);
            client.print(",");
            client.print("})");        
            }          
            break;
          }
       
       delay(1);  
     client.stop();
    }
    Serial.println();
   delay(1500); 
 }

AQUI É O HTML COM AJAX:

<!DOCTYPE HTML>
<html>
  <head>
    <title>Arduino com AJAX</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
   <!-- <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>-->
    <script src="js/jquery.js"></script>
    <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
    <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css">
    <script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <style type="text/css">
      .clean { padding: 0; margin: 0;}
    </style>
  </head>
<body>
  

  

<div class="container">
  <div class="row">
    <div class="col-md-3 well">

      <p>
        Status: <span id="status" class="label"></span>
      </p>

     
      <p>
        <h4>TAG:<span></span></h4>
        
      </p>
     <span id="tag"></span>
     </div> 
    </div>
  </div>
 



<script type="text/javascript">
    //AQUI É A CONFIGURAÇÃO DO IP DO ARDUINO
    var url = 'http://192.168.0.150:8090'; 
    $(document).ready(function(){//AQUI É A FUNÇÃO DE CLICK PARA ENVIO
    var i = 0;
    function fazerRequisicao(){//AQUI É A FUNÇÃO QUE RECEBE OS DADOS DO ARDUINO
        $('#status').removeClass('label-success').addClass('label-warning');
        $('#status').text("Enviando Requisição...");
        $.ajax({
        url: url,
        dataType: 'jsonp', 
        crossDomain: true, 
        jsonp: false,
        jsonpCallback: 'dados', 
        success: function(data,status,xhr) {
        $('#status').removeClass('label-warning').addClass('label-success');
        $('#status').text("Requisição Recebida!");
        $('#tag').text(data.tag);
        i++;
        console.log(data);
        }
      });
        return false;
    }
    setInterval(fazerRequisicao, 2000); 
});


</script>


</body>
</html>
#2