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 相关文章推荐
浏览器无法运行JAVA脚本的解决方法
Jan 09 Javascript
JavaScript Event学习第七章 事件属性
Feb 07 Javascript
基于jquery的从一个页面跳转到另一个页面的指定位置的实现代码(带平滑移动的效果)
May 24 Javascript
在javascript中如何得到中英文混合字符串的长度
Jan 17 Javascript
js检测网络是否具体连接功能的代码
May 23 Javascript
一段非常简单的js判断浏览器的内核
Aug 17 Javascript
jQuery .tmpl() 用法示例介绍
Aug 21 Javascript
jquery控制背景音乐开关与自动播放提示音的方法
Feb 06 Javascript
ES6新特性之变量和字符串用法示例
Apr 01 Javascript
初探JavaScript 面向对象(推荐)
Sep 03 Javascript
js实现登录与注册界面
Nov 01 Javascript
layui 根据后台数据动态创建下拉框并同时默认选中的实例
Sep 02 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 多进程 解决难题
2009/06/22 PHP
PHP基础学习小结
2011/04/17 PHP
php CI框架插入一条或多条sql记录示例
2014/07/29 PHP
PHP简单实现二维数组的矩阵转置操作示例
2017/11/24 PHP
PHP使用PDO操作sqlite数据库应用案例
2019/03/07 PHP
XmlUtils JS操作XML工具类
2009/10/01 Javascript
JS 判断undefined的实现代码
2009/11/26 Javascript
javascript学习笔记(五)正则表达式
2011/04/08 Javascript
JavaScript字符串String和Array操作的有趣方法
2012/12/18 Javascript
javascript中的变量作用域以及变量提升详细介绍
2013/10/24 Javascript
setTimeout()与setInterval()方法区别介绍
2013/12/24 Javascript
被遗忘的javascript的slice() 方法
2015/04/20 Javascript
javascript格式化json显示实例分析
2015/04/21 Javascript
每天一篇javascript学习小结(Date对象)
2015/11/13 Javascript
Javascript简写条件语句(推荐)
2016/06/12 Javascript
BootStrap 智能表单实战系列(十)自动完成组件的支持
2016/06/13 Javascript
一个简单的JavaScript Map实例(分享)
2016/08/03 Javascript
jquery遍历标签中自定义的属性方法
2016/09/17 Javascript
利用n 升级工具升级Node.js版本及在mac环境下的坑
2017/02/15 Javascript
jQuery实现导航栏头部菜单项点击后变换颜色的方法
2017/07/19 jQuery
微信小程序 本地图片按照屏幕尺寸处理
2017/08/04 Javascript
Vue filter 过滤当前时间 实现实时更新效果
2019/12/20 Javascript
[01:20]DOTA2 2017国际邀请赛冠军之路无止竞
2017/06/19 DOTA
Python中的字符串替换操作示例
2016/06/27 Python
基于python时间处理方法(详解)
2017/08/14 Python
python爬虫之BeautifulSoup 使用select方法详解
2017/10/23 Python
用python实现将数组元素按从小到大的顺序排列方法
2018/07/02 Python
python字典值排序并取出前n个key值的方法
2018/10/17 Python
python异常触发及自定义异常类解析
2019/08/06 Python
Python各种扩展名区别点整理
2020/02/27 Python
如何在windows下安装Pycham2020软件(方法步骤详解)
2020/05/03 Python
HTML5 Canvas阴影使用方法实例演示
2013/08/02 HTML / CSS
澳大利亚领先的折扣药房:Chemist Direct(有中文站)
2018/11/24 全球购物
教师实习自我鉴定
2013/12/13 职场文书
高中诗歌鉴赏教学反思
2016/02/16 职场文书
IDEA2021.2配置docker如何将springboot项目打成镜像一键发布部署
2021/09/25 Java/Android