2

ng-file-uploadを使用して、サーバに基本単一ファイルをアップロードします。サーバに送信するときにファイルオブジェクトが空です。ng-file-upload

私はファイルを選択し、私が選択したファイル名を見て、ファイルオブジェクト($scope.myFiles[0])を私の角度サービスに渡すことができます。しかし、私のHTTPデータプロパティにファイルを埋め込み、devツールでHTTPリクエストを調べると、ファイルは空のオブジェクトになります。

コントローラー:

UploadService.upload({ data: { file: $scope.myFiles[0], 'category': $scope.selectedCategory}}) 
    .success(function (data) { 
    //// 
    //// 

がUploadService:上記で

app.factory('UploadService', function ($http, $q) { 
    return { 
     upload: function (something) { 
      console.log(something); 

      return $http({ 
       method: 'POST', 
       url: '/upload', 
       data: something 
      }); 
     } 
    } 
}); 

は、開発ツールのHTTPリクエストに検査、私は以下を参照してください。

Request Payload: 
    {data: {file: {}, category: "Friend Card"}} 
    data: 
     {file: {}, category: "Friend Card"} 
     category:"Friend Card" 
     file:{} 

は、コンソールの出力を見てみます。ログ(何か)、私はファイルを介して見ることができます:

具体的に

Accept:application/json, text/plain, */* 
Accept-Encoding:gzip, deflate 
Accept-Language:en-US,en;q=0.8 
Connection:keep-alive 
Content-Length:48 
Content-Type:image/jpeg 
Cookie:_ga=GA1.1.2023678669.1463291637; _gat=1 
Host:localhost:8585 
Origin:http://localhost:8585 
Referer:http://localhost:8585/pages/ 

::私はdevのツールで見ることができる

return $http({ 
      method: 'POST', 
      url: '/upload', 
      headers: { 
       'Content-Type': something.data.file.type 
      }, 
      data: { 
       "file": something.data.file, 
       "category": something.data.category 
      } 
     }); 

{ 
    $hashKey:"object:107" 
    lastModified:1465716430000 
    lastModifiedDate:Sun Jun 12 2016 08:27:10 GMT+0100 (BST) 
    name:"Postcard.JPG" 
    size:522622 
    type:"image/jpeg" 
    webkitRelativePath:"" 
} 

を介して、ヘッダータイプを持っている機能を変更したのContent-Type:画像/ JPEGそれそうしかし、ファイルはまだ空のオブジェクトです。

+1

は' Upload.upload({ファイル:...、ファイルのURLを})を使用します代わりに$ http – danial

+0

@ダニアルのサーバー - ありがとう、しかし、私は理解していない.. httpの代わりに??例がありますか? –

+1

ドキュメントには多くの例があります。Upload.upload({ メソッド: 'POST'、 url: '/ upload'、 data:something }); – danial

答えて

0

回答は

NG-ファイル・アップロードのlibには、APIのとあなたの角度のアプリにして注入することができる方法は、「アップロード」サービスであるそのうちの一つの数が付属しています...上記danialから一部が来ました。

私は自分のコントローラにして、これを注射し、そしてここでjsFiddleを追っ: `にファイルをアップロードするhttp://jsfiddle.net/danialfarid/maqbzv15/1118/

Upload.upload({ 
    url: 'https://angular-file-upload-cors-srv.appspot.com/upload', 
    data: {username: $scope.username, file: file}, 
}); 
関連する問題