thinkjs 文件上传功能实例代码


Posted in Javascript onNovember 08, 2017

介绍

ThinkJS 是一款面向未来开发的 Node.js 框架,整合了大量的项目最佳实践,让企业级开发变得如此简单、高效。从 3.0 开始,框架底层基于 Koa 2.x 实现,兼容 Koa 的所有功能。

特性

  • 基于 Koa 2.x,兼容 middleware
  • 内核小巧,支持 Extend、Adapter 等插件方式
  • 性能优异,单元测试覆盖程度高
  • 内置自动编译、自动更新机制,方便快速开发
  • 使用更优雅的 async/await 处理异步问题,不再支持 */yield
  • 从 3.2 开始支持 TypeScript

架构

thinkjs 文件上传功能实例代码

thinkjs是360公司出的一个基于nodejs的mvc框架,本文采用thinkjs写后端,具体代码如下:

let formdata = new FormData($('form')[0]);
  $('#fileUpload').submit(function (e) {
    e.preventDefault();
    var data = new FormData($(this)[0]);
    $.ajax({
      url: '/themestore/upload/theme',
      type: 'POST',
      data: data,
      async: false, //发送同步请求(默认为TRUE)
      cache: false, //不同浏览器缓存中加载请求信息(默认为true)
      contentType: false, //内容编码格式
      processData: false,
/*要求为Boolean类型的参数,默认为true。默认情况下,发送的数据将被转换为对象(从技术角度来讲并非字符串)以配合默认内容类型"application/x-www-form-urlencoded"。如果要发送DOM树信息或者其他不希望转换的信息,请设置为false。*/
      success:function (res) {
        if(!res.errno) alert('上传成功!');
        else alert('上传失败,请重试!');
      }
    });
  });

说明:async: false, cache: false, contentType: false, processData: false,需要写上去。

此外,formdata对象中表单各项对应的值,要使用其自身get方法查看。

eg:data.get(‘file') //其中get的参数是表单元素的name。

async themeAction(){
  let themefile = this.file('themename');
  let filepath = themefile.path;//为防止上传的时候因文件名重复而覆盖同名已上传文件,path是MD5方式产生的随机名称
  let uploadpath = think.RESOURCE_PATH + '/static/theme';
  think.mkdir(uploadpath);//创建该目录
  //提取出用 ‘/' 隔开的path的最后一部分。
  //let basename = path.basename(filepath);
  let basename = themefile.originalFilename;//因为本系统不允许上传同名主题,所以文件名就直接使用主题名
  //将上传的文件(路径为filepath的文件)移动到第二个参数所在的路径,并改为第二个参数的文件名。
  fs.renameSync(filepath, uploadpath + '/' + basename);
  themefile.path = uploadpath + '/' + basename;
  //读取压缩文件信息存数据库
  let zip = new JSZip();
  this.success(themefile);
 }

总结

以上所述是小编给大家介绍的thinkjs 文件上传功能实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
CSS常用网站布局实例
Apr 03 Javascript
关于Javascript模块化和命名空间管理的问题说明
Dec 06 Javascript
Javascript基础知识(二)事件
Sep 29 Javascript
JS实现带鼠标效果的头像及文章列表代码
Sep 27 Javascript
javascript日期验证之输入日期大于等于当前日期
Dec 13 Javascript
JS中使用FormData上传文件、图片的方法
Aug 07 Javascript
谈谈PHP中相对路径的问题与绝对路径的使用
Aug 16 Javascript
AngularJS自定义指令实现面包屑功能完整实例
May 17 Javascript
vue中七牛插件使用的实例代码
Jul 28 Javascript
关于Vue.nextTick()的正确使用方法浅析
Aug 25 Javascript
vue中@change兼容问题详解
Oct 25 Javascript
js 数据类型判断的方法
Dec 03 Javascript
基于jQuery的$.getScript方法去加载javaScript文档解析
Nov 08 #jQuery
在React 组件中使用Echarts的示例代码
Nov 08 #Javascript
浅谈mint-ui loadmore组件注意的问题
Nov 08 #Javascript
es6在react中的应用代码解析
Nov 08 #Javascript
mac中利用NVM管理不同node版本的方法详解
Nov 08 #Javascript
浅谈vue-router2路由参数注意的问题
Nov 08 #Javascript
基于jQuery中ajax的相关方法汇总(必看篇)
Nov 08 #jQuery
You might like
利用PHP动态生成VRML网页
2006/10/09 PHP
php中unserialize返回false的解决方法
2014/09/22 PHP
PHP生成制作验证码的简单实例
2016/06/12 PHP
PHP 7.1新特性的汇总介绍
2016/12/16 PHP
PHP按一定比例压缩图片的方法
2018/10/12 PHP
PHP Include文件实例讲解
2019/02/15 PHP
PHP实现数组向任意位置插入,删除,替换数据操作示例
2019/04/05 PHP
Gird组件 Part-3:范例RSSFeed Viewer
2007/03/10 Javascript
jQuery与ExtJS之选择实例分析
2010/08/19 Javascript
网页整体变灰白色(兼容各浏览器)实例
2013/04/21 Javascript
jQuery函数的等价原生函数代码示例
2013/05/27 Javascript
javaScript中with函数用法实例分析
2015/06/08 Javascript
JavaScript实现将数组数据添加到Select下拉框的方法
2015/08/21 Javascript
JavaScript编写页面半透明遮罩效果的简单示例
2016/05/09 Javascript
页面get请求 中文参数方法乱码问题的快速解决方法
2016/05/31 Javascript
新闻上下滚动jquery 超简洁(必看篇)
2017/01/21 Javascript
js判断用户是输入的地址请求的路径(实例讲解)
2017/07/18 Javascript
SVG动画vivus.js库使用小结(实例代码)
2017/09/14 Javascript
angularJs中跳转到指定的锚点实例($anchorScroll)
2018/08/31 Javascript
js尾调用优化的实现
2019/05/23 Javascript
发布订阅模式在vue中的实际运用实例详解
2019/06/09 Javascript
element-ui tooltip修改背景颜色和箭头颜色的实现
2019/12/16 Javascript
基于小程序请求接口wx.request封装的类axios请求
2020/07/02 Javascript
在vue中使用image-webpack-loader实例
2020/11/12 Javascript
[01:15:36]加油刀塔第二期网络版
2014/08/09 DOTA
[46:57]EG vs Winstrike 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
[00:49]完美世界DOTA2联赛10月28日开团时刻:随便打
2020/10/29 DOTA
python使用电子邮件模块smtplib的方法
2016/08/28 Python
解析python的局部变量和全局变量
2019/08/15 Python
python自动生成model文件过程详解
2019/11/02 Python
Matplotlib 绘制饼图解决文字重叠的方法
2020/07/24 Python
介绍CSS3使用技巧5个
2009/04/02 HTML / CSS
H5 video poster属性设置视频封面的方法
2020/05/25 HTML / CSS
华为智利官方商店:Huawei Chile
2020/05/09 全球购物
《少年王勃》教学反思
2014/04/27 职场文书
医院员工辞职信范文
2015/05/12 职场文书