asp.net2.0基于flex3.0的ajax登录验证（MXML和XML）

刚接触的flex3.0  好不容易自己做了个 登陆模拟，和大家分享
本来想用微软的svilerlight的来，但是我不会，就用ADOBE的FLEX3.0吧！

演示地址：http://www.100w100d.cn/testflexlogin/bin-debug/testflexlogin.html

演示的账号和密码都是：admin

先建一个flex3.0工程名叫testflexlogin
先看我的flex工程目录

然后看代码.由于代码没有MXML格式的我就用JS来写

testflexlogin.mxml

1. <?xml version="1.0" encoding="utf-8"?>
2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" 
3.     creationComplete="initApp()" fontSize="14">
4.          <mx:states>
5.      <!--新建“index”State-->
6.   <mx:State name="index">
7.       <!--移除“登录框”-->
8.    <mx:RemoveChild target="{panel1}"/>
9.    <!--添加新的组件-->
10.    <mx:AddChild position="lastChild">
11.     <mx:Label x="231" y="174" text="欢迎来到主页" fontFamily="Georgia" fontSize="20" />
12.    </mx:AddChild>
13.   </mx:State>
14.  </mx:states>
15.  <mx:Script>
16.   <![CDATA[
17.       import mx.controls.Alert;
18.       import mx.rpc.events.ResultEvent;
19.       private function initApp():void
20.       {
21.        //显示校验码
22.        
23.          lblCheckCode.text=GenerateCheckCode(); 
24.       }
25.    private function loginHandle():void
26.    {
27.     //发送数据到你想验证的页面
28.      httpser.url="http://www.100w100d.cn/Default.aspx";  
29.      //空的情况
30.     if(txtUsername.text!=""&&txtPassword.text!="")
31.     {
32.          if(txtCheckCode.text=="")
33.          {
34.            Alert.show("校验码不能空!","信息提示！");
35.            return;
36.          }
37.          else
38.           {
39.          if(txtCheckCode.text.toLowerCase()!=lblCheckCode.text.toLowerCase())
40.           {
41.             Alert.show("校验码错误!","信息提示！");
42.             //重新生成校验码
43.             lblCheckCode.text=GenerateCheckCode(); 
44.             return;
45.           }
46.           else
47.           {
48.              httpser.url+="?";
49.              httpser.url+="username="+this.txtUsername.text.toString()+"&";
50.              httpser.url+="userpwd="+this.txtPassword.text.toString();
51.           }
52.           httpser.send();
53.      }
54.     }
55.     else
56.     {
57.          Alert.show("请输入完整数据!","信息提示！");
58.     } 
59.    }
60.    private function resetHandle():void
61.    {
62.     txtUsername.text="";
63.     txtPassword.text="";
64.     txtCheckCode.text="";
65.    }
66.             
67.             //生成随机码
68.    private function GenerateCheckCode():String
69.    {
70.     //初始化
71.     var ran:Number;
72.     var number:Number;
73.     var  code:String;
74.     var checkCode:String ="";
75.     //生成四位随机数
76.     for(var i:int=0; i<4; i++)
77.     {
78.      //Math.random生成数为类似为0.1234
79.      ran=Math.random();
80.      number =Math.round(ran*10000); 
81.      //如果是2的倍数生成一个数字
82.      if(number % 2 == 0)
83.        //"0"的ASCII码是48  
84.        code = String.fromCharCode(48+(number % 10)); 
85.      //生成一个字母
86.      else  
87.        //"A"的ASCII码为65
88.        code = String.fromCharCode(65+(number % 26)) ;
89.      checkCode += code;
90.     }
91.     return checkCode;
92.    }
93. private function httpHandle(e:ResultEvent):void //执行<mx:HTTPService>组件后的处理函数
94. {
95.     var xx:Number;
96.     xx=Number(e.result.ComputeResult);
97.     if(xx>0)
98.     {
99.      Alert.show("OK,你成功登陆！","信息提示！");   
100.    
101.     }
102.     else
103.     {
104.      Alert.show("密码不正确！","信息提示！");  
105.     }
106.     }
107.   ]]>
108.  </mx:Script>
109.  <mx:HTTPService id="httpser" showBusyCursor="true" result="httpHandle (event);" useProxy="false"/>
110. <mx:Panel x="350" y="80" width="350" height="257" layout="absolute" title="用户登录" fontFamily="宋体" 
112. fontSize="12" id="panel1">
113.   <!--  "用户名"标签  -->
114.   <mx:Label x="41.5" y="33" text="用户名："/> 
115.   <!--  "密码"标签  -->   
116.   <mx:Label x="42.5" y="81" text="密码："/> 
117.   <!--  "用户名"输入框  -->    
118.   <mx:TextInput x="94.5" y="33" id="txtUsername"/>  
119.   <!--  "密码"输入框  -->
120.   <mx:TextInput x="95.5" y="81" id="txtPassword" displayAsPassword="true"/>
121.   <!--  "登录"按钮  --> 
122.   <mx:Button x="82.5" y="159" label="登录" id="btnLogin" click="loginHandle()"/> 
123.         <!--  "重置"按钮  --> 
124.   <mx:Button x="181.5" y="159" label="重置" id="btnReset" click="resetHandle()"/> 
125.   <!--  "校验码"标签  --> 
126.   <mx:Label x="165.5" y="125" id="lblCheckCode" width="42.5" color="#377CD0"/>
127.   <mx:LinkButton x="216" y="123" label="看不清楚?" id="linkbtnReGenerate" click="lblCheckCode.text=GenerateCheckCode();" fontFamily="宋体" fontSize="12"/>
128.   <mx:Label x="39.5" y="123" text="校验码"/>
129.   <!--  "校验码"输入框  --> 
130.   <mx:TextInput x="96.5" y="121" id="txtCheckCode" width="61" maxChars="4"/>
131.  </mx:Panel>
132. </mx:Application>

然后新建个asp.net工程
把flex整个工程放到asp.net根目录下

default.aspx.cs

1. using System;
2. using System.Data;
3. using System.Configuration;
4. using System.Web;
5. using System.Web.Security;
6. using System.Web.UI;
7. using System.Web.UI.WebControls;
8. using System.Web.UI.WebControls.WebParts;
9. using System.Web.UI.HtmlControls;
11. public partial class _Default : System.Web.UI.Page 
12. {
13.     protected void Page_Load(object sender, EventArgs e)
14.     {
15.         string username = Request.QueryString["username"].ToString();
16.         string pwd = Request.QueryString["userpwd"].ToString();
17.         if(username=="admin"&&pwd=="admin")
18.         {
19.             //返回XML数据。元素标签为<ComputeResult>。
20.             Response.Write("<ComputeResult>" +"1"+ "</ComputeResult>");//返回1表示成功！
21.        }
22.     }
23. }

ok搞定
简单吧！有什么不足的地方请大家指点一下！