html中file上传后如何保存到一个位置

html-css08

html中file上传后如何保存到一个位置,第1张

html中file上传后保存到一个位置需要预先在服务端建一个保存目录。

举例如下:

1、创建上传form:

<form action="http://www.cs.tut.fi/cgi-bin/run/~jkorpela/echo.cgi"

enctype="multipart/form-data" method="post">

<p>

Type some text (if you like):<br>

<input type="text" name="textline" size="30">

</p>

<p>

Please specify a file, or a set of files:<br>

<input type="file" name="datafile" size="40">

</p>

<div>

<input type="submit" value="Send">

</div>

</form>

2、提交到后台服务端处理:

public void commonImgUpload(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

response.setContentType("text/xml charset=utf-8")

response.setCharacterEncoding("UTF-8")

PrintWriter pw = response.getWriter()

String xml = ""

String imgName = getParam(request, "imgName")

String imgValue = getParam(request, "imgValue")

String type = getParam(request, "type")

String encryptCode = getParam(request, "encryptCode")

log.debug("图片上传,图片名称:" + imgName + ",上传类型:" + type)

if (MD5Checker.check(encryptCode, imgName)) {

try {

String path = this.getClass().getClassLoader().getResource("").getPath()

log.info("当前路径:" + path)

path = path.replace("WEB-INF/classes/", "pictures/" + type + "/")

log.info("替换后路径:" + path)

File temp = new File(path)

if (!temp.isDirectory()) {

log.info("创建目录path: " + path)

temp.mkdirs()

}

path += imgName

log.info("图片全path: " + path)

FileUtil.saveFile(path, (new BASE64Decoder()).decodeBuffer(imgValue), "UTF-8")

xml = "success"

log.info("上传图片:" + path + "成功!")

} catch (Exception e) {

log.info("上传图片失败," + e.getMessage())

xml = "fail"

}

} else {

xml = "<data><resultCode>" + "09" + "</resultCode>" + "<resultMsg>" + "摘要验证错误" + "</resultMsg>" + "</data>"

}

pw.print(xml)

if (null != pw) {

pw.close()

}

}

3、保存路径:

WEB-INF/classes/pictures/111.jpg

1、首先在前台建立uploadFile.aspx文件,利用.net自带控件FileUpload上传本地文件到服务器。

2、建立后台文件uploadFile.aspx.cs,利用提交按钮的的点击事件创建触发方法FileUploadButton_Click,上传选择的本地文件。

3、利用jquery脚本语言上传文件,首先建立upload.html前台html然后把上传的脚本文件包含在内。

4、前台上传脚本文件ajaxfileupload.js核心代码。

5、后台新建upload.ashx文件,处理前台传输文件的请求。

6、最后看一下下图上传界面。