Android中Okhttp3实现上传多张图片同时传递参数


Posted in Javascript onFebruary 18, 2017

之前上传图片都是直接将图片转化为io流传给服务器,没有用框架传图片。

最近做项目,打算换个方法上传图片。

Android发展到现在,Okhttp显得越来越重要,所以,这次我选择用Okhttp上传图片。

Okhttp目前已经更新到Okhttp3版本了,用法跟之前相比,也有一些差别。在网上找了很多资料,

并和java后台同事反复调试,终于成功上传多张图片,同时传递一些键值对参数。

以下是我对该过程的封装:

private static final MediaType MEDIA_TYPE_PNG = MediaType.parse("image/png");

/**
   * 上传多张图片及参数
   * @param reqUrl URL地址
   * @param params 参数
   * @param pic_key 上传图片的关键字
   * @param paths 图片路径
   */
  public Observable<String> sendMultipart(String reqUrl,Map<String, String> params,String pic_key, List<File> files){
    return Observable.create(new Observable.OnSubscribe<String>(){

      @Override
      public void call(Subscriber<? super String> subscriber) {
        MultipartBody.Builder multipartBodyBuilder = new MultipartBody.Builder();
        multipartBodyBuilder.setType(MultipartBody.FORM);
        //遍历map中所有参数到builder
        if (params != null){
          for (String key : params.keySet()) {
            multipartBodyBuilder.addFormDataPart(key, params.get(key));
          }
        }
        //遍历paths中所有图片绝对路径到builder,并约定key如“upload”作为后台接受多张图片的key
        if (files != null){
          for (File file : files) {
            multipartBodyBuilder.addFormDataPart(pic_key, file.getName(), RequestBody.create(MEDIA_TYPE_PNG, file));
          }
        }
        //构建请求体
        RequestBody requestBody = multipartBodyBuilder.build();

        Request.Builder RequestBuilder = new Request.Builder();
        RequestBuilder.url(reqUrl);// 添加URL地址
        RequestBuilder.post(requestBody);
        Request request = RequestBuilder.build();
        mOkHttpClient.newCall(request).enqueue(new Callback() {
          @Override
          public void onFailure(Call call, IOException e) {
            subscriber.onError(e);
            subscriber.onCompleted();
            call.cancel();
          }

          @Override
          public void onResponse(Call call, Response response) throws IOException {
            String str = response.body().string();
            subscriber.onNext(str);
            subscriber.onCompleted();
            call.cancel();
          }
        });
      }
    });
  }

在UI界面的调用:

OkHttp3Utils.getInstance().sendMultipart(Constants.URL.URL_ADD_NOTICE, mMap, "appendix", mImageList)
        .observeOn(AndroidSchedulers.mainThread())
        .subscribeOn(Schedulers.newThread())
        .subscribe(new Subscriber<String>() {
          @Override
          public void onCompleted() {

          }

          @Override
          public void onError(Throwable throwable) {
            LogUtil.i(TAG, "throwable:" + throwable.toString());
          }

          @Override
          public void onNext(String s) {
            
            LogUtil.i(TAG, "s:" + s);
          }
        });

调试过程中,有一次将 multipartBodyBuilder.addFormDataPart(pic_key, file.getName(), RequestBody.create(MEDIA_TYPE_PNG, file));写成了 multipartBodyBuilder.addFormDataPart(pic_key, null, RequestBody.create(MEDIA_TYPE_PNG, file));导致后台无法用常规方法获取图片(虽然断点调试时也能看到图片数据),这点需要注意。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
sencha touch 模仿tabpanel导航栏TabBar的实例代码
Oct 24 Javascript
jquery获取当前点击对象的value方法
Feb 28 Javascript
js实现按钮加背景图片常用方法
Nov 01 Javascript
jquery插件jquery.beforeafter.js实现左右拖拽分隔条对比图片的方法
Aug 07 Javascript
jQuery之动画效果大全
Nov 09 Javascript
fullCalendar中文API官方文档
Feb 07 Javascript
微信小程序 详解页面跳转与返回并回传数据
Feb 13 Javascript
SVG描边动画
Feb 23 Javascript
vue轮播图插件vue-awesome-swiper的使用代码实例
Jul 10 Javascript
如何理解Vue的作用域插槽的实现原理
Aug 19 Javascript
基于Vue 2.0的模块化前端 UI 组件库小结
Dec 21 Javascript
vue实现微信分享功能
Nov 28 Javascript
AngularJS表单提交实例详解
Feb 18 #Javascript
JS实现控制图片显示大小的方法【图片等比例缩放功能】
Feb 18 #Javascript
JS实现数组去重复值的方法示例
Feb 18 #Javascript
bootstarp modal框居中显示的实现代码
Feb 18 #Javascript
JS实现本地存储信息的方法(基于localStorage与userData)
Feb 18 #Javascript
JS表单数据验证的正则表达式(常用)
Feb 18 #Javascript
JavaScript实现的鼠标响应颜色渐变效果完整实例
Feb 18 #Javascript
You might like
phpmyadmin操作流程
2006/10/09 PHP
PHP使用fopen与file_get_contents读取文件实例分享
2016/03/04 PHP
php使用pthreads v3多线程实现抓取新浪新闻信息操作示例
2020/02/21 PHP
Javascript 生成指定范围数值随机数
2009/01/09 Javascript
Javascript 继承机制实例
2009/08/12 Javascript
jquery遍历checkbox介绍
2014/02/21 Javascript
JavaScript设计模式之观察者模式(发布者-订阅者模式)
2014/09/24 Javascript
基于JavaScript获取鼠标位置的各种方法
2015/12/16 Javascript
详解JavaScript中localStorage使用要点
2016/01/13 Javascript
jQuery文字提示与图片提示效果实现方法
2016/07/04 Javascript
微信小程序前端源码逻辑和工作流
2016/09/25 Javascript
JS处理数据四舍五入(tofixed与round的区别详解)
2017/10/26 Javascript
jQuery实现购物车的总价计算和总价传值功能
2018/11/28 jQuery
jQuery实现验证用户登录
2019/12/10 jQuery
Vue开发中常见的套路和技巧总结
2020/11/24 Vue.js
Python完全新手教程
2007/02/08 Python
java直接调用python脚本的例子
2014/02/16 Python
Linux CentOS7下安装python3 的方法
2018/01/21 Python
Python通过属性手段实现只允许调用一次的示例讲解
2018/04/21 Python
Django 多语言教程的实现(i18n)
2018/07/07 Python
详解python 条件语句和while循环的实例代码
2020/12/28 Python
工程师岗位职责
2013/11/08 职场文书
幼儿园大班新学期寄语
2014/01/18 职场文书
小学开学典礼主持词
2014/03/19 职场文书
《苏珊的帽子》教学反思
2014/04/07 职场文书
银行求职信
2014/05/31 职场文书
计算机专业毕业生自荐书
2014/06/02 职场文书
2015年社区综治工作总结
2015/04/21 职场文书
幼儿园教师安全责任书
2015/05/08 职场文书
2015年支教教师工作总结
2015/07/22 职场文书
环保建议书作文300字
2015/09/14 职场文书
教师个人工作总结范文2015
2015/10/14 职场文书
nginx 防盗链防爬虫配置详解
2021/03/31 Servers
MyBatis-Plus 批量插入数据的操作方法
2021/09/25 Java/Android
Python实现批量将文件复制到新的目录中再修改名称
2022/04/12 Python
如何优化vue打包文件过大
2022/04/13 Vue.js