AngularJS實現的檔案檔案上傳

admin發表於2017-04-08

angular-file-upload 是一個基於HTML5技術的檔案上傳輕量級 AngularJS指令(directive),當瀏覽器不支援時轉為採用 FileAPI polyfill技術實現(基於Flash)。本文主要給大家介紹Angular Js檔案上傳之form-data,需要的朋友可以參考下。

先看一下前端程式碼:

[JavaScript] 純文字檢視 複製程式碼
$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方式傳。

相關文章