Angular Js文件上传之form-data


Posted in Javascript onAugust 28, 2015

前言:很久没更新博客,最近公司pc端技术选型用angular,这几天就赶鸭子上架,硬着头皮直接上手angular。其中有许多小坑陆陆续续踩起走。今天就遇到一个比较常见的问题:图片上传。

主题:图片上传服务器,然后通过服务器传阿里云。

不废话了直接贴前端代码:

$http({
method: ‘POST‘,

url: ‘/wechatapp/User/setAvatar‘,
  data: data,
  headers: {
    ‘Content-Type‘: undefined
  },
  transformRequest: function(data) {
    var formData = new FormData();
    formData.append(‘avatar_data‘, data.adata);
    formData.append(‘avatar_file‘, data.file);
    return formData;
  },
  data: {
    adata: scope.avatar_data,
    file: scope.avatar_file
  }
  }).success(function(d) {
    //请求成功
    cb(d);
  }).error(function(err, status) {
    console.log(err);
    cb(err);
  });

其实没神马难点,主要是取消post默认的Content-Type,然后已FormData的方式上传。一般ajax上传文件都是以FormData方式传。

以上就是本文给大家介绍Angular Js文件上传之form-data,希望大家喜欢。

Javascript 相关文章推荐
nicejforms——美化表单不用愁
Feb 20 Javascript
静态页面下用javascript操作ACCESS数据库(读增改删)的代码
May 14 Javascript
jQuery源码中的chunker 正则过滤符分析
Jul 31 Javascript
你必须知道的Javascript知识点之"this指针"的应用
Apr 23 Javascript
JS显示日历和天气的方法
Mar 01 Javascript
基于javascript实现tab选项卡切换特效调试笔记
Mar 30 Javascript
jQuery事件绑定on()与弹窗实现代码
Apr 28 Javascript
Bootstrap媒体对象的实现
May 01 Javascript
BOM系列第三篇之定时器应用(时钟、倒计时、秒表和闹钟)
Aug 17 Javascript
Bootstrap下拉菜单更改为悬停(hover)触发的方法
May 24 Javascript
微信小程序实现左侧滑栏过程解析
Aug 26 Javascript
vue使用map代替Aarry数组循环遍历的方法
Apr 30 Javascript
jQuery热气球动画半透明背景的后台登录界面代码分享
Aug 28 #Javascript
jquery实现未经美化的简洁TAB菜单效果
Aug 28 #Javascript
基于jQuery实现Div窗口震动特效代码-代码简单
Aug 28 #Javascript
js实现显示当前状态的导航效果代码
Aug 28 #Javascript
jQuery实现表单步骤流程导航代码分享
Aug 28 #Javascript
AngularJS+Node.js实现在线聊天室
Aug 28 #Javascript
JS实现仿苹果底部任务栏菜单效果代码
Aug 28 #Javascript
You might like
深入php内核之php in array
2015/11/10 PHP
php获取图片信息的方法详解
2015/12/10 PHP
详解php框架Yaf路由重写
2017/06/20 PHP
PHP对象的浅复制与深复制的实例详解
2017/10/26 PHP
javascript 获取select下拉列表值的代码
2009/09/07 Javascript
Jquery中获取iframe的代码
2011/01/11 Javascript
JS 两日期相减,获得天数的小例子(兼容IE,FF)
2013/07/01 Javascript
jQuery 获取、设置HTML或TEXT内容的两种方法
2014/05/23 Javascript
innerHTML动态添加html代码和脚本兼容多个浏览器
2014/10/11 Javascript
JavaScript代码复用模式详解
2014/11/07 Javascript
Javascript中prototype属性实现给内置对象添加新的方法
2015/05/14 Javascript
ES6中如何使用Set和WeakSet
2016/03/10 Javascript
Koa2微信公众号开发之消息管理
2018/05/16 Javascript
javascript少儿编程关于返回值的函数内容
2018/05/27 Javascript
JavaScript使用面向对象实现的拖拽功能详解
2019/06/12 Javascript
JavaScript中的函数式编程详解
2020/08/22 Javascript
[01:23:59]2018DOTA2亚洲邀请赛 4.1 小组赛 B组 VP vs Secret
2018/04/03 DOTA
[02:10]DOTA2 TI10勇士令状玩法及不朽Ⅰ展示:焕新世界,如你所期
2020/05/29 DOTA
python 捕获shell脚本的输出结果实例
2017/01/04 Python
pandas按若干个列的组合条件筛选数据的方法
2018/04/11 Python
python中plot实现即时数据动态显示方法
2018/06/22 Python
Atom的python插件和常用插件说明
2018/07/08 Python
Python实现端口检测的方法
2018/07/24 Python
详解python实现识别手写MNIST数字集的程序
2018/08/03 Python
深入了解Python iter() 方法的用法
2019/07/11 Python
Python使用贪婪算法解决问题
2019/10/22 Python
python shutil文件操作工具使用实例分析
2019/12/25 Python
python输出第n个默尼森数的实现示例
2020/03/08 Python
html5使用canvas画空心圆与实心圆
2014/12/15 HTML / CSS
StubHub希腊:购买体育赛事、音乐会和剧院门票
2019/08/03 全球购物
Linux机考试题
2015/07/17 面试题
医药营销个人求职信范文
2014/02/07 职场文书
三八妇女节趣味活动方案
2014/08/23 职场文书
奖金申请报告模板
2015/05/15 职场文书
音乐之声观后感
2015/06/04 职场文书
详解MySQL的内连接和外连接
2023/05/08 MySQL