1.7 表单应用
表单是实现动态网页的一种常见形式,利用表单可以收集客户端提交的有关信息,是实现网站互动功能的重要组成部分。下面通过几个具体的实例介绍在JSP中应用表单的技巧。
实例025 防止表单在网站外部提交
这是一个提高网站安全的程序
实例位置:光盘\mingrisoft\01\025
实例说明
如果静态网页中含有用户提交的表单和字段信息,而从网页的源代码中,又可以看到网页被提交的目标地址,那么修改静态页面表单提交的目标地址,就可以实现在本地运行静态网页并向服务器提交数据的功能。这样,任何人都可以利用网页在网站外登录网站,从而给网站留下严重的安全隐患。为解决该问题,本实例介绍一种防止表单在网站外部提交的方法,运行本实例,如图1.34所示,在“用户名”文本字段中输入名称,在“密码”文本字段中输入密码,单击“提交”按钮即可进入到网页的处理页面,此时地址栏中的地址即为处理页地址(用户也可以通过其他方法获得)。当用户在本地计算机上编写静态表单页时,将目标地址设置为以上地址后,运行网页并提交表单将显示图1.35所示的提示信息。
图1.34 表单提交前
图1.35 从外部提交表单后
技术要点
由于网站服务器的名称是唯一的,而且每次从客户端浏览服务器网页时,所浏览的网页中包含了网页的来源信息,因此可以通过比较服务器名称的方法来防止表单在网站外被提交。本实例首先使用request.getRequestURL().toString()方法获得当前网页的IE地址,然后使用request.getHeader("referer")请求页面的地址,接着使用URL urlOne = new URL(String url)的方法分别获取两个IE地址服务器主机名,最后比较两个主机的名称是否相同。如果网页的URL为空,比较时将出现路径有误的信息。
实现过程
(1)创建index.jsp页面,添加表单及相关的表单元素,并设置Form表单的相关属性值,关键代码如下:
<form name="form1" action="index.jsp" method="post"> <div align="center"> <input type="text" name="textfield"> <input type="text" name="textfield1"> <input type="submit" name="action" value="提交"> </div> </form>
(2)如果表单被提交,将判断表单提交的路径是否有误,如果提交的路径有误,系统将给予提示,并禁止从网站外部进行提交表单,关键代码如下:
<%@page contentType="text/html; charset=gbk" language="java" import="java.sql.*" errorPage=""%> <%@page import="java.net.URL"%> <% String strOne=request.getHeader("referer"); //获取页面的请求地址 String pathOne=""; //定义空字符串 if(strOne!=null){ //判断当页面的请求地址为空时 URL urlOne =new URL(strOne); //实例化URL方法 pathOne=urlOne.getHost(); //获取请求页面的服务器主机 } String strTwo=request.getRequestURL().toString(); //获取当前网页的地址 String pathTwo = ""; if (strTwo != null) { URL urlTwo =new URL(strTwo); pathTwo=urlTwo.getHost(); //获取当前网页的服务器主机 } %> <% if(!pathOne.equals(pathTwo)){ //判断当前页面的主机与服务器的主机是否相同 %> 禁止网站外部提交表单!!! <%}%>
举一反三
根据本实例,读者可以:
在编写用户登录程序时,应用该技术;
在开发网站后台的管理员登录程序时,应用该技术;
在编写信息录入程序时,应用该技术。
实例026 同一个页中的多表单提交
本实例是一个提高效率、人性化的程序
实例位置:光盘\mingrisoft\01\026
实例说明
在编写程序时,会遇到同一个页中多个表单提交的情况。处理同一个页中多个表单的提交主要是为每个表单提供相应的标识,当表单提交后,根据传递的标识来判断提交的表单,并执行相应的处理。运行本实例,在“表单1”文本字段中输入“豆豆上线”,在“表单2”文本字段中输入“无语上线”,在“表单3”文本字段中输入“林夕上线”后,如图1.36所示,单击表单2后面的“提交”按钮,即可显示图1.37所示的页面。
图1.36 表单提交前的页面
图1.37 表单2提交后的页面
技术要点
本实例主要应用参数的传递,通过传递参数值的不同获取不同的信息。首先设置3个显示表单数据的对象(tex1、tex2、tex3),并且设置其初始值为空字符串,其次通过request.getParameter()方法请求对应的表单参数,如果请求的参数不为空字符串,则将参数赋给相应的对象,最后通过表单元素显示提交后相对应的信息。
技巧:应用参数传递时,如果是提交到本页,也可以省略文件名直接输入问号“?”加参数和值进行参数传递,如:action="?formid=1"。
实现过程
(1)通过JavaScript脚本限定文本字段不允许其为空值,关键代码如下:
<script language="javascript"> function Mycheck(){ if(form1.text1.value==""){ alert("请输入表单的内容!!!");form1.text1.focus();return; } form1.submit(); } </script> <script language="javascript"> function Mycheck1(){ if(form1.text1.value==""){ alert("请输入表单的内容!!");form1.text1.focus();return;} form1.submit(); } </script> <script language="javascript"> function Mycheck2(){ if(form3.text3.value==""){ alert("请输入表单的内容!!!");form3.text3.focus();return;} form3.submit(); } </script>
(2)设置Form表单和文本字段的相关属性,关键代码如下:
<form name="form1" method="post" action="?formid=1"> 表单1: <input name="text1" type="text" class="text" value="<%=text1%>"> <input type="button" name="submit1" value="提交" onclick="Mycheck();"> </form> <form name="form2" method="post" action="?formid=2"> 表单2: <input name="text2" type="text" class="text" value="<%=text2%>"> <input type="button" name="submit2" value="提交" onclick="Mycheck1();"> </form> <form name="form3" method="post" action="?formid=3"> 表单3: <input name="text3" type="text" class="text" value="<%=text3%>"> <input type="button" name="submit3" value="提交" onclick="Mycheck2();"> </form>
(3)表单提交后,根据提交的表单获取相关信息,关键代码如下:
<% String text1=""; String text2=""; String text3=""; String message=""; if(request.getParameter("text1")!=null){ text1=request.getParameter("text1"); message="提交了第1个表单,提交内容为"+text1+""; } if(request.getParameter("text2")!=null){ text2=request.getParameter("text2"); message="提交了第2个表单,提交内容为"+text2+""; } if(request.getParameter("text3")!=null){ text3=request.getParameter("text3"); message="提交了第3个表单,提交内容为"+text3+""; } %>
举一反三
根据本实例,读者可以:
在商品信息添加页面中实现图片文件上传表单和商品信息表单分别提交;
开发商品信息维护页面。