angular form-data文件上傳

1. 前言：很久沒更新博客，最近公司pc端技術選型用angular,這幾天就趕鴨子上架，硬着頭皮直接上手angular。其中有許多小坑陸陸續續踩起走。今天就遇到一個比較常見的問題：圖片上傳。
2. 主題：圖片上傳服務器，然后通過服務器傳阿里雲。
3. 下面直接貼前端代碼：

 

$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方式傳。這點不難，主要是新手處理問題。

下面推薦一個比較不錯的圖片截取插件：cropper，源碼地址：https://github.com/fengyuanchen。