文件下载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"
步骤:
-
定义页面,编辑超链接href属性,指向Servlet,传递资源名称filename
-
定义Servlet
-
获取文件名称
-
使用字节输入流加载文件进内存
-
指定response的响应头: content-disposition:attachment;filename=xxx
-
将数据写出到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";
}