1.首先需要导包,注意还需要导io包,因为图片要转化为流的形式保存
2.定义uploadController和uploadService并在页面引入
因为页面已经定义了一个controller,所以不能在定义了,每个页面只能绑定一个controller,我们可以让这个controller继承uploadController,这样他就可以使用upload中的方法了.
//控制层
app.controller('uploadController' ,function($scope,$controller,uploadService){
$controller('baseController',{$scope:$scope});//继承
//读取列表数据绑定到表单中
$scope.fileUpload=function(){
uploadService.fileUpload().success(
function(response){
$scope.image_entity.url = response.message;
}
);
}
});
//服务层
app.service('uploadService',function($http){
//读取列表数据绑定到表单中
this.fileUpload=function(){
var formData = new FormData();
formData.append('file',file.files[0]);
return $http({
method:'POST',
url:'../file/upload.do',
data:formData,
headers:{'Content-Type':undefined}, // undefined mulipart-from/data
transformRequest:angular.identify
});
}
});
封装一个对象,包含颜色和图片路径属性
页面控制层
页面业务层,模拟form表单上传图片,return是一个ajax形式的写法
后台控制层
工具类FastDFSClient
package com.offcn.util;
import org.csource.common.NameValuePair;
import org.csource.fastdfs.ClientGlobal;
import org.csource.fastdfs.StorageClient1;
import org.csource.fastdfs.StorageServer;
import org.csource.fastdfs.TrackerClient;
import org.csource.fastdfs.TrackerServer;
public class FastDFSClient {
private TrackerClient trackerClient = null;
private TrackerServer trackerServer = null;
private StorageServer storageServer = null;
private StorageClient1 storageClient = null;
public FastDFSClient(String conf) throws Exception {
if (conf.contains("classpath:")) {
conf = conf.replace("classpath:", this.getClass().getResource("/").getPath());
}
ClientGlobal.init(conf);
trackerClient = new TrackerClient();
trackerServer = trackerClient.getConnection();
storageServer = null;
storageClient = new StorageClient1(trackerServer, storageServer);
}
/**
* 上传文件方法
* <p>Title: uploadFile</p>
* <p>Description: </p>
* @param fileName 文件全路径
* @param extName 文件扩展名,不包含(.)
* @param metas 文件扩展信息
* @return
* @throws Exception
*/
public String uploadFile(String fileName, String extName, NameValuePair[] metas) throws Exception {
String result = storageClient.upload_file1(fileName, extName, metas);
return result;
}
public String uploadFile(String fileName) throws Exception {
return uploadFile(fileName, null, null);
}
public String uploadFile(String fileName, String extName) throws Exception {
return uploadFile(fileName, extName, null);
}
/**
* 上传文件方法
* <p>Title: uploadFile</p>
* <p>Description: </p>
* @param fileContent 文件的内容,字节数组
* @param extName 文件扩展名
* @param metas 文件扩展信息
* @return
* @throws Exception
*/
public String uploadFile(byte[] fileContent, String extName, NameValuePair[] metas) throws Exception {
String result = storageClient.upload_file1(fileContent, extName, metas);
return result;
}
public String uploadFile(byte[] fileContent) throws Exception {
return uploadFile(fileContent, null, null);
}
public String uploadFile(byte[] fileContent, String extName) throws Exception {
return uploadFile(fileContent, extName, null);
}
}
配置文件
springmvc中必须要添加MultipartResolver否则会报错java.lang.IllegalArgumentException: Expected MultipartHttpServletRequest:
is
a MultipartResolver configured?