关于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中this的使用详解
Nov 08 Javascript
Javascript中的arguments与重载介绍
Mar 15 Javascript
JQuery判断radio(单选框)是否选中和获取选中值方法总结
Apr 15 Javascript
不想让浏览器运行javascript脚本的方法
Nov 20 Javascript
Bootstrap 最常用的JS插件系列总结(图片轮播、标签切换等)
Jul 14 Javascript
深入理解React中es6创建组件this的方法
Aug 29 Javascript
JS实现可编辑的后台管理菜单功能【附demo源码下载】
Sep 13 Javascript
一个有意思的鼠标点击文字特效jquery代码
Sep 23 jQuery
Angular ng-animate和ng-cookies用法详解
Apr 18 Javascript
jquery判断滚动条距离顶部的距离方法
Sep 05 jQuery
js console.log打印对象时属性缺失的解决方法
May 23 Javascript
js实现点击图片在屏幕中间弹出放大效果
Sep 11 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中\r \r\n \t的区别示例介绍
2014/02/08 PHP
学习php设计模式 php实现抽象工厂模式
2015/12/07 PHP
javascript new 需不需要继续使用
2009/07/02 Javascript
js设置组合快捷键/tabindex功能的方法
2013/11/21 Javascript
js的参数有长度限制吗?发现不能超过2083个字符
2014/04/20 Javascript
JavaScript中停止执行setInterval和setTimeout事件的方法
2015/05/14 Javascript
React.js入门实例教程之创建hello world 的5种方式
2016/05/11 Javascript
JavaScript 最佳实践:帮你提升代码质量
2016/12/03 Javascript
详解微信小程序 template添加绑定事件
2017/06/23 Javascript
VUE实现一个分页组件的示例
2017/09/13 Javascript
vue2.0模拟锚点的实例
2018/03/14 Javascript
使用angularjs.foreach时return的问题解决
2018/09/30 Javascript
基于Node的Axure文件在线预览的实现代码
2019/08/28 Javascript
[35:44]2014 DOTA2华西杯精英邀请赛 5 24 iG VS VG
2014/05/26 DOTA
[01:00:49]DOTA2-DPC中国联赛 正赛 Ehome vs iG BO3 第二场 1月31日
2021/03/11 DOTA
python 巧用正则寻找字符串中的特定字符的位置方法
2018/05/02 Python
Python smtplib实现发送邮件功能
2018/05/22 Python
Python函数式编程指南:对生成器全面讲解
2019/11/19 Python
解决Python spyder显示不全df列和行的问题
2020/04/20 Python
django模板获取list中指定索引的值方式
2020/05/14 Python
学python最电脑配置有要求么
2020/07/05 Python
python爬虫爬取网页数据并解析数据
2020/09/18 Python
python代码实现图书管理系统
2020/11/30 Python
Python3+Flask安装使用教程详解
2021/02/16 Python
使用jTopo给Html5 Canva中绘制的元素添加鼠标事件
2014/05/15 HTML / CSS
Street One瑞士:德国现代时装公司
2019/10/09 全球购物
sealed修饰符是干什么的
2012/10/23 面试题
初一英语教学反思
2014/01/11 职场文书
运动会入场解说词300字
2014/01/25 职场文书
财务总监管理岗位职责
2014/03/08 职场文书
租车协议书范本
2014/04/22 职场文书
珍惜资源保护环境的建议书
2014/05/14 职场文书
药剂专业自荐书
2014/06/20 职场文书
2016自主招生教师推荐信范文
2015/03/23 职场文书
2015年仓库管理工作总结
2015/05/25 职场文书
springcloud整合seata
2022/05/20 Java/Android