前面我们讲了如何通过 volley 实现表单的提交,而这篇文章跟上1篇衔接很大,如果没有看上1篇 blog 的朋友,建议先去看看 Android Volley解析(2)之表单提交篇
由于文件上传实质就是表单的提交,只不过它提交的数据包括文件类型,接下来还是依照表单提交的套路来分析。
这里我们通过图片上传的案例来分析,其他文件也是一样的实现方式;以下是我在传图网传图时,上传的数据格式,先来分析1下
POST http://chuantu.biz/upload.php HTTP/1.1
Host: chuantu.biz
Connection: keep-alive
Content-Length: 4459
Cache-Control: max-age=0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
Origin: http://chuantu.biz
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.93 Safari/537.36
Content-Type: multipart/form-data; boundary=----WebKitFormBoundaryS4nmHw9nb2Eeusll
Referer: http://chuantu.biz/
Accept-Encoding: gzip, deflate
Accept-Language: zh-CN,zh;q=0.8
Cookie: __cfduid=d9215d649e6e648e0eac7688b406a3d911425089350
------WebKitFormBoundaryS4nmHw9nb2Eeusll
Content-Disposition: form-data; name="uploadimg"; filename="spark_bg.png"
Content-Type: image/png
JFIFC
%# , #&')*)-0-(0%()(C
((((((((((((((((((((((((((((((((((((((((((((((((((("
}!1AQa"q2#BR$3br
%&'()*456789:CDEFGHIJSTUVWXYZcdefghijstuvwxyz
w!1AQaq"2B #3Rbr
$4%&'()*56789:CDEFGHIJSTUVWXYZcdefghijstuvwxyz?PNG
------WebKitFormBoundaryS4nmHw9nb2Eeusll--
不难发现,这类格式跟表单提交的格式非常接近,不过还是有所差别,这里仔细看还是能看出来总共有加上结尾行,有5行,由于乱码部份,其实就是图片的2进制数,全部算1行;下面来分析下:
1、第1行:"--" + boundary + "
"
;
前面也说了文件上传,其实就是表单提交,所以在提交数据的开始标志不变;
2、第2行:Content-Disposition: form-data; name="参数的名称"; filename="上传的文件名" + "
"
这里比普通的表单多了1个filename=”上传的文件名”;
3、第3行:Content-Type: 文件的 mime 类型 + "
"
这1行是文件上传必须要的,而普通的文字提交可有可无,mime 类型需要根据文档查询;
4、第4行:"
"
5、第5行文件的2进制数据 + "
"
:
这里跟普通表单提交1样;
结尾行:"--" + boundary + "--" + "
"
可以看到,文件上传的诗句格式跟我们上1篇博文中讲到的表单提交只有两个地方不同,1、第2行的时候增加了1个文件名变量,2、增加了1行Content-Type: 文件的 mime 类型 + "
"
;
文件也能够同时上传多个文件,上传多个文件的时候重复1、2、3、4、5步,在最后的1个文件的末尾加上统1的结束行。
这里是对图片操作所以我建了1个FormImg.java
/**
* Created by moon.zhong on 2015/3/3.
*/
public class FormImage {
//参数的名称
private String mName ;
//文件名
private String mFileName ;
//文件的 mime,需要根据文档查询
private String mMime ;
//需要上传的图片资源,由于这里测试为了方便起见,直接把 bigmap 传进来,真正在项目中1般不会这般做,而是把图片的路径传过来,在这里对图片进行2进制转换
private Bitmap mBitmap ;
public FormImage(Bitmap mBitmap) {
this.mBitmap = mBitmap;
}
public String getName() {
// return mName;
//测试,把参数名称写死
return "uploadimg" ;
}
public String getFileName() {
//测试,直接写死文件的名字
return "test.png";
}
//对图片进行2进制转换
public byte[] getValue() {
ByteArrayOutputStream bos = new ByteArrayOutputStream() ;
mBitmap.compress(Bitmap.CompressFormat.JPEG,80,bos) ;
return bos.toByteArray();
}
//由于我知道是 png 文件,所以直接根据文档查的
public String getMime() {
return "image/png";
}
}
/**
* Created by gyzhong on 15/3/1.
*/
public class PostUploadRequest extends Request<String> {
/**
* 正确数据的时候回掉用
*/
private ResponseListener mListener ;
/*要求 数据通过参数的情势传入*/
private List<FormImage> mListItem ;
private String BOUNDARY = "-------------⑸20⑴3⑴4"; //数据分隔线
private String MULTIPART_FORM_DATA = "multipart/form-data";
public PostUploadRequest(String url, List<FormImage> listItem, ResponseListener listener) {
super(Method.POST, url, listener);
this.mListener = listener ;
setShouldCache(false);
mListItem = listItem ;
//设置要求的响应事件,由于文件上传需要较长的时间,所以在这里加大了,设为5秒
setRetryPolicy(new DefaultRetryPolicy(5000,DefaultRetryPolicy.DEFAULT_MAX_RETRIES,DefaultRetryPolicy.DEFAULT_BACKOFF_MULT));
}
/**
* 这里开始解析数据
* @param response Response from the network
* @return
*/
@Override
protected Response<String> parseNetworkResponse(NetworkResponse response) {
try {
String mString =
new String(response.data, HttpHeaderParser.parseCharset(response.headers));
Log.v("zgy", "====mString===" + mString);
return Response.success(mString,
HttpHeaderParser.parseCacheHeaders(response));
} catch (UnsupportedEncodingException e) {
return Response.error(new ParseError(e));
}
}
/**
* 回调正确的数据
* @param response The parsed response returned by
*/
@Override
protected void deliverResponse(String response) {
mListener.onResponse(response);
}
@Override
public byte[] getBody() throws AuthFailureError {
if (mListItem == null||mListItem.size() == 0){
return super.getBody() ;
}
ByteArrayOutputStream bos = new ByteArrayOutputStream() ;
int N = mListItem.size() ;
FormImage formImage ;
for (int i = 0; i < N ;i++){
formImage = mListItem.get(i) ;
StringBuffer sb= new StringBuffer() ;
/*第1行*/
//`"--" + BOUNDARY + "
"`
sb.append("--"+BOUNDARY);
sb.append("
") ;
/*第2行*/
//Content-Disposition: form-data; name="参数的名称"; filename="上传的文件名" + "
"
sb.append("Content-Disposition: form-data;");
sb.append(" name="");
sb.append(formImage.getName()) ;
sb.append(""") ;
sb.append("; filename="") ;
sb.append(formImage.getFileName()) ;
sb.append(""");
sb.append("
") ;
/*第3行*/
//Content-Type: 文件的 mime 类型 + "
"
sb.append("Content-Type: ");
sb.append(formImage.getMime()) ;
sb.append("
") ;
/*第4行*/
//"
"
sb.append("
") ;
try {
bos.write(sb.toString().getBytes("utf⑻"));
/*第5行*/
//文件的2进制数据 + "
"
bos.write(formImage.getValue());
bos.write("
".getBytes("utf⑻"));
} catch (IOException e) {
e.printStackTrace();
}
}
/*结尾行*/
//`"--" + BOUNDARY + "--" + "
"`
String endLine = "--" + BOUNDARY + "--" + "
" ;
try {
bos.write(endLine.toString().getBytes("utf⑻"));
} catch (IOException e) {
e.printStackTrace();
}
Log.v("zgy","=====formImage====
"+bos.toString()) ;
return bos.toByteArray();
}
//Content-Type: multipart/form-data; boundary=---------⑻888888888888
@Override
public String getBodyContentType() {
return MULTIPART_FORM_DATA+"; boundary="+BOUNDARY;
}
}
由于代码中注解写的比较详细,加上很多东西在前面几篇 blog 已讲过了,所以这里直接上代码。
/**
* Created by moon.zhong on 2015/3/3.
*/
public class UploadApi {
/**
* 上传图片接口
* @param bitmap 需要上传的图片
* @param listener 要求回调
*/
public static void uploadImg(Bitmap bitmap,ResponseListener listener){
List<FormImage> imageList = new ArrayList<FormImage>() ;
imageList.add(new FormImage(bitmap)) ;
Request request = new PostUploadRequest(Constant.UploadHost,imageList,listener) ;
VolleyUtil.getRequestQueue().add(request) ;
}
}
上传类PostUploadActivity.java
/**
* Created by moon.zhong on 2015/3/2.
*/
public class PostUploadActivity extends ActionBarActivity {
private TextView mShowResponse ;
private ImageView mImageView ;
private ProgressDialog mDialog ;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_upload_img);
mShowResponse = (TextView) findViewById(R.id.id_show_response) ;
mImageView = (ImageView) findViewById(R.id.id_show_img) ;
mDialog = new ProgressDialog(this) ;
mDialog.setCanceledOnTouchOutside(false);
}
public void uploadImg(View view){
mDialog.setMessage("图片上传中...");
mDialog.show();
Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.mipmap.logo) ;
UploadApi.uploadImg(bitmap,new ResponseListener<String>() {
@Override
public void onErrorResponse(VolleyError error) {
Log.v("zgy","===========VolleyError========="+error) ;
mShowResponse.setText("ErrorResponse
"+error.getMessage());
Toast.makeText(PostUploadActivity.this,"上传失败",Toast.LENGTH_SHORT).show() ;
mDialog.dismiss();
}
@Override
public void onResponse(String response) {
response = response.substring(response.indexOf("img src="http://www.wfuyu.com/uploadfile/cj/20150307/));
response = response.substring(8,response.indexOf("/>")) ;
Log.v("zgy","===========onResponse========="+response) ;
mShowResponse.setText("图片地址:
"+response);
mDialog.dismiss();
Toast.makeText(PostUploadActivity.this,"上传成功",Toast.LENGTH_SHORT).show();
}
}) ;
}
}
测试结果以下:
上传图片页面:
图片上传中
图片上传成功,地址为http://www.chuantu.biz/t/67/1425474351x⑴376440163.png
通过网页要求
可以看到,volley 实现文件上传的操作还是很方便的,不过,不知道大家看到这里有无觉得哪里有问题呢?其实 volley 实现文件上传是有1个很大的问题,甚么问题呢,大家自己先想一想,我将会在后续的文章中讲到这个问题,并提供解决方案(是后续,不是下1篇)。volley 讲到这里为止,对它的功能也讲了1大部份,不过还有1个非常有用的知识点没有讲到,那就是volley缓存机制,下1节,将开启 volley 的缓存之旅,敬请期待!
点击下载源码