关于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高级程序设计(第3版)学习笔记13 ECMAScript5新特性
Oct 11 Javascript
javascript 用函数语句和表达式定义函数的区别详解
Jan 06 Javascript
js获取浏览器基本信息大全
Nov 27 Javascript
jQuery中innerWidth()方法用法实例
Jan 19 Javascript
jQuery操作JSON的CRUD用法实例
Feb 25 Javascript
jQuery插件bxSlider实现响应式焦点图
Apr 12 Javascript
JavaScript给input的value赋值引发的关于基本类型值和引用类型值问题
Dec 07 Javascript
Node.js 日志处理模块log4js
Aug 28 Javascript
Vue.js动态添加、删除选题的实例代码
Sep 30 Javascript
微信小程序radio组件使用详解
Jan 31 Javascript
JavaScript实现的鼠标跟随特效示例【2则实例】
Dec 22 Javascript
浅谈Vue2.4.0 $attrs与inheritAttrs的具体使用
Mar 08 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中的观察者模式
2010/03/24 PHP
使用array mutisort 实现按某字段对数据排序
2013/06/18 PHP
PHP错误Cannot use object of type stdClass as array in错误的解决办法
2014/06/12 PHP
php实现搜索一维数组元素并删除二维数组对应元素的方法
2015/07/06 PHP
php可变长参数处理函数详解
2017/02/22 PHP
Extjs列表详细信息窗口新建后自动加载解决方法
2010/04/02 Javascript
IE6,IE7,IE8下使用Javascript记录光标选中范围(已补全)
2011/08/28 Javascript
document.createElement()用法及注意事项(ff下不兼容)
2013/03/13 Javascript
js 3种归并操作的实例代码
2013/10/30 Javascript
php的文件上传入门教程(实例讲解)
2014/04/10 Javascript
jQuery函数的第二个参数获取指定上下文中的DOM元素
2014/05/19 Javascript
JS中如何判断传过来的JSON数据中是否存在某字段
2014/08/18 Javascript
Javascript毫秒数用法实例
2015/02/05 Javascript
在JavaScript中使用对数Math.log()方法的教程
2015/06/15 Javascript
Underscore.js 1.3.3 中文注释翻译说明
2015/06/25 Javascript
jQuery使用模式窗口实现在主页面和子页面中互相传值的方法
2016/03/01 Javascript
jquery分页插件jquery.pagination.js使用方法解析
2016/04/01 Javascript
深入理解JavaScript中的预解析
2017/01/04 Javascript
Angularjs实现搜索关键字高亮显示效果
2017/01/17 Javascript
js实现显示手机号码效果
2017/03/09 Javascript
mpvue开发音频类小程序踩坑和建议详解
2019/03/12 Javascript
微信小程序3种位置API的使用方法详解
2019/08/05 Javascript
[02:11]2014DOTA2 TI专访VG战队Fenrir:队伍气氛良好
2014/07/11 DOTA
使用python BeautifulSoup库抓取58手机维修信息
2013/11/21 Python
Python中文分词实现方法(安装pymmseg)
2016/06/14 Python
基于python(urlparse)模板的使用方法总结
2017/10/13 Python
Python 用Redis简单实现分布式爬虫的方法
2017/11/23 Python
浅谈机器学习需要的了解的十大算法
2017/12/15 Python
python机器学习之随机森林(七)
2018/03/26 Python
python pandas 对时间序列文件处理的实例
2018/06/22 Python
用python生成(动态彩色)二维码的方法(使用myqr库实现)
2019/06/24 Python
Python使用Pandas对csv文件进行数据处理的方法
2019/08/01 Python
Python pandas RFM模型应用实例详解
2019/11/20 Python
你对IPv6了解程度
2016/02/09 面试题
展会邀请函范文
2014/01/26 职场文书
学习党的群众路线教育实践活动心得体会范文
2014/11/03 职场文书