关于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 相关文章推荐
js利用数组length属性清空和截短数组的小例子
Jan 15 Javascript
js动态改变select选择变更option的index值示例
Jul 10 Javascript
Javascript无参数和有参数类继承问题解决方法
Mar 02 Javascript
详解JavaScript正则表达式之RegExp对象
Dec 13 Javascript
适用于javascript开发者的Processing.js入门教程
Feb 24 Javascript
JS+Canvas绘制时钟效果
Aug 20 Javascript
jQuery扩展+xml实现表单验证功能的方法
Dec 25 Javascript
js图片放大镜效果实现方法详解
Oct 28 Javascript
微信小程序本地缓存数据增删改查实例详解
May 24 Javascript
微信小程序实现文件、图片上传功能
Aug 18 Javascript
解决vue里a标签值解析变量,跳转页面,前面加默认域名端口的问题
Jul 22 Javascript
element-ui tree结构实现增删改自定义功能代码
Aug 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自定义函数之递归删除文件及目录
2010/08/08 PHP
PHP+Ajax实现验证码的实时验证
2016/07/20 PHP
根据key删除数组中指定的元素实现方法
2017/03/02 PHP
javascript生成随机数的方法
2014/05/16 Javascript
javascript获取本机操作系统类型的方法
2015/08/13 Javascript
jquery实现简单的全选和反选功能
2016/01/02 Javascript
JavaScript数据推送Comet技术详解
2016/04/07 Javascript
JS JSOP跨域请求实例详解
2016/07/04 Javascript
Angular2.js实现表单验证详解
2017/06/23 Javascript
js前端导出Excel的方法
2017/11/01 Javascript
Vue实现搜索 和新闻列表功能简单范例
2018/03/16 Javascript
vue基于mint-ui实现城市选择三级联动
2020/06/30 Javascript
微信小程序实现pdf、word等格式文件上传的方法
2019/09/10 Javascript
vue elementUI 表单校验的实现代码(多层嵌套)
2019/11/06 Javascript
Vue环境搭建+VSCode+Win10的详细教程
2020/08/19 Javascript
使用vue3重构拼图游戏的实现示例
2021/01/25 Vue.js
python网络编程学习笔记(一)
2014/06/09 Python
Python3基础之基本运算符概述
2014/08/13 Python
python删除不需要的python文件方法
2018/04/24 Python
python+selenium实现简历自动刷新的示例代码
2019/05/20 Python
ZABBIX3.2使用python脚本实现监控报表的方法
2019/07/02 Python
Python3常用内置方法代码实例
2019/11/18 Python
将matplotlib绘图嵌入pyqt的方法示例
2020/01/08 Python
简单了解python filter、map、reduce的区别
2020/01/14 Python
Pycharm及python安装详细步骤及PyCharm配置整理(推荐)
2020/07/31 Python
Python编写万花尺图案实例
2021/01/03 Python
html5如何及时更新缓存文件(js、css或图片)
2013/06/24 HTML / CSS
赫里福德的一家乡村零售商店:Philip Morris & Son
2017/06/25 全球购物
英国玛莎百货美国官网:Marks & Spencer美国
2018/11/06 全球购物
如何实现一个自定义类的序列化
2012/05/22 面试题
高级工程师岗位职责
2013/12/15 职场文书
汽车装潢店创业计划书范文
2014/02/05 职场文书
法定授权委托证明书
2014/09/27 职场文书
优秀高中学生评语
2014/12/30 职场文书
2016年国庆节假期旅游工作总结
2016/04/01 职场文书
css3 实现文字闪烁效果的三种方式示例代码
2021/04/25 HTML / CSS