java完成ftp传输(将文件上传至静态资源服务器)

2,591 阅读5分钟

Nginx实现静态资源服务器

apache实现静态资源服务器


参考文章记录

JavaWeb静态资源分离思路

静态资源分离就是把静态资源放到另一台服务器上,web服务器只发布web项目
配置启动静态资源服务,让资源文件通过http方式可访问,
常见方案是使用nginx或者apache设置映射,这样就能通过浏览器访问到 Linux服务器中的文件
java 实现上传文件到远程服务器常用方案:
java上传文件到ftp服务器(这个方案需要在静态资源服务器安装ftp服务)
java使用HttpURLConnection上传文件到远程服务器 (分为客户端和服务端,客户端负责上传,服务端负责接收文件)
java使用HttpClient通过Post上传文件(分为客户端和服务端,客户端负责上传,服务端负责接收文件)

java上传文件到远程服务器(一)---HttpURLConnection方式

未实验

java上传文件到远程服务器(二)---HttpClient方式

未实验

java上传文件到远程服务器七牛云

未实验

SpringMVC中servletFileUpload.parseRequest(request)解析为空获取不到数据问题

springMVC 已经在配置的CommonsMultipartResolver这个转换器里面完成了文件解析:
调用common-fileupload的方式解析,然后再使用parseFileItems()方法封装成自己的文件对象。

所以如果再次使用common-fileupload的方式进行解析获取到的肯定是空, 这个就是问题的所在:
在Controller里面接收到的request都已经是解析过的。

删除Spring MVC文件上传配置,可以自己实现解析(见文章内)

实现进度监控:
重写 CommonsMultipartResolver的parseRequest方法,
为解析类FileUpload 设置自定义的ProgressListener监听器,
进行解析文件,上传并进行进度监控。修改配置文件。

java完成ftp传输

目的

java接收前端上传的文件并将文件转发存储到静态资源服务器。

分析

  • java实现ftp上传(commons-net包使用及封装)
  • 不使用进度,解析HttpServletRequest得到上传文件
  • 将文件上传到ftp地址
  • 进度监听及封装(未实现)
  • 前端上传js、HTML代码

实现

java上传实现:

safiriGitHub/FTPUtil

前端上传js、HTML代码

<div>   
    <label>上传标题图片:</label>
    <form method="post" enctype="multipart/form-data" id="uploadImgForm">
    <!-- 多选multiple="multiple"  -->
    <input type="file" name="img" id="uploadImgFile" onchange="imagePreviews()" accept="image/*" value="选择图片" />
    </form>
</div>


<script type="text/javascript">

//下面用于多图片上传预览功能
    function imagePreviews(avalue) {
        var docObj = document.getElementById("uploadImgFile");
        var preview = document.getElementById("preview");
        preview.innerHTML = "";
        var fileList = docObj.files;
        var tishi = "";
        for (var i = 0; i < fileList.length; i++) {            
            preview.innerHTML += "<div style='float:left' > <img id='img" + i + "'  /> </div>";
            var imgObjPreview = document.getElementById("img"+i); 
            if (docObj.files && docObj.files[i]) {
				if(docObj.files[i].size>20*1024*1024){
					tishi+="第"+Number(i+1)+"张图片过大,图片上传限制为20M;";
                	continue;
                }
                //火狐下,直接设img属性
                imgObjPreview.style.display = 'block';
                imgObjPreview.style.width = '200px';
                imgObjPreview.style.height = '200px';
                //imgObjPreview.src = docObj.files[0].getAsDataURL();
                //火狐7以上版本不能用上面的getAsDataURL()方式获取,需要一下方式
                imgObjPreview.src = window.URL.createObjectURL(docObj.files[i]);
            }
            else {
                //IE下,使用滤镜
                docObj.select();
                var imgSrc = document.selection.createRange().text;
                alert(imgSrc)
                var localImagId = document.getElementById("img" + i);
                //必须设置初始大小
                localImagId.style.width = "200px";
                localImagId.style.height = "150px";
                //图片异常的捕捉,防止用户修改后缀来伪造图片
                try {
                    localImagId.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
                    localImagId.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;
                }
                catch (e) {
                    alert("您上传的图片格式不正确,请重新选择!");
                    return false;
                }
                imgObjPreview.style.display = 'none';
                document.selection.empty();
            }
        }  
        if(tishi!=""){
        	alert(tishi);
        }
        return true;
    }
	

	//获取(input type="file")的file数组,参数1:input的id
	// 无文件返回null
	function createFormData(inputIdStr) {
		var inputObj = document.getElementById(inputIdStr);
		var files = inputObj.files;
		if (files.length == 0) {
			return null;
		}
		// 通过FormData将文件转成二进制数据
	    var formData = new FormData();
	    for (var i = 0; i < files.length; i++) {
	    	// 将文件转二进制
		    formData.append('files', files[i]);
	    }
	    return formData;
	}
	
	// 开始上传请求
	// formData:文件参数 ,由createFormData() 创建 ;添加其它参数formData.append('a', 其它参数);
	function uploadWithXMLHttpRequest(formData, successCallback) {
		var xhr = new XMLHttpRequest;
	    xhr.open('post', '${ctx }/upload/uploadImage.do');
	    
	    // 监听上传进度
	    xhr.upload.onprogress = function (ev) {
	    	// 事件对象
	        //var percent = (ev.loaded / ev.total) * 100 + '%';
	        // progress.style.width = percent;
	    }
	    xhr.upload.addEventListener("loadend", function(){
	    	//使用 loadend 事件可以侦测到所有的三种加载结束条件(abort、load,或 error):
	    	//需要注意的是,没有方法可以确切的知道 loadend 事件接收到的信息是来自何种条件引起的操作终止;但是你可以在所有传输结束的时候使用这个事件处理。
	    	//console.log('loadend');
	    });
		
	    
	    xhr.onreadystatechange = function () {
	    	if(xhr.readyState == 4 && xhr.status == 200) {
	    		if(typeof successCallback=='function'){
	    			successCallback(xhr.responseText);//返回结果
	            }
          	 }
	    }
	    
	    xhr.send(formData);

	}
	function uploadWithJQuery() {
		//var formData = createFormData("uploadImgFile");example
		var formData = new FormData($("#uploadImgFile")[0]);// example
		 $.ajax({
			    url: '${ctx }/upload/uploadImage.do',
			    type: 'POST',
			    data: formdata,                    // 上传formdata封装的数据
			    dataType: 'JSON',
			    cache: false,                      // 不缓存
			    processData: false,                // jQuery不要去处理发送的数据
			    contentType: false,                // jQuery不要去设置Content-Type请求头
			    success:function (data) {           //成功回调
			        //console.log(data);
			    }
			});
	}
	 
	//添加内容
	function add_new() {
		var title = $("#title").val();
		var intro = $("#intro").val();
		var contentURL = $("#contentURL").val();
		
		if (isEmpty(title)) {
			huialertautohide("标题不能为空");
			return;
		} else if (isEmpty(intro)) {
			huialertautohide("简介不能为空");
			return;
		} else if (isEmpty(contentURL)) {
			huialertautohide("内容链接不能为空");
			return;
		}
		
		var formData = createFormData("uploadImgFile");
		if (formData == null) {
			huialertautohide("请选择需要上传的图片");
			return;
		}
		
		formData.append('title', title);
		formData.append('intro', intro);
		formData.append('contentURL', contentURL);
		uploadWithXMLHttpRequest(formData, function(responseText){
			var obj = JSON.parse(responseText); 
			console.log(obj);
			var code = obj["code"];
			console.log(code);
	      	if (obj["code"] == "1") {
	      		huialertautohide("添加成功");
	      		setTimeout(function(){ 
	      			user_add_close();
	      			window.location.href = "${ctx }/newsManager/news_listIndex.do"; 
	      		}, 1000);
	    	}
		});
		
	}
    </script>
<script type="text/javascript">
		/* 关闭当前弹出框 */
		function user_add_close(){
			var index=parent.layer.getFrameIndex(window.name);
			parent.layer.close(index);
		}
		function huialertautohide(str) {
			$.Huimodalalert(str, 2000);
		}
		//判断字符是否为空的方法
		function isEmpty(obj){
		    if(typeof obj == "undefined" || obj == null || obj.length == 0 || obj.replace(/(^s*)|(s*$)/g, "").length == 0) {
		        return true;
		    }else{
		        return false;
		    }
		}
	</script>