关于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 相关文章推荐
在网页中使用document.write时遭遇的奇怪问题
Aug 24 Javascript
jQuery 表单验证扩展(四)
Oct 20 Javascript
jQuery中ajax的使用与缓存问题的解决方法
Dec 19 Javascript
js动态创建及移除div的方法
Jun 03 Javascript
基于JavaScript如何实现ajax调用后台定义的方法
Dec 29 Javascript
实例讲解jquery中mouseleave和mouseout的区别
Feb 17 Javascript
jQuery基于ajax操作json数据简单示例
Jan 05 Javascript
深入理解vue路由的使用
Mar 24 Javascript
利用Mongoose让JSON数据直接插入或更新到MongoDB
May 03 Javascript
深入理解Vue官方文档梳理之全局API
Nov 22 Javascript
js动态获取时间的方法分析
Aug 02 Javascript
antd多选下拉框一行展示的实现方式
Oct 31 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设计模式中的工厂模式
2008/06/12 PHP
php相对当前文件include其它文件的方法
2015/03/13 PHP
php经典算法集锦
2015/11/14 PHP
在Yii2特定页面如何禁用调试工具栏Debug Toolbar详解
2017/08/07 PHP
PHP商品秒杀问题解决方案实例详解【mysql与redis】
2019/07/22 PHP
一页面多XMLHttpRequest对象
2007/01/22 Javascript
Prototype使用指南之selector.js说明
2008/10/26 Javascript
Jquery下的26个实用小技巧(jQuery tips, tricks & solutions)
2010/03/01 Javascript
对jQuery的事件绑定的一些思考(补充)
2013/04/20 Javascript
js onclick事件传参讲解
2013/11/06 Javascript
浅析JavaScript中的对象类型Object
2016/05/26 Javascript
AngularJS指令详解及示例代码
2016/08/16 Javascript
轻松掌握JavaScript中介者模式
2016/08/26 Javascript
BootStrap 表单控件之单选按钮水平排列
2017/05/23 Javascript
新手vue构建单页面应用实例代码
2017/09/18 Javascript
对vuex中store和$store的区别说明
2020/07/24 Javascript
[05:03]显微镜下的DOTA2第十期——Ti3豪之超神幽鬼
2014/06/23 DOTA
Django1.3添加app提示模块不存在的解决方法
2014/08/26 Python
Python利用带权重随机数解决抽奖和游戏爆装备问题
2016/06/16 Python
python中函数传参详解
2016/07/03 Python
Python+Socket实现基于UDP协议的局域网广播功能示例
2017/08/31 Python
python中实现精确的浮点数运算详解
2017/11/02 Python
Python中使用双下划线防止类属性被覆盖问题
2019/06/27 Python
python实现对服务器脚本敏感信息的加密解密功能
2019/08/13 Python
django 链接多个数据库 并使用原生sql实现
2020/03/28 Python
Python+redis通过限流保护高并发系统
2020/04/15 Python
Philosophy美国官网:美国美容品牌
2016/08/15 全球购物
番木瓜健康和保健产品第一大制造商:Herbal Papaya
2017/04/25 全球购物
英国布鲁姆精品店:Bloom Boutique
2018/03/01 全球购物
自主招生自荐信
2013/12/08 职场文书
高二生物教学反思
2014/01/27 职场文书
办公自动化专业大学生职业规划书
2014/03/06 职场文书
绩效考核实施方案
2014/03/18 职场文书
小学生毕业评语
2014/12/26 职场文书
运动会闭幕式主持词
2015/07/01 职场文书
MySQL慢查询优化解决问题
2022/03/17 MySQL