martes, junio 30, 2009

Conociendo Flex XIV: Validando el acceso

.
En ciertas ocasiones es necesario que la interface que se está desarrollando tenga acceso reservado a usuarios previamente registrados. El ejemplo siguiente habilita que el usuario pueda acceder a un estado reservado u oculto siempre y cuando su nombre y clave sean validadas. Se utiliza una aplicación adicional php que nos permite conectarnos con una BD para valiar los datos del usuario.

Aplicación Flex

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

<!-- El siguiete bloque se ejecuta si el usuario se validó (estado "validado"-->
<mx:states>
<mx:State name="validado">
<mx:SetProperty target="{panel1}" name="width" value="95%"/>
<mx:SetProperty target="{panel1}" name="height" value="95%"/>
<!-- Se eliminan objetos de la pantalla -->
<mx:RemoveChild target="{password}"/>
<mx:RemoveChild target="{username}"/>
<mx:RemoveChild target="{label1}"/>
<mx:RemoveChild target="{Submit}"/>
<mx:RemoveChild target="{label2}"/>
<!-- Se agregan elementos a la pantalla -->
<mx:SetProperty target="{panel1}" name="title" value="Usuario validado"/>
<mx:AddChild relativeTo="{panel1}" position="lastChild">
<mx:Label x="10" y="10" text="Bienvenido!" />
</mx:AddChild>
</mx:State>
</mx:states>

<!-- Función que setea el estado luego de la consulta a la BD-->
<mx:Script>
<![CDATA[
import mx.rpc.events.ResultEvent;
private function checkLogin(evt:ResultEvent):void
{
if(evt.result.loginsuccess == "yes") {currentState = "validado";}
if(evt.result.loginsuccess == "no") {mx.controls.Alert.show('Error en Acceso!');}
}
]]>
</mx:Script>


<mx:HTTPService id="login_user" result="checkLogin(event)" showBusyCursor="true" method="POST" url="http://127.0.0.1/login.php" useProxy="false">
<mx:request xmlns="">
<username>
{username.text}
</username>
<password>
{password.text}
</password>
</mx:request>
</mx:HTTPService>

<!-- Se solicitan datos de acceso -->
<mx:Panel resizeEffect="Resize" width="250" height="200" layout="absolute" title="Ingreso al sistema" horizontalCenter="0" verticalCenter="-2" id="panel1">
<mx:Label x="10" y="10" text="Usuario:" id="label1"/>
<mx:TextInput x="10" y="36" id="username"/>
<mx:Label x="10" y="66" text="Clave:" id="label2"/>
<mx:TextInput x="10" y="92" id="password" displayAsPassword="true"/>
<mx:Button x="10" y="122" label="Enviar" id="Submit" click="login_user.send();"/>
</mx:Panel>

</mx:Application>

Aplicación PHP


[php]<?php

//Conexión a la BD
$mysql = mysql_connect("localhost", "root", "tasistro") or die(mysql_error());
mysql_select_db( "flex");

//Se instancian variables locales con datos pasados por Flex
$username = mysql_real_escape_string($_POST["username"]);
$password = mysql_real_escape_string($_POST["password"]);

//Consulta a la BD
$query = "SELECT * FROM users WHERE username = '$username' AND password = '$password'";
$result = mysql_fetch_array(mysql_query($query));

//Armado e impresión de la respuesta
$output = "<loginsuccess>";
if(!$result) { $output .= "no"; }else{ $output .= "yes";}
$output .= "</loginsuccess>";
print ($output);

?>[/php]


2 comentarios:

  1. Anónimo7:37 p. m.

    Muy buen ejemplo sir!!!
    Ojala siga publicando mas sobre Flex.

    ResponderBorrar
  2. Anónimo3:47 p. m.

    buenos su espacio online es muy bueno,esto es la tercera vez que vi tu blog, buen espacio!
    abrazo

    ResponderBorrar