CN104869164A - 一种bs软件应用系统在登录页面配置并快速切换图像的方法 - Google Patents

Abstract

本发明公开了一种BS软件应用系统在登录页面配置并快速切换图像的方法，包括以下步骤：步骤一，上传图像至服务器端并动态改变所述图像的地址；客户端获取对应图像的属性对象，动态改变所述属性对象的src属性改变图像显示，同时将用户信息与图像信息关联并保存到相应的数据库中；步骤二，更换用户时，系统通过用户信息获取该用户对应的图像信息，通过Jquery来动态改变图像Src属性改变图像显示。本发明所述方法应用于登录企业或单位的业务系统时，快速显示出登录用户的对应头像，并且能够快速切换用户及其头像。

Description

一种BS软件应用系统在登录页面配置并快速切换图像的方法

技术领域

本发明涉及图像的快速匹配查询以及图像的快速传输、切换显示方法。更具体地说，本发明涉及一种应用于登录企业或单位的业务系统时，快速显示出登录用户的对应头像，并且能够快速切换用户及其头像的方法。

背景技术

图像显示，既可以说是一个古老的问题，也可以说是一个年轻的问题。它伴随着计算机的问世而产生，可称为一个长期存在的问题；而近年来随着科学的发展、计算机各种新技术的诞生，其解决方法变得多样化起来，又焕发了新的光彩。

作为Web页面上一种常见的元素，图像既可以美化页面，取得较好的视觉效果；又可以作为传达信息的载体，直观明了。伴随着不断提高的计算机处理能力和网络带宽，图片越来越多地出现于Web应用程序中，这给了图像显示带来了新的动力，同时，也带来了新的挑战。

随着网络的普及，各种办公管理系统也应用而生，我们身边接触到的系统也多了起来。想到登录，脑海中就会出现各种界面，在美观的背景图片当中，总会出现两条需要用户输入的信息，用户名和密码。久而久之，就会觉查到别人跟自己的登录界面几乎是完全相同的，不同之处只在于用户名和密码处的几个字符。对于用户来说，这少了一些亲切感，与现在个性化的时代也有些脱节。

图像，如果在登录页面动态的显示自己的设置的图像，如自己的头像，这对于用户而言是一种全新的体验。如果在登录时看到自己喜欢的图片或者自己的头像，会给人一种熟悉温馨的感觉，能快速地融入到系统应用中。现在的技术已经可以在一定程度上达到这一点。但是，现有技术的动态显示效率较低，运行速度较慢。

JSP是基于Java语言的一种Web应用开发技术，继承了Java语言的诸多优点，是一个开发web服务应用的强大工具。它主要由JSP页面、JavaBean、Servlet及若干内置对象组成。JSP技术利用HTML或者XML标识来设计和格式化最终页面，利用JSP标识或者小脚本生成页面上的动态内容。其逻辑实现封装在标识和JavaBeans组件中，并且捆绑在小脚本中，所有的脚本在服务器端运行。由于核心逻辑封装在标识和Beans中，页面设计者就能够单纯编辑和使用JSP页面，而不必关心内容的生成。

在服务器端，JSP引擎解释JSP标识和小脚本，查询到所请求的内容，并且以页面的形式将结果发送回浏览器。这样既有助于维护作者的知识产权，又能够保证基于HTML的Web浏览器的完全可用性。

发明内容

本发明的一个目的是解决至少上述问题和/或缺陷，并提供至少后面将说明的优点。

本发明还有一个目的是通过一个对象来保存用户的图片信息，并通过查询该对象是图像返回客户端显示，提高用户图像切换效率，以便提高BS软件应用系统的可用性、准确性以及高效性。

为了实现根据本发明的这些目的和其它优点，本发明所述一种BS软件应用系统在登录页面配置并快速切换图像的方法，包括以下步骤：

步骤一，上传图像至服务器端并动态改变所述图像的地址；客户端获取对应图像的属性对象，动态改变所述属性对象的src属性改变图像显示，同时将用户信息与图像信息关联并保存到相应的数据库中；

步骤二，更换用户时，系统通过用户信息获取该用户对应的图像信息，通过Jquery来动态改变图像Src属性改变图像显示。为了代码编写的简洁性，在JSP中引入Jquery技术。Jquery使开发人员能更方便地处理HTMLdocuments、events、实现动画效果，并且方便地为网站提供AJAX动态交互，给图像的异步获取带来了很大的帮助。

优选地，所述上传图像至服务器端具体包括：

用户设置图像，请求服务器端地址，服务器成功响应所述请求后，动态改变所述上传图像地址；获取图像子节点，新建一个数组对象。

优选地，所述请求的类型为POST请求。

优选地，所述POST请求所带参数包括：图像上传的附件主关键词、图片的长度以及图片的宽度。

优选地，所述POST请求加上防止缓存的时间戳或者随机数。

优选地，在服务器端响应所述请求之后，先把附件的主关键词清空，以防止重复提交。

优选地，在步骤一完成后，当用户登录时，系统通过用户信息获取其关联的图像信息，通过JSON字符串把图像返回客户端。

优选地，所述步骤一中，图像显示具体指：获取用户图像信息之后，判断从服务器返回的图像信息是否为空，否，则获取图像的显示对象，并改变图像src属性来改变图像的显示效果。

优选地，步骤二中，切换用户时，系统根据用户信息查询其对应的图像信息并返回客户端，判断从服务器返回图像信息是否为空，否，则获取图像的显示对象，改变图像src属性改变图像的显示效果。

本发明在于当用户登录系统时，动态的显示用户的头像以及快速切换用户并且更新头像。

平时见到的系统在登陆时只是简单的账号和密码的输入，没有其他的显示信息。本发明在登录页面中融入头像显示及账号快速切换功能，使用户在进入系统之前看到自己的图像，对系统产生一种由来的亲切感。

本发明旨在用户第一次登录后，主动地上传自己的头像，头像被存储在服务器端，其存储地址保存于用户的个人信息中。当用户下次登录系统时，系统根据用户的账号、密码查询出其的相关信息，其中包括头像的存储地址，按照该地址查询到用户头像并传输到客户端进行前台显示。用户在切换账户时，系统根据用户在本机最近的登录信息列出相应的账户及对应的头像，这些也是通过查询后台数据得到的。这样，用户就可以在这些列出的信息中选择需要更改到的账号，提高用户的使用效率。

本发明的其它优点、目标和特征将部分通过下面的说明体现，部分还将通过对本发明的研究和实践而为本领域的技术人员所理解。

附图说明

图1为本发明的一个实施例中BS软件应用系统在登录页面配置并快速切换图像的方法的流程示意图；

图2说明的是用户登录页面图像显示效果图；

图3说明的是切换用户页面图像显示效果图。

具体实施方式

下面结合附图对本发明做进一步的详细说明，以令本领域技术人员参照说明书文字能够据以实施。

图1示出了根据本发明的一种实现形式，示出了本发明BS软件应用系统在登录页面配置并快速切换图像的方法的过程。其中包括：

用户首次登陆系统，头像是统一默认的。当用户上传自己的头像后，系统自动将头像分为大中小三种形式的图片，登陆时显示的是中等形式的头像，当用户保存头像时，该图像会存储在远端服务器上，并将图片存放的地址存入相应的数据库中，以待搜索查询时应用。

当用户登陆系统时，系统会根据用户账号和密码查询到用户的详细信息，进而快速获取其头像在服务器端的存储地址。服务器端锁定用户的头像后，图片传输到客户端进行前台显示，显示效果如图2所示。

当切换账号时，系统根据当前计算机最近登录人的信息记录从后台查询并显示出登录人的账号和对应的头像，以方便账号的快速切换，显示效果如图3所示。

在其中一个实施例中，本发明所述BS软件应用系统在登录页面配置并快速切换图像的方法，具体包括以下步骤：

1，用户设置图像，发送POST请求服务器端地址，服务器成功响应所述请求后，先把附件的主关键词清空，动态改变所述上传图像地址；获取图像子节点，新建一个数组对象。其中，所述POST请求所带参数包括：图像上传的附件主关键词、图片的长度以及图片的宽度等。

2，系统获取图像显示的iframe，获取对应图像的属性对象，动态改变所述属性对象的src属性改变图像显示，同时将用户信息与图像信息关联并保存到相应的数据库中；

3，当用户登录时，系统通过用户信息获取其关联的图像信息，通过JSON字符串把图像返回客户端。判断从服务器返回的图像信息是否为空，否，则获取图像的显示对象，并改变图像src属性来改变图像的显示效果。

4，更换用户时，系统通过用户信息获取该用户对应的图像信息，系统根据用户信息查询其对应的图像信息并返回客户端，判断从服务器返回图像信息是否为空，否，则获取图像的显示对象，通过Jquery来动态改变图像Src属性改变图像显示。为了代码编写的简洁性，在JSP中引入Jquery技术。Jquery使开发人员能更方便地处理HTML documents、events、实现动画效果，并且方便地为网站提供AJAX动态交互，给图像的异步获取带来了很大的帮助。

在其中一个实施例中，用户设置头像的代码实现片段如下：

在其中一个实施例中，登录时后台查询头像信息相应的代码实现片段如下：

TblSysUserImageuserImage＝admUser.getTblSysUserImage()；

loginMap.put(″imageSrc″，userImage.getMiddleImgAddress())

用户图像前台显示代码片段如下：

在其中一个实施例中，切换用户界面中的头像显示代码片段如下：

本发明基于B/S架构，将java技术、jqury以及json技术等直接获取的用户图像的地址信息，提高BS软件应用系统的可用性，给用户带来更贴心的感受。作为应用系统，实用性、准确性、高效性是准则，随着科技的发展，更多的技术将会融入到该类系统中，给用户带来更方便，舒适的应用。

尽管本发明的实施方案已公开如上，但其并不仅仅限于说明书和实施方式中所列运用。它完全可以被适用于各种适合本发明的领域。对于熟悉本领域的人员而言，可容易地实现另外的修改。因此在不背离权利要求及等同范围所限定的一般概念下，本发明并不限于特定的细节和这里示出与描述的图例。

Claims (9)

1.一种BS软件应用系统在登录页面配置并快速切换图像的方法，其特征在于，包括以下步骤：

步骤一，上传图像至服务器端并动态改变所述图像的地址；客户端获取对应图像的属性对象，动态改变所述属性对象的src属性改变图像显示，同时将用户信息与图像信息关联并保存到相应的数据库中；

步骤二，更换用户时，系统通过用户信息获取该用户对应的图像信息，通过Jquery来动态改变图像Src属性改变图像显示。

2.如权利要求1所述的BS软件应用系统在登录页面配置并快速切换图像的方法，其特征在于，所述上传图像至服务器端具体包括：

用户设置图像，请求服务器端地址，服务器成功响应所述请求后，动态改变所述上传图像地址；获取图像子节点，新建一个数组对象。

3.如权利要求2所述的BS软件应用系统在登录页面配置并快速切换图像的方法，其特征在于，所述请求的类型为POST请求。

4.如权利要求3所述的BS软件应用系统在登录页面配置并快速切换图像的方法，其特征在于，所述POST请求所带参数包括：图像上传的附件主关键词、图片的长度以及图片的宽度。

5.如权利要求3所述的BS软件应用系统在登录页面配置并快速切换图像的方法，其特征在于，所述POST请求加上防止缓存的时间戳或者随机数。

6.如权利要求2所述的BS软件应用系统在登录页面配置并快速切换图像的方法，其特征在于，在服务器端响应所述请求之后，先把附件的主关键词清空，以防止重复提交。

7.如权利要求1所述的BS软件应用系统在登录页面配置并快速切换图像的方法，其特征在于，在步骤一完成后，当用户登录时，系统通过用户信息获取其关联的图像信息，通过JSON字符串把图像返回客户端。

8.如权利要求1所述的BS软件应用系统在登录页面配置并快速切换图像的方法，其特征在于，所述步骤一中，图像显示具体指：获取用户图像信息之后，判断从服务器返回的图像信息是否为空，否，则获取图像的显示对象，并改变图像src属性来改变图像的显示效果。

9.如权利要求1所述的BS软件应用系统在登录页面配置并快速切换图像的方法，其特征在于，步骤二中，切换用户时，系统根据用户信息查询其对应的图像信息并返回客户端，判断从服务器返回图像信息是否为空，否，则获取图像的显示对象，改变图像src属性改变图像的显示效果。