文件下载yu文件上传and表单检验

文件下载yu文件上传and表单检验

1.文件下载

绝对路径(文件的服务器路径)

String path=this.servletContext.getRealPath(String fileurl);

若文件在src目录下fileurl为"/WEB-INF/CLASSES/filename"

若文件在web目录下fileurl为"/filename"

若文件在WEB-INF目录下fileurl为"/WEB-INF/filename"

步骤:

  1. 定义页面,编辑超链接href属性,指向Servlet,传递资源名称filename

  2. 定义Servlet

  3. 获取文件名称

  4. 使用字节输入流加载文件进内存

  5. 指定response的响应头: content-disposition:attachment;filename=xxx

  6. 将数据写出到response输出流

html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <a href="http://localhost:8080/anli/down?filename=1.jpg">图片1</a>
    <a href="http://localhost:8080/anli/down?filename=九尾.jpg">图片2</a>
    <a href="http://localhost:8080/anli/down?filename=1.avi">视频</a>
</body>
</html>

servlet

@WebServlet("/down")
public class download extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        String filename = request.getParameter("filename");

        ServletContext servletContext = this.getServletContext();
        String realPath = servletContext.getRealPath("/image/" +filename);

        FileInputStream fis = new FileInputStream(realPath);
		//浏览器并不知道文件的类型,所以得到浏览器可以解析的mime类型后设置响应头
        String mimeType = servletContext.getMimeType(filename);
        response.setHeader("content-type",mimeType);
		//解决中文问题
		String agent=response.getHeader("user-agent");
		filename=DownLoadUtils.getFileName(agent,filename);
		//设置响应头
        response.setHeader("content-disposition","attachment;filename="+filename);
        
        ServletOutputStream sos = response.getOutputStream();
        byte[] buff = new byte[1024 * 8];
        int len = 0;
        while((len = fis.read(buff)) != -1){
            sos.write(buff,0,len);
        }

        fis.close();
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request,response);
    }
}

web下image包图片


2.文件上传

  • 要有一个form标签,method=post
  • form标签的encType属性值必须为multipart/form-data,表示提交的数据,以多段(每一个表单项一个数据段)的形式进行拼接,然后以二进制流的形式发送给服务器
  • 在form标签中使用input type=file添加上传文件
  • 编写服务器代码接收

servlet

@WebServlet("/uploadServlet")
public class UploadServlet extends HttpServlet {
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //1 先判断上传的数据是否多段数据(只有是多段的数据,才是文件上传的)
        if (ServletFileUpload.isMultipartContent(req)) {
//           创建FileItemFactory工厂实现类
            FileItemFactory fileItemFactory = new DiskFileItemFactory();
            // 创建用于解析上传数据的工具类ServletFileUpload类
            ServletFileUpload servletFileUpload = new ServletFileUpload(fileItemFactory);
            try {
                // 解析上传的数据,得到每一个表单项FileItem
                List<FileItem> list = servletFileUpload.parseRequest(req);
                // 循环判断,每一个表单项,是普通类型,还是上传的文件
                for (FileItem fileItem : list) {
if (fileItem.isFormField()) {
                    // 普通表单项
 
                    System.out.println("表单项的name属性值:" + fileItem.getFieldName());
                    // 参数UTF-8.解决乱码问题
                    System.out.println("表单项的value属性值:" + fileItem.getString("UTF-8"));
 
                } else {
                    // 上传的文件
                    System.out.println("表单项的name属性值:" + fileItem.getFieldName());
                    System.out.println("上传的文件名:" + fileItem.getName());
 
                    //表示将上传的文件保存在那个路径下。
                    fileItem.write(new File("e:\\" + fileItem.getName()));
                }
            }
        } catch (Exception e) {
            e.printStackTrace();
        }
    }
 }
}

jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>
<body>
<form action="/uploadServlet" method="post" enctype="multipart/form-data">
    用户名:<input type="text" name="username" /> <br>
    头像:<input type="file" name="photo" > <br>
    <input type="submit" value="上传">
</form>
</body>
</html>

3.表单检验

<head>
	<meta charset="utf-8">
	<title></title>
</head>
<body>
	<!--onsubmit 可以监听表单提交的动作
	return true 表单会提交
 
  	return false 表单不会提交
  -->
<form action="#" method="get" onsubmit="return checkForm()">
	用户名:<input type="text" id="uname" value="" name="username" placeholder="请输入用户名6-16字母" onblur="checkUsername()"/>
	<span id="uid">
		
	</span>
	
	<br>
	
     密码:<input type="password" id="pwd" value="" name="password" placeholder="请输入用户名6-16数字" onblur="checkPassword()"/>
	 <span id="pid">
	 	
	 </span>
	 <button onmousedown="showPwd()" onmouseup="hiddenPwd()">显示密码</button>
	 <br>
	确认密码:<input type="password" id="epwd" value="" name="repassword" placeholder="请输入用户名6-16数字" onblur="enterPassword()"/>
	<span id="ppid">
		
	</span>
	
	<br>
	
	<input type="submit" value="注册"/>
</form>
</body>
<script type="text/javascript">
	function checkForm(){
	//校验每个表单项是否否和规则
	var v1=checkUsername();
	var v2=checkPassword();
	var v3=enterPassword();	
		return v1&&v2&&v3;
}

function checkUsername(){
	//var username=obj.value;
	var username=document.getElementById("uname").value;
	//定义正则
	var regx=/^[a-z]{6,16}$/i;
	var flag=regx.test(username);
	if(flag){
		//提示
		document.getElementById("uid").innerHTML="<font color='green'>√用户名规则正确</font>"
	}else{
		//提示
		document.getElementById("uid").innerHTML="<font color='red'>❌用户名规则错误</font>"
	}
	
	return flag;
}

function checkPassword(){
	//var password=obj.value;
	var password=document.getElementById("pwd").value;
	var regx=/^[0-9]{6,16}$/;
	var flag=regx.test(password);
	if(flag){
		//提示
		document.getElementById("pid").innerHTML="<font color='green'>√密码规则正确</font>"
	}else{
		//提示
		document.getElementById("pid").innerHTML="<font color='red'>❌密码规则错误</font>"
	}
	return flag;
	
}

function enterPassword(){
	//var pwd=obj.value;
	var pwd=document.getElementById("epwd").value;
	var pwd1=document.getElementById("pwd").value;
	var sp=document.getElementById("ppid");
	if(pwd===pwd1){
		sp.innerHTML="<font color='green'>√两次密码一致</font>"
	}else{
		
		sp.innerHTML="<font color='red'>×两次密码不一致</font>"
	}
	return pwd===pwd1;
}
function showPwd(){
	document.getElementById("pwd").type="text";
	
}
function hiddenPwd(){
	
		document.getElementById("pwd").type="password";
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值