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 相关文章推荐
javascript 鼠标滚轮事件
Apr 09 Javascript
jQuery 使用手册(四)
Sep 23 Javascript
有道JavaScript监听浏览器的问题
Jun 23 Javascript
jquery ajax方式直接提交整个表单核心代码
Aug 15 Javascript
自动设置iframe大小的jQuery代码
Sep 11 Javascript
几种响应式文字详解
May 19 Javascript
让你彻底掌握es6 Promise的八段代码
Jul 26 Javascript
webpack多页面开发实践
Dec 18 Javascript
layui 给数据表格加序号的方法
Aug 20 Javascript
Angular脚手架开发的实现步骤
Apr 09 Javascript
浅析webpack-bundle-analyzer在vue-cli3中的使用
Oct 23 Javascript
jQuery实现移动端图片上传预览组件的方法分析
May 01 jQuery
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
使用ThinkPHP自带的Http类下载远程图片到本地的实现代码
2011/08/02 PHP
win7 64位系统 配置php最新版开发环境(php+Apache+mysql)
2014/08/15 PHP
php中json_encode UTF-8中文乱码的更好解决方法
2014/09/28 PHP
PHP MVC框架skymvc支持多文件上传
2016/05/26 PHP
PHP如何实现阿里云短信sdk灵活应用在项目中的方法
2019/06/14 PHP
PHP实现的AES 128位加密算法示例
2019/09/16 PHP
URL编码转换,escape() encodeURI() encodeURIComponent()
2006/12/27 Javascript
用js实现预览待上传的本地图片
2007/03/15 Javascript
javascript 短路法代码精简
2009/08/20 Javascript
用JQUERY增删元素的代码
2012/02/14 Javascript
checkbox使用示例
2013/08/23 Javascript
js如何取消事件冒泡
2013/09/23 Javascript
flash遮住div问题的正确解决方法
2014/02/27 Javascript
基于javascript如何传递特殊字符
2015/11/30 Javascript
JS工作中的小贴士之”闭包“与事件委托的”阻止冒泡“
2016/06/16 Javascript
详解如何提高 webpack 构建 Vue 项目的速度
2017/07/03 Javascript
通过 JS 判断页面是否有滚动条的实现方法
2018/04/05 Javascript
javascript 高级语法之继承的基本使用方法示例
2019/11/11 Javascript
微信小程序获取公众号文章列表及显示文章的示例代码
2020/03/10 Javascript
基于javascript实现日历功能原理及代码实例
2020/05/07 Javascript
Python模块WSGI使用详解
2018/02/02 Python
pytorch 调整某一维度数据顺序的方法
2018/12/08 Python
python 3.7.4 安装 opencv的教程
2019/10/10 Python
Python openpyxl模块原理及用法解析
2020/01/19 Python
佳能法国商店:Canon法国
2019/02/14 全球购物
北欧最好的童装网上商店:Babyshop
2019/09/15 全球购物
介绍一下linux的文件系统
2015/10/06 面试题
会计辞职信范文
2014/01/15 职场文书
本科生职业生涯规划书范文
2014/01/21 职场文书
小区门卫管理制度
2014/01/29 职场文书
我的祖国演讲稿
2014/05/04 职场文书
国贸专业毕业求职信
2014/06/11 职场文书
学院党的群众路线教育实践活动整改方案
2014/10/04 职场文书
档案接收函格式
2015/01/30 职场文书
Sql Server 行数据的某列值想作为字段列显示的方法
2022/04/20 SQL Server
CSS的calc函数用法小结
2022/06/25 HTML / CSS