Flex和Jsp创建用户登入系统
在开始之前我们先来看下效果:【userName==password都是test】
这个例子中出了使用Flex与JSP验证用户登入之外呢,另外一个看点就是登入之后配合了states使用的resize效果来展示用户正确登入后的界面。
本文是根据Viper Creaitons中的Create a Login System with Flex and PHP例子上把后台的php更改成JSP来实现的。【理由很简单,我不会PHP】,后台数据的验证的方法是采用HttpService的,至于前台的参数传递使用的是<mx:Request>方式。网上找了下,还有一种方法是使用URLVariables对象。具体参考:http://blog.csdn.net/cjd007/archive/2007/05/25/1625823.aspx。
先来看前台UserLogin.mxml
<?xml version="1.0" encoding="utf-8"?><mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:states> <mx:State name="Logged In"> <mx:SetProperty target="{panel1}" name="width" value="95%"/> <mx:SetProperty target="{panel1}" name="height" value="95%"/> <mx:RemoveChild target="{password}"/> <mx:RemoveChild target="{username}"/> <mx:RemoveChild target="{label1}"/> <mx:RemoveChild target="{Submit}"/> <mx:RemoveChild target="{label2}"/> <mx:SetProperty target="{panel1}" name="title" value="Today is Present"/> <mx:AddChild relativeTo="{panel1}" position="lastChild"> <mx:Label x="10" y="10" text="Today is a gift"/> </mx:AddChild> <mx:AddChild relativeTo="{panel1}" position="lastChild"> <mx:Label x="10" y="36" text="That's way we call it the present!"/> </mx:AddChild> <mx:AddChild relativeTo="{panel1}" position="lastChild"> <mx:Label x="10" y="62" text="Liceven"/> </mx:AddChild> </mx:State> </mx:states> <mx:Script> <![CDATA[ import mx.rpc.events.ResultEvent; ]]> </mx:Script> <mx:Script> <![CDATA[private function checkLogin(evt:ResultEvent):void{ if(evt.result.loginResult == "yes") { currentState = "Logged In"; } if(evt.result.loginResult == "no") { mx.controls.Alert.show('Invalid username/password'); } }]]></mx:Script> <mx:HTTPService id="login_user" result="checkLogin(event)" showBusyCursor="true" method="POST" url="http://localhost:8080/UserLogin/loginCheck.jsp" useProxy="false"> <mx:request xmlns=""> <username> {username.text} </username> <password> {password.text} </password> </mx:request> </mx:HTTPService> <mx:Panel resizeEffect="Resize" width="250" height="200" layout="absolute" title="Login System" horizontalCenter="0" verticalCenter="-2" id="panel1"> <mx:Label x="10" y="10" text="Username:" id="label1"/> <mx:TextInput x="10" y="36" id="username"/> <mx:Label x="10" y="66" text="Password:" id="label2"/> <mx:TextInput x="10" y="92" id="password" displayAsPassword="true"/> <mx:Button x="10" y="122" label="Submit" id="Submit" click="login_user.send();"/> </mx:Panel> </mx:Application>
?下面是后台loginCheck.jsp
<% response.setContentType("text/xml"); out.println("<?xml version="1.0" encoding="utf-8"?>"); String userName = request.getParameter("username"); String password = request.getParameter("password"); //Here we do a simple checking to make sure userName equals to password //and then outprints yes or not String loginResult = "<loginResult>"; if (userName.equals(password)) { loginResult += "yes"; } else { loginResult += "no"; } loginResult += "</loginResult>"; out.println(loginResult);%>
?我的实现很简单,只要判断用户名和密码是否一样就可以了。其实这里可以自己实现数据库的连接,然后来判断用户资料的正确与否比较使用。有时间在完善吧。先这样。
2 楼 czwlucky 2009-02-18 我把你的swf下载到本地还可以正常登录,可是我做另外一个例子时发现报安全沙箱,不知道楼主遇到过没,能为我解答下吗?