关于webuploader插件使用过程遇到的小问题


Posted in Javascript onNovember 07, 2016

本文为大家解决webuploader上传插件如何自定义参数的问题,供大家参考,具体内容如下

大致架构:

 前端:html5+ajax

 后端:java (struts框架相关)

碰到问题:

后台coder给我提供一个接口./file/uploader.do?upFile=?,让我上传文件对应upFile这个参数,前端使用的是webuploader这个上传插件,并不知道这个东西怎么自定义参数。经过各种google,百度,找到以下两种解决方案:

1、接口不需要指明参数,直接用request.getInputStream()二进制的方式来接受上传的文件,但是这里特别注意,需要将webuploader这个配置

sendAsBinary改为true

var uploader = WebUploader.create({
      swf: './js/webuploader/Uploader.swf',
      server: common.BASE_URL_DEV+'/file/upload.do',
      pick: '#picker',
      duplicate: false,
      resize: false,
      auto: true,
      fileNumLimit: 5,
      sendAsBinary:true, //指明使用二进制的方式上传文件
      fileSingleSizeLimit: 5242880,
      //fileType:'rar,zip,doc,xls,docx,xlsx,pdf'
      accept: {
        title: 'intoTypes',
        extensions: 'rar,zip,doc,xls,docx,xlsx,pdf',
        mimeTypes: '.rar,.zip,.doc,.xls,.docx,.xlsx,.pdf'
      }
    });

2、使用common-fileupload这个插件接收,不多说(后端coder自知,提供相关文档一份:https://3water.com/article/94780.htm)

而在网上翻资料的时候看到很多朋友都在问,java后端怎么写?怎么接受参数?这里本人已经实践了一次,为大家做解答,首先感谢我们的后端coder,让我豁然开朗:

当我我给他接口不传参数的时候上传文件,他那里看到的tomcat日志打印出来了三个参数,分别是file,fileContentType,fileFileNamez这三个参数,file这个参数经过调试,是我传过去的文件,然后我们就猜测是不是有一个默认参数叫做“file”,去webuploader这个api中经过搜索证明了我们的猜测是正确的,如下图:

关于webuploader插件使用过程遇到的小问题

果然有一个默认参数叫做"file".....................

至此此问题迎刃而解,贴如下代码:

var uploader = WebUploader.create({
      swf: './js/webuploader/Uploader.swf',
      server: common.BASE_URL_DEV+'/file/upload.do',
      pick: '#picker',
      duplicate: false,
      resize: false,
      auto: true,
      fileNumLimit: 5,
      fileVal:"upload",  //指明参数名称,后台也用这个参数接收文件
      fileSingleSizeLimit: 5242880,
      //fileType:'rar,zip,doc,xls,docx,xlsx,pdf'
      accept: {
        title: 'intoTypes',
        extensions: 'rar,zip,doc,xls,docx,xlsx,pdf',
        mimeTypes: '.rar,.zip,.doc,.xls,.docx,.xlsx,.pdf'
      }
    });

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

Javascript 相关文章推荐
利用javascript实现一些常用软件的下载导航
Aug 03 Javascript
IE与firefox下Dhtml的一些区别小结
Dec 02 Javascript
jquery使用淘宝接口跨域查询手机号码归属地实例
Nov 28 Javascript
移动端 一个简单易懂的弹出框
Jul 06 Javascript
基于Bootstrap实现下拉菜单项和表单导航条(两个菜单项,一个下拉菜单和登录表单导航条)
Jul 22 Javascript
深入理解Node.js 事件循环和回调函数
Nov 02 Javascript
JavaScript之Vue.js【入门基础】
Dec 06 Javascript
重新理解JavaScript的六种继承方式
Mar 24 Javascript
JS实现Cookie读、写、删除操作工具类示例
Aug 28 Javascript
vue安装遇到的5个报错及解决方法
Jun 12 Javascript
JS数组方法reduce的用法实例分析
Mar 03 Javascript
nuxt.js 在middleware(中间件)中实现路由鉴权操作
Nov 06 Javascript
jQuery webuploader分片上传大文件
Nov 07 #Javascript
快速掌握jQuery插件WebUploader文件上传
Nov 07 #Javascript
jquery.validate表单验证插件使用方法解析
Nov 07 #Javascript
功能强大的jquery.validate表单验证插件
Nov 07 #Javascript
JS 实现Base64编码与解码实例详解
Nov 07 #Javascript
百度多文件异步上传控件webuploader基本用法解析
Nov 07 #Javascript
Angularjs的Controller间通信机制实例分析
Nov 07 #Javascript
You might like
php使用递归计算文件夹大小
2014/12/24 PHP
php使用fputcsv()函数csv文件读写数据的方法
2015/01/06 PHP
如何把php5.3版本升级到php5.4或者php5.5
2015/07/31 PHP
php图片水印添加、压缩、剪切的封装类实现
2020/04/18 PHP
PHP实现数组转JSon和JSon转数组的方法示例
2018/06/14 PHP
js事件冒泡实例分享(已测试)
2013/04/23 Javascript
javascript 实现字符串反转的三种方法
2013/11/23 Javascript
JS判断文本框内容改变事件的简单实例
2014/03/07 Javascript
jquery实现的导航固定效果
2014/04/28 Javascript
JavaScript自定义数组排序方法
2015/02/12 Javascript
Angular在一个页面中使用两个ng-app的方法
2017/02/20 Javascript
node.js入门教程之querystring模块的使用方法
2017/02/27 Javascript
Echarts基本用法_动力节点Java学院整理
2017/08/11 Javascript
vue-cli3 karma单元测试的实现
2019/01/18 Javascript
2019最新21个MySQL高频面试题介绍
2020/02/06 Javascript
js删除指定位置超链接中含有百度与360的标题
2021/01/06 Javascript
[02:38]DOTA2亚洲邀请赛小组赛精彩集锦:Wings完美团击溃对手
2017/03/29 DOTA
Python标准库之随机数 (math包、random包)介绍
2014/11/25 Python
Python给你的头像加上圣诞帽
2018/01/04 Python
Python中实例化class的执行顺序示例详解
2018/10/14 Python
pyqt5 使用cv2 显示图片,摄像头的实例
2019/06/27 Python
详解将Pandas中的DataFrame类型转换成Numpy中array类型的三种方法
2019/07/06 Python
Python内存管理实例分析
2019/07/10 Python
python hough变换检测直线的实现方法
2019/07/12 Python
django 环境变量配置过程详解
2019/08/06 Python
CSS3 Columns分列式布局方法简介
2014/05/03 HTML / CSS
HTML5实现桌面通知 提示功能
2017/10/11 HTML / CSS
英国家电直销:Appliances Direct
2016/09/22 全球购物
澳大利亚最大的百货公司:Myer
2018/12/21 全球购物
俄罗斯香水在线商店:AromaCode
2019/12/04 全球购物
JAVA语言如何进行异常处理,关键字:throws,throw,try,catch,finally分别代表什么意义?在try块中可以抛出异常吗?
2013/07/02 面试题
成功经营餐厅的创业计划书范文
2013/12/26 职场文书
迟到检讨书400字
2014/01/13 职场文书
文秘班元旦晚会活动策划方案
2014/08/28 职场文书
2014年远程教育工作总结
2014/12/09 职场文书
工程部主管岗位职责
2015/02/12 职场文书