AjaxFileUpload(1)Simple File Upload Sample

AjaxFileUpload(1)SimpleFileUploadSample

1.MavenConfiguration

Thejardependeciesinpom.xmlareasfollow:

<groupId>org.codehaus.jackson</groupId>

<artifactId>jackson-mapper-asl</artifactId>

</dependency>

<groupId>commons-fileupload</groupId>

<artifactId>commons-fileupload</artifactId>

</dependency>

<groupId>commons-io</groupId>

<artifactId>commons-io</artifactId>

</dependency>

2.AddtionalSpringConfiguration

<beanid="multipartResolver"class="org.springframework.web.multipart.commons.CommonsMultipartResolver">

<propertyname="maxUploadSize"value="104857600"/>

<propertyname="maxInMemorySize"value="4096"/>

<propertyname="defaultEncoding">

</property>

</bean>

3.MyJavaScriptandHTMLpage

<html>

<head>

<title>AjaxFileUploadDemo</title>

<scripttype="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

<scripttype="text/javascript"src="./resources/component/ajaxfileupload/2.1/ajaxfileupload.js"></script>

<scripttype="text/javascript">

$(document).ready(function(){

$("#filemaps").change(function(){

varfile_upl=document.getElementById('filemaps');

varrealpath=getPath(file_upl);

$("#fileurl").val(realpath);

});

functionuserBrowser(){

varbrowserName=navigator.userAgent.toLowerCase();

if(/msie/i.test(browserName)&&!/opera/.test(browserName)){

return"IE";

}elseif(/firefox/i.test(browserName)){

return"Firefox";

}elseif(/chrome/i.test(browserName)&&/webkit/i.test(browserName)&&/mozilla/i.test(browserName)){

return"Chrome";

}elseif(/opera/i.test(browserName)){

return"Opera";

}elseif(/webkit/i.test(browserName)&&!(/chrome/i.test(browserName)&&/webkit/i.test(browserName)&&/mozilla/i.test(browserName))){

return"Safari";

}else{

return"unKnow";

}

functiongetPathIE(obj){

obj.select();

returndocument.selection.createRange().text;

}

functiongetPathFFSecurity(obj){

try{

netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");

}catch(e){

alert('Unabletoaccesslocalfilesduetobrowsersecuritysettings.Toovercomethis,followthesesteps:(1)Enter"about:config"intheURLfield;(2)RightclickandselectNew->Boolean;(3)Enter"signed.applets.codebase_principal_support"(withoutthequotes)asanewpreferencename;(4)ClickOKandtryloadingthefileagain.');

if(obj.files){

returnobj.files.item(0).name;

}

return;

}

returnobj.value;

}

functionextractFilename(path){

if(path.substr(0,12)=="C:\\fakepath\\")

returnpath.substr(12);//modernbrowser

varx;

x=path.lastIndexOf('/');

if(x>=0)//Unix-basedpath

returnpath.substr(x+1);

x=path.lastIndexOf('\\');

if(x>=0)//Windows-basedpath

returnpath.substr(x+1);

returnpath;//justthefilename

}

functiongetPath(obj){

if(obj){

//if(window.navigator.userAgent.indexOf("MSIE")>=1){

if(userBrowser()=='IE'){

returngetPathIE(obj);

//}elseif(window.navigator.userAgent.indexOf("Firefox")>=1){

}elseif(userBrowser()=='Firefox'){

returngetPathFFSecurity(obj);

}elseif(userBrowser()=='Chrome'){

returnextractFilename(obj.value);

}

returnobj.value;

}

functionajaxFileUpload(){

$.ajaxFileUpload(

{

url:'fileupload.do',

secureuri:false,

fileElementId:'filemaps',

dataType:'json',

success:function(data,status)

{

console.info(data);

$('#result').html('SuccesstoAdd');

error:function(data,status,e)

{

$('#result').html('FailtoAdd');

}

);

}

</script>

</head>

<body>

<h2>AjaxFileUploadDemo</h2>

<formmethod="post"action="fileupload.do"enctype="multipart/form-data">

<inputid="fileurl"type="text"class="langtext"readonly="readonly"/>

<inputtype="file"id="filemaps"name="filemaps"value="upload"/>

<inputtype="button"value="Submit"onclick="ajaxFileUpload()"/>

</form>

<divid="result"></div>

</body>

</html>

Becauseofthesecurityreason,alotofbrowserdoesnotsupporttogetthefulllocalpathofthefile.

4.JavaFiletohandlerthebinaryfile

packagecom.sillycat.easytalker.controller;

importjava.io.IOException;

importjavax.servlet.http.HttpServletResponse;

importorg.apache.log4j.Logger;

importorg.springframework.stereotype.Controller;

importorg.springframework.web.bind.annotation.RequestMapping;

importorg.springframework.web.multipart.MultipartFile;

importorg.springframework.web.multipart.MultipartHttpServletRequest;

@Controller

publicclassFileController{

privatestaticfinalLoggerlogger=Logger.getLogger(FileController.class);

@RequestMapping("/fileupload.do")

publicvoiduploadFile(MultipartHttpServletRequestrequest,

HttpServletResponseresponse)throwsIOException{

MultipartFilemultipartFile=request.getFile("filemaps");

if(null!=multipartFile

&&null!=multipartFile.getOriginalFilename()){

logger.info("orginalfilename="

+multipartFile.getOriginalFilename());

//OutputStreamos=null;

//InputStreamis=null;

//try{

//is=multipartFile.getInputStream();

//Filefile=newFile("D:/"

//+multipartFile.getOriginalFilename());

//os=newFileOutputStream(file);

//byte[]b=newbyte[1024];

//intlen=0;

//while((len=is.read(b))!=-1){

//os.write(b,0,len);

//}

//}catch(Exceptione){

//logger.error("ErrorMessage:"+e);

//}finally{

//os.close();

//is.close();

//}

}

references:

http://www.phpletter.com/Our-Projects/AjaxFileUpload/

http://demos.telerik.com/aspnet-ajax/upload/examples/clientsidevalidation/defaultcs.aspx

http://www.phpletter.com/Demo/AjaxFileUpload-Demo/

http://hi.baidu.com/2012betterman/item/48d2592c2d79059db73263a9

http://www.cnblogs.com/zorroLiu/archive/2011/08/31/2160858.html

http://mzhou.me/?p=95250

AjaxFileUpload(1)Simple File Upload Sample

相关推荐