Question

如果我允许用户上传图像，我将console.log结果，该对象的哪一部分是我应该发送给API的实际图像？

HTML

<div>
    <input type="file" id="file" name="file" />
    <button ng-click="user.add()">Upload</button> 
</div>

控制器

vm.add = function(){

      // This probably isn't best for Angular, but I don't know a better way
      // This came from another SO answer
      var file = document.getElementById('file').files[0];
      var reader = new FileReader();

      console.log(file);
      console.log(typeof file);

      var photo = {file: file};

      // This calls a method in my service
      // I'm passing passing the photo object
      UserDisplay.uploadPhoto($stateParams.user_id, photo)

      // r.readAsBinaryString(f);
    }

这是Chrome开发工具中的console.log：

File {}

我可以点击它来显示对象：

lastModified: XYZ
lastModifiedDate: XYZ
name: "test.jpg"
size: XYZ
type: "image/jpeg"
webkitRelativePath: ""
__proto__: File

所以我的主要问题是哪个部分存储图像？似乎没有。

服务

userDisplayFactory.uploadPhoto = function(id, photo) {
    return $http.put('/api/users/' + id + '/profile/', photo);
};

API

console.log(req.body.file);

cloudinary.uploader.upload(req.body.file.name, function(result) {
    console.log(result);
});

在我的终端，我得到：

{} 
{ error: { message: 'Missing required parameter - file', http_code: 400 } }

如果我上传req.body.file（而不是req.body.file.name），在我的终端中我收到以下输出：

TypeError: file.match is not a function

如何将图片上传到API

0 个答案: