实验二 jsp登录、验证面的制作

《实验二 jsp登录、验证面的制作》由会员分享，可在线阅读，更多相关《实验二 jsp登录、验证面的制作（48页珍藏版）》请在装配图网上搜索。

1、实验二 jsp登录、验证页面的制作一、 目的1、掌握jp登录页面的几种常用解决技术2、掌握jsp验证码的生成技术、掌握s验证页面的制作二、 内容请参照附加材料三、 环节略，请对照附加材料练习四、 问题1、登录时,如果后台在验证时发生问题,该如何解决？2、如果需要记录顾客登录日记，你将采用何种技术?3、如何生成弹出的顾客登录界面？4、验证码的作用是什么？简要阐明验证码生成的一般环节？5、页面验证一般在哪一端进行?何种情形下验证需要在服务器上进行?附件:jsp登录、验证页面技术一、静态登录界面的设计一方面是顾客登录页面loginht,代码如下: hed 系统登录/itle /head center

2、 系 统 登录 /div/td for cto=login.jsp ehpot t height=2spanclss=style顾客名 td/ td密&nbs;&bsp;码 input tye=pasworname=upwdalegt20styl=with:10 ceer divaig=cnter &nsp;  inputype=rst vaue取消 /td/tr /entr /tble 将登录顾客输入的信息提交到lginsp页面进行解决，这里为了以便，不执行数据库的访问操作,直接使用08作为登录顾客名和密码,但在实际中是要从数据库中读取的，该js页面代码实现如下: 如果登录成功，则

3、设定ogin的值为k，提交到下一步验证页面，则进入mainjsp页面,否则,如果输入的顾客名和密码不合法就打印错误信息,man.j页面代码如下: pag otentTp=tet/ht；arse=GB212 hml ead ieLCME T MY HOMEPAGEtitle ceter WCOET M HOMPAGE body inlude file=ecaijp %hml WELOMEOYOMEPAG/title /ead nte WECOME TOM HOMEPAGE 这个页面使用涉及了一种jsp页面chckvalid.jsp为了验证输入信息的合法性: 如果输入信息有误,则回到登录页面,重新

4、输入登录信息。二、后台数据库验证技术涉及前台lognhtml和后台erifloi.jsp两个页面构成：loin.html内容: ead tit登录 boy 顾客登录/h1 顾客名： 密码:  &nbp;nbsp; &nbp; br /ditmeriflogin.j内容:head itl登录 metahttp-equv=cahe-ctol ontent=n-cach !-body div ain=cnte 获取顾客名 trin sserN = reue.getParameer （tserame ）; /获取密码 String sPasswd = reust.getParamt

5、r ( txPaswrd); /登记JDBC驱动程序 ClsfNae ( orggt.mmysql.Drie ).ewInsance ()； /连接参数与Access不同 Stng url = jbc:ysql：/localt/LarnJSP; /建立连接 Conetion coneci = DrverMnaergtonnecion ( rl,root, 01124 )； /SQL语句 Strins slet * from useino wher serame=+ sUserame + and s= + wd + ; Statemntstt = cnnn.retetemnt ( )； Resu

6、ltSet= stmt.eeteuery(ql )； /返回查询成果 /如果记录集非空，表白有匹配的顾客名和密码,登陆成功 if ( rs.next ( ） ) prntln（ 登录成功！ ); ee /否则登录失败 out.pritl ( 顾客名不存在或密码错误！); scos ( ）; tmt.cse ( ); conectioose( ); %下面为客户端添加代码验证功能: ad 登录/title eta http-uv=net-ty conent=exthtl; charset=TF-8 meta htp-uivotentLangug coet=ch-n /hed 顾客登录 顾客名：

7、nut typ=txtnmetxtUseNme value=Your ame ofcus=if（tis.vue=Yor ame）ti.vaue;密码： np type=passwod nme=txtPssworvalue=orpssword onfocu=(tisau=Youpassor）ths.value=;  &p;&np;&bp;&nsp; !- javaScript函数 alidatLog(),用来验证顾客名和密码与否为空- funtiovalidateLogin(） var sUserme =documentrLognttUserae.value; vrsPassword

8、= document.frLogin.xPrvue; if（ssrNam= ） aet(请输入顾客名！); rtr fal； (asord= ) alert（请输入密码！); rtrnfalse; /bdy/htl为服务器端添加代码验证功能:% page impot=jaa.sql.*age import=jav.uil.*!DCTYPE HT PUIC -/3C/DTD TM41 ransitonal/EN til登录 metatp-quvch-cntrol cnno-cahe meta tp-qvkeyordscontentzieckey,sp ead div lign=cener /获取

9、顾客名 tigUserName= questgetPrameer（ tUserNme ); if (sUerName = |srame = nul |ssrNme.ength(）20) nbs; try resposeendRediec （logn.hml); catch （ Excn ) /获取密码 Sting sPass = reqet.taramete （xtPswr ); if( sPaswd = | Pass = null | sPassw.lengt()0 ） try repnesenedect( login.html ）; ctch ( Exceptine ) /登记JDBC驱动

10、程序 Clas.foNae ( org.jtm.mysqlDriver).wInstane （ ); /连接参数与Acess不同 String url = jc:msql：/lahost/arnJSP； /建立连接 Conectio conectin = DivernaergConnecton (url，oot, 011124 ); /SQL语句 Sin sql = ect * from uerinf whee usename= + sUeNa +anduerwd Passw + ; Statmentsmt= connetion.createStment ( )； RestS rs =stt.

11、xecueQury ( sql ); /返回查询成果 /如果记录集非空,表白有匹配的顾客名和密码，登陆成功 f( rs.next ( ) ) /登录成功后将sUerame设立为seion变量的UsName /这样在背面就可以通过 sesion.getAtrue（UserNme) 来获取顾客名, /同步这样还可以作为顾客登录与否的判断根据 esion.setAtrbut ( UsrNm, sserNae ）； ut.pint ( 登录成功！ )； ut.print（ son.etAibute(UsrNa ) + 欢迎您!); el /否则登录失败 out.itln(顾客名不存在或密码错误！ );

12、 rs.lse ( ); stmt.clos ( ); conectioclose ()； 数据库中所有表的字段长度的设计原则是应当是足够用,但不挥霍存储空间.可以发现，上面数据库中字段限制在个字符以内,那么程序中也应当作一种限制,否则也许给网站浮现严重的问题.将上面源码修改如下: . input tye=tetme=xtUserNe lue=Yorname size=20 aength= onfocusif(thi.vlue=Yne)t.vaue=;密码: . . if ( srNe = | sUserae= ull | sserme.legh()2 ) . if(sPassw = | sP

13、sd = ull| Pasw.ngth()20 ) .三、javaban验证技术lg.html页面的实现代码如下:tlmt http-euiCoten-Tpecotent=tethtml;crset=GBKtitle人员登录/SRPlnk ref=./syle/ste.css rel=stylshetype=txt/csheaform n=fm mho=pos dfm actionlogin.js tr wdth19 heig=22 align=cntrclass=soghui14 tr td lignlft lasssngui14 员工编码： uyptex name=empisize=19c

14、las=inut1 valu= 员工密码： input type=pssordname=assword se=1cs=in1 vlue= tdheght= align=cnter cls=oghu /r 在oginhl的祈求的页面loginsp中输入如下代码:ma htpqui=Cot-Type ntent=text/l; carse=Kmta name=NERATORcoet=McrosotFrnPage 4.0ie登录验证/heabd clasnrmal% f（ empoyeeMgn(reques.getParaetr(id)，request.getaraeter(pssor)= fale

15、) outprnt（登录失败！）; % rame src=/firt.tametet srollig=auo marinheig=0margiidth=0 /frse /bdy/hmlidebanjsp文献的内容如下: pagimrt=ava.uti* /jp：usBanjsp:usean i=dptmtMg sc=sessin las=comf.tedanc.dearmenmg.epartenMgClien eartmentMgr.create(）； %empoyeMrcate（); % resultMr.ceate(）; % wrkinsMgr.create(); %/sp:useBan阐

16、明:除了上述常用的技术外,尚有许多的技术,譬如使用读取xl进行验证,加密解密验证等等。顾客登录验证的技术五花八门，但愿在平时的学习过程将这些技术记录下来，以到需要时可以参照。附件:JP彩色验证码生成有4个随机数字和杂乱背景的图片,数字和背景颜色会变化，服务器端刷新(用hstory.g（1)也会变） 产生验证码图片的文献ia.jsp25)c=25; f(bc255) bc=25； intr=fc+dnexInt（bc-c); itfcrando.ntIn（bc-fc）； nt =fcaonexInt(bcfc); returnew Colo(r,g,b); %/设立页面不缓存espns.seHa

17、der(Pagma,Noache)；respoe.setHeader(ch-Cntrol,no-cache);respons.setDateHeade(Expies, 0);/ 在内存中创立图象int with6,height=20;BffereImge imae = ne BuferedIm(idth, eight， BuferedImg.TYPE_NT_R);/ 获取图形上下文Grphc g = imageetGaphics（);/生成随机类Rando rano new Rdom(）；/ 设定背景色g.etlo(getandClor(20,250);g.filRect(0, , widh,

18、 heiht)；/设定字体g.setFont(newon(Times Ne Roman,Font.PLAN,8)；/画边框/g.etolo(ew r()；g.dawRt(,0,id-1,high-1);/ 随机产生155条干扰线，使图象中的认证码不易被其他程序探测到getColor（etRandColor(10,0);for (it i=0;i+)it x ran.tInt(wdth); int y = rndm.neIn(heigt）; nt xl = rnom.nxtInt(12); int y = randm.etnt（12); .drawLine(x，y,x+l,yyl）;/取随机产生

19、的认证码(位数字)Strn sRand=;or （int i=0；i 使用验证码图片的文献asp title认证码输入页面 ET TP-EQUIV=Cach-CntrlCNENT-ahe btablerd lignleft系统产生的认证码:输入上面的认证码:tdinputtype=tet name=rnd maxlngt=4 vlu=/tdnput ype=sumitvlue=提交检测/td/tr 验证的页面cec.jsppagcontentTypetext/ml; are=gb232 anguge=jaaimport=va.sq.* erroPage= head认证码验证页面 /had St

20、ring rad （Srin)session.eAttibue（rand); Strininput = reust.getramte（rad）;%系统产生的认证码为:= nd 输入相似,认证成功! 其她的验证码生成技术请同窗们自己收集。附件3:js验证表单大全js验证表单大全 长度限制scripunctn est(）if(document.b.aluelgh0）alrt（不能超过50个字符!);doumnt.a.b.ocu();rturnfalse;/scriptfor name=a onbit=eturn test(）iput type=ubmit nameSumialue=chck 2.

21、只能是中文 3. 只能是英文=5&ventkeCod=90)evnt.reurnvalufls;/scipt. 只能是数字nctononlyNum(）if（！(evenkeyCde=4&evnt.keyCode=96&evet.eCde=05)/考虑小键盘上的数字键et.reurnaue=fls;或者npu type=ext nkeypress=if(event.keyCode 45 | event.keyCode57) evt.etrnalue=flse;/或者:i okyup=if（ent.keyCde !=37 & even.keyCo ！= 9) vaue=vureplace(D/g,

22、)；obefopasteclipboadData.etData（tet,clipboar.getDaa（text)replac（/,)） 5.只能是英文字符和数字. 验证油箱格式fuctioniEmal(srEil) if（strEmai.arch(/w+（-w)|(.w+)*AZaz0-+(.-)A-Za-z+)*.A-Zz0-+) ！= -)rtrntru;elsalert（o）；7.屏蔽核心字(这里屏蔽*和*)funtines()i(ab.vau.indexOf(*) )|(a.b.value.indxO (*) = 0)aler(:);a.fcu()；rtr fse;nput type

23、=text ae=b8. 两次输入密码与否相似inpu typ=password i=int2input tye=bttn vlu=testoclickceck()/FORMfuntio chec()wit(douental)i（inut1.vue!inpu2alue)alert（fse)inu1.vlu= ；inpu2lu ；ese docme.form0.subit（)；/script够了吧 :)屏蔽右键 很酷 nconextmenu=reurfal ndragstar=urn flse onseesart=reurn s加在boy中二. 表单项不能为空scrt lanuag=javacript!-unction ChekForm() if （documntforname.vallength =