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 相关文章推荐
AJAX使用了UpdatePanel后无法使用alert弹出脚本
Apr 02 Javascript
JS验证日期的格式YYYY-mm-dd 具体实现
Jun 29 Javascript
jquery列表拖动排列(由项目提取相当好用)
Jun 17 Javascript
上传文件返回的json数据会被提示下载问题解决方案
Dec 03 Javascript
深入浅析JavaScript中数据共享和数据传递
Apr 25 Javascript
Vue.js路由组件vue-router使用方法详解
Dec 02 Javascript
对于Javascript 执行上下文的全面了解
Sep 05 Javascript
OkHttp踩坑随笔为何 response.body().string() 只能调用一次
Jan 08 Javascript
JS使用正则表达式获取小括号、中括号及花括号内容的方法示例
Jun 01 Javascript
Vue自定义指令写法与个人理解
Feb 09 Javascript
js笔试题-接收get请求参数
Jun 15 Javascript
5种方法告诉你如何使JavaScript 代码库更干净
Sep 15 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脚本的10个技巧(7)
2006/10/09 PHP
理解PHP5中static和const关键字的区别
2007/03/19 PHP
PHP实现根据图片色界在不同位置加水印的方法
2015/08/08 PHP
php单链表实现代码分享
2016/07/04 PHP
Laravel 实现在Blade模版中使用全局变量代替路径的例子
2019/10/22 PHP
phpstudy后门rce批量利用脚本的实现
2019/12/12 PHP
jQuery live
2009/05/15 Javascript
基于jquery的使ListNav兼容中文首字拼音排序的实现代码
2011/07/10 Javascript
js拦截alert对话框另类应用
2013/01/16 Javascript
选择器中含有空格在使用示例及注意事项
2013/07/31 Javascript
jquery form表单序列化为对象的示例代码
2014/03/05 Javascript
javascript中if和switch,==和===详解
2015/07/30 Javascript
js事件源window.event.srcElement兼容性写法(详解)
2016/11/25 Javascript
JavaScript提高加载和执行效率的方法
2017/02/03 Javascript
js读取本地文件的实例
2017/12/22 Javascript
使用vue-cli导入Element UI组件的方法
2018/05/16 Javascript
微信小程序防止多次点击跳转和防止表单组件输入内容多次验证功能(函数防抖)
2019/09/19 Javascript
前端vue如何使用高德地图
2020/11/05 Javascript
用Python实现一个简单的多线程TCP服务器的教程
2015/05/05 Python
剖析Django中模版标签的解析与参数传递
2015/07/21 Python
在python的类中动态添加属性与生成对象
2016/09/17 Python
如何在Cloud Studio上执行Python代码?
2019/08/09 Python
python实现单张图像拼接与批量图片拼接
2020/03/23 Python
python使用列表的最佳方案
2020/08/12 Python
Python如何利用Har文件进行遍历指定字典替换提交的数据详解
2020/11/05 Python
详解如何在css3打包后自动追加前缀插件:autoprefixer
2018/12/18 HTML / CSS
CSS实现半透明边框与多重边框的场景分析
2019/11/13 HTML / CSS
草莓网英国官网:Strawberrynet UK
2017/02/12 全球购物
丑小鸭教学反思
2014/02/03 职场文书
开工仪式主持词
2014/03/20 职场文书
新闻传媒系求职信范文
2014/04/19 职场文书
骨干教师考核方案
2014/05/09 职场文书
2014银行领导班子群众路线对照检查材料思想汇报
2014/09/17 职场文书
工作表扬信
2015/01/17 职场文书
MySQL系列之七 MySQL存储引擎
2021/07/02 MySQL
Python内置类型集合set和frozenset的使用详解
2022/04/26 Python