12 luglio 2008

Sending Email da Flash attraverso PHP

di Marcello Ruta

Pre-requisiti: conoscenza di base di PHP e ActionScript 3.0. Software utilizzati Dreamweaver CS3 per la scrittura del codice PHP e Flash CS 3 per la realizzazione del form in Flash.

Assets: contact.php, emailPhp.fla

Introduzione : In questo tutorial vedremo come sfruttare PHP per processare i dati inseriti in un form Flash e spedirli ad un indirizzo email specifico. Per eseguire questo tutorial prepareremo con Dreamweaver lo script PHP necessario per procesare i dati provenienti dal form in Flash e di Flash per creare l’interfaccia di immissione dei dati.
Adesso procediamo!!!

1 Step:

Nel primo step creeremo l’interfaccia del form di raccolta dati attraverso l’IDE di Flash. Apriamo Flash e creiamo un file Flash (ActionScript 3.0) e lo salviamo emailPhp.fla, a questo punto aggiungiamo 5 livelli e li nominiamo nel seguente modo:

  • component,
  • graphic, 
  • MC_Form, 
  • Label, 
  • Azioni.

Sul livello component trasciniamo dalla Libreria dei componenti (User Inteface) allo stage un’istanza del componente Button, al quale assegniamo attraverso il Pannello Proprietà il nome di istanza submit_btn.

Sul livello graphic disegniamo dei rettangoli vuoti che fungono da riferimenti visivi per i campi di testo di input.

Sul livello MC_form creeremo attraverso lo Strumento testo dei campi di testo di input ai quali assegneremo i seguenti nomi di istanza:

  • nome,
  • cognome,
  • email,
  • message

adesso selezioniamo i 4 campi di testo e premiamo il tasto di scelta rapida F8 per convertire in un simbolo di movieclip i nostri 4 campi di testo, alla movie clip diamo il nome di MC_form e assegniamo il seguente nome di istanza mc_contatto dal Pannello Proprietà.

Sul livello Label creiamo 4 istanze di testo statico, che fungono da etichette. Quindi selezioniamo lo Strumento Testo, lo impostiamo a Testo Statico dal Pannello  Propriet? e iniziamo a crearci le quattro istanze di testo, assegnandogli i seguenti  nomi: Nome, Cognome, Email, Messaggio.

A questo punto la nostra interfaccia per l’inserimento dei dati è completa, quindi iniziamo a preparare il nostro script.

2 Step:

In questa fase prepareremo il codice ActionScript necessario che ci permetterà di mandare i dati al file PHP che processerà i dati e li manderà al nostro account di posta elettronica. Per realizzare tutto ciò ci avvarremo di due funzioni sendMessage e sendHandler. Nella funzione sendMessage assegneremo le variabili necessarie per passare i dati al PHP.

Il PHP viene invocato attraverso le seguenti tre Classi:  l’URLVariables, l’URLRequest, l’URLLoader. Le tre classi lavorano per raccogliere i dati  del form, fare la richiesta di un oggetto, e infine chiamare il file PHP.

Infatti la Classe URLVariables si occupa di memorizzare i dati form  in un oggetto name.value, che poi sono assegnati alla propriet? data della classe URLRequest.

La Classe URLRequest imposterà un metodo usando la proprietà statica POST della Classe URLRequestMethod, che dirà a Flash se inviare i dati in modalità GET o POST. Con il metodo GET  i dati inviati saranno visibili sull’URL (ad esempio phpfile.php?var=value&var1=value1) mentre con il metodo POST i dati non saranno visibili sull’URL, e rappresenta un modo più sicuro per passare dei dati.

Infine con la Classe URLLoader si aggiunge un listener di eventi che sarà invocato quando il PHP è interamente caricato ed ha restituito  le risposte che ci aspettiamo.

Dopo questa breve spiegazione passiamo al  codice:

/* creiamo una variabile di tipo MovieClip e gli assegniamo l'istanza di clip filmato che sta sullo Stage*/

var formMC:MovieClip = mc_contatto;
submit_btn.label = "Send Message";

function sendMessage(e:MouseEvent):void {

//Assegniamo alle variabili di tipo String i nomi dei campi di input contenuti nella MovieClip MC_form

var nomeStr:String = formMC.nome.text;
var cognomeStr:String = formMC.cognome.text;
var emailStr:String = formMC.email.text;
var messageStr:String = formMC.message.text;

//Impostiamo una variabile Booleana per il check sui campi

var emptyFields:Boolean = true;
if (nomeStr.length == 0) {
emptyFields = false;

}

if (cognomeStr.length == 0) {
emptyFields = false;

}

if (emailStr.length == 0) {
emptyFields = false;

}

if (!emptyFields) {
warning.htmlText = "Tutti i campi obbligatori non sono riempiti correttamente!!";
return;

}

/*creiamo un oggetto URLVariables che ci consentirà di trasferire le variabili
tra un'applicazione flash a un server */

var variables:URLVariables = new URLVariables();
variables.nome = nomeStr;
variables.cognome = cognomeStr;
variables.email = emailStr;
variables.messaggio = messageStr;

/*La classe requestUrlMethod specifica se l'oggetto requestUrl
deve utilizzare il metodo POST o il metodo GET quando invia dei dati a un server. */

var requestUrl:URLRequest = new URLRequest(pathFile);
requestUrl.method = URLRequestMethod.POST;
requestUrl.data = variables;
var loader:URLLoader = new URLLoader();
loader.addEventListener(Event.COMPLETE, sendHandler);
loader.load(requestUrl);

}

function sendHandler(e:Event):void {

var loader:URLLoader = URLLoader(e.target);
var variables:URLVariables = new URLVariables(loader.data);

if (variables.resultSend == "SENT") {
//messaggio inviato
warning.htmlText = "Email Inviata Correttamente!";
//svuotiamo i campi di testo di input dopo l'invio
formMC.nome.text = "";
formMC.cognome.text = "";
formMC.email.text = "";
formMC.message.text = "";

} else if (variables.resultSend == "ERROR") {

//messaggio non inviato
warning.htmlText = "Email Non Inviata Correttamente!";

}
}

submit_btn.addEventListener(MouseEvent.CLICK, sendMessage);

3 Step:

L’ultimo step consiste nella scrittura della pagina PHP che processerà I dati provenienti dal form. Per fare questo apriamo un qualsiasi editor oppure apriamo Dreamweaver CS 3 e creiamo il file contact.php.

Con poche righe di codice comporremo uno scriptino abbastanza semplice che ci permetterà di processare i dati che poi verranno inviati al nostro account di posta elettronica.

Ecco chi di seguito il codice necessario:

<?php

$to = "youremail@yourdomain.com";
$subject = 'Form Contatto'; // oggetto dell'email
$nome = $_POST['nome'];
$cognome = $_POST['cognome'];
$email = $_POST['email'];
$messaggio = $_POST['messaggio'];

if(!empty($_POST))

{

//Costruiamo il messaggio

$message = "Nome: ". $nome ."\n";
$message .= "Cognome: ".$cognome ."\r\n";
$message .= "Email: ". $email ."\r\n";
$message .= "Messaggio: ". $messaggio ."\r\n";
$emailHeaders = "From: $nome<$email>";
$emailHeaders .= "\r\nReply-To: $email";

if(mail($to, $subject, $message, $emailHeaders))

{

print "resultSend=SENT";

}

else

{

print "resultSend=ERROR";

}
}

?>

A questo punto non ci resta che caricare il file swf, incorporato nella nostra pagina html e la pagina PHP sul nostro server e fare il test.. Try it!!!

Al prossimo tutorial!!!

Fille Allegato: Sending Email Flash PHP

Vota

Comments