`
yexin218
  • 浏览: 972992 次
  • 性别: Icon_minigender_1
  • 来自: 珠海
社区版块
存档分类
最新评论

Flex和Jsp创建用户登入系统

    博客分类:
  • Flex
阅读更多

在开始之前我们先来看下效果:【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);
%>

 我的实现很简单,只要判断用户名和密码是否一样就可以了。其实这里可以自己实现数据库的连接,然后来判断用户资料的正确与否比较使用。有时间在完善吧。先这样。

5
1
分享到:
评论
3 楼 umgsai 2013-09-03  
求完整demo  umgsai@126.com
2 楼 czwlucky 2009-02-18  
我把你的swf下载到本地还可以正常登录,可是我做另外一个例子时发现报安全沙箱,不知道楼主遇到过没,能为我解答下吗?
1 楼 piziwang 2008-12-03  
非常好,正式我一直在找的flex登录跳转功能,
太感谢了!

相关推荐

    flex与jsp结合使用

    3. **结合使用**:Flex 和 JSP 结合的目的是将 Flex 作为前端展示层,处理用户交互和动态内容显示;而 JSP 作为后端,负责业务逻辑处理和数据管理。通常,它们通过 HTTP 请求进行通信,Flex 发送请求到 JSP,JSP ...

    flex整合JSP

    8. **测试与调试**:在开发过程中,使用Flex Builder或类似的工具进行调试,确保Flex和JSP之间的通信正常,并对各种浏览器和操作系统进行兼容性测试。 通过以上这些知识点,我们可以理解"flex整合JSP"涉及到的技术...

    Jsp嵌入Flex 、Jsp Flash报表实现源码

    首先,让我们深入理解JSP和Flex各自的特性: 1. **JSP**:JSP是基于Java平台的服务器端脚本语言,允许开发者在HTML页面中嵌入Java代码,以动态生成内容。JSP的优势在于它能够利用Java的强大功能,如面向对象编程,...

    flex嵌入jsp所需的完整包4个

    整合完成后,开发者就可以在JSP页面中通过Flex标签创建用户界面,并利用后台Java服务处理业务逻辑和数据操作。这种方式结合了Flex的富客户端体验和JSP的强大服务器端能力,为开发高性能、交互性强的Web应用提供了...

    Flex和jsp整合实践

    Flex和JSP(JavaServer Pages)的整合是Web开发中的一种常见技术,它结合了富互联网应用程序(RIA)的优势和后端服务器的强大处理能力。在本文中,我们将深入探讨如何将Adobe Flex前端与JSP后端相结合,实现数据的...

    FlexModule_j2ee Flex 与JSP 整合用的.jar 文件

    Flex是一种强大的富互联网应用程序(RIA)开发技术,用于创建具有高度互动性和动态用户体验的Web应用,而JSP则是Java平台上的动态网页开发技术,两者结合可以实现前后端的强大功能。 FlexModule_j2ee的核心是将Flex...

    Flex For JSP.jar

    5. 跨平台兼容性:由于基于Flash Player,Flex创建的应用可以在多种浏览器和操作系统上运行,具备良好的跨平台特性。 在使用Flex for JSP时,开发者需要了解以下关键概念和技术: - MXML:Flex的主要标记语言,...

    jsp与flex的整合直接拷贝就可以用

    Flex负责用户界面的呈现和用户交互,而JSP则处理数据逻辑,提供服务接口供Flex调用。 **三、整合过程关键点** 1. **Flex配置文件(flex.xml)**:在Flex项目中,`flex.xml`是一个重要的配置文件,它定义了与服务器...

    flex解决JSP遮盖

    3. **JavaScript或jQuery干预**:通过JavaScript或jQuery动态修改元素的Z-index,根据需要在用户交互时调整Flex和JSP内容的显示顺序。 4. **使用SWFObject**:SWFObject是一个流行的JavaScript库,用于插入和控制...

    flex嵌入JSP

    将Flex嵌入到JSP页面中,可以结合两者的优点,提供丰富的图形用户界面和强大的后端数据处理能力。 在将Flex嵌入到JSP页面时,可能会遇到一个常见的问题:Flex组件被其他元素遮挡。这通常是由于CSS样式冲突或者布局...

    FLEX3嵌入到JSP,实现的 jar 包

    在IT行业中,尤其是在Web开发领域...总之,"FLEX3嵌入到JSP,实现的jar包"是一个集合了Flex与JSP集成所需核心组件的资源包,帮助开发者轻松地在Java Web应用中集成Flex功能,创建具有动态交互和丰富用户体验的Web应用。

    flex嵌入jsp心得

    通过上述步骤,开发者不仅成功地将Flex集成到JSP项目中,还实现了数据统计图表的动态显示,显著提升了数据可视化的质量和用户体验。此过程强调了对工具选择的重要性以及正确集成方法的应用,为其他开发者提供了宝贵...

    Flex-jsp两个必要jar包

    在开发Web应用时,将富互联网应用程序(RIA)如Adobe Flex与传统的Java Server Pages(JSP)技术结合,可以创建出交互性强、用户体验优秀的Web应用。在这个过程中,`flex-bootstrap-jsp.jar` 和 `flex-sdk-merged....

    PureMVC+Flex+Jsp+Mysql实现用户登录注册

    这种技术组合允许开发者创建功能完备、性能良好的用户登录注册系统,同时利用PureMVC提高了代码的可维护性和Flex增强了用户体验。然而,实际开发时还需要考虑安全性问题,例如对用户输入进行过滤以防止SQL注入,使用...

    flex jsp 嵌套 swf html

    总的来说,将Flex嵌入JSP并生成SWF作为系统拓扑图,是一种高效且灵活的解决方案,它充分利用了各种技术的优势,为用户提供丰富的视觉体验和便捷的操作交互。在处理复杂的网络架构和监控需求时,这种技术尤为适用。

    Flex+JSP Web应用开发实战详解

    Flex+JSP Web应用开发实战详解 p1

    Flex+JSP Web应用开发实战详解-源代码.part4(共5)

    Flex+JSP Web应用开发实战详解-源代码.part4(共5)

    flex同jsp的结合

    - 集成服务器:确保你有一个运行Java应用服务器,如Tomcat或Jetty,这些服务器可以部署JSP和后台服务。 2. **创建Flex项目**: - 使用Flex Builder创建一个新的Flex项目,定义应用程序的基本结构和界面元素。 - ...

    flex+jsp数据传输类似ajax

    Flex和JSP结合使用可以创建富互联网应用程序(RIA),提供动态、交互的用户体验。在本例中,我们将探讨如何利用Flex作为前端展示层与后端的JSP进行数据交互,实现类似Ajax的异步通信机制。 Flex是一款由Adobe开发的...

    Flex+JSPWeb应用开发实战详解,全部源代码之第5章-第8章

    此外,章节还会讲解如何实现数据绑定,使UI组件与后台数据模型动态同步,提高开发效率和用户体验。 第7章“Flex与JSP的高级交互”讲述了更复杂的Flex与JSP协同工作场景。这部分内容可能涉及自定义事件、状态管理、...

Global site tag (gtag.js) - Google Analytics