图像对象只能记录到控制台

时间:2017-03-28 23:39:48

标签: javascript ecmascript-6 cloudinary

我正在尝试将图像对象存储在构造函数变量中,但它未定义,目前我只能将对象记录到结果中。

我正在尝试从类方法getUserImage();获取对象数据 但是当我尝试将对象存储在this._userImage时,它显示未定义。同样,只有console.log(result)才有效:(

Error: TypeError: Cannot read property '_userImage' of undefined
    at /home/jd/Projects/game-site/app/Http/Helpers/ImageUploader.js:23:11
    at IncomingMessage.<anonymous> (/home/jd/Projects/game-site/node_modules/cloudinary/lib/uploader.js:499:51)
    at emitNone (events.js:91:20)
    at IncomingMessage.emit (events.js:188:7)
    at endReadableNT (_stream_readable.js:974:12)
    at _combinedTickCallback (internal/process/next_tick.js:80:11)
    at process._tickCallback (internal/process/next_tick.js:104:9)
[nodemon] app crashed - waiting for file changes before starting...

ImageUploader.js

'use strict';

const cloudinary = require('cloudinary');

class ImageUploader {

  constructor(imageObj) {
    this.imageObj = imageObj;
    this._apiKey = "key";
    this._apiSecret = "secret";
    this._url = `url here`;
    this._userImage = {}; // this is the empty object I try storing the image data into from Cloudinary
    this.config = cloudinary.config({
      cloud_name: 'cloud name here',
      api_key: this._apiKey,
      api_secret: this._apiSecret
    });
  }


  * uploadAvatar(path) {
    cloudinary.uploader.upload(path, function(result) {
      this._userImage.imgData = result;
      return console.log(this._userImage);
    });
  }

  getUserImage() {
    return this._userImage;
  }


}

module.exports = ImageUploader;

UsersController.js

'use strict'

const Validator = require("../Helpers/ValidatorHelper.js");
const ImageUploader = require("../Helpers/ImageUploader.js");

class UsersController {

  * registerView (request, response) {
    yield response.sendView('users.register');
  }

  * register (request, response) {
    const user = request.only('display_name', 'username', 'email', 'password', 'confirm_password', 'console');
    const avatar = request.file('avatar');


    let validator = new Validator(user, avatar);
    let imageUpload = new ImageUploader(avatar);

    let avatarStatus = yield validator.validateAvatar();
    if (avatarStatus) { // is true
      yield imageUpload.uploadAvatar(avatar.file.path);
      console.log(imageUpload.getUserImage());
    } else { // is false
      // pick a random avatar
    }

    return response.status(200).json(user);

  }


}

module.exports = UsersController

1 个答案:

答案 0 :(得分:2)

您的回调正在改变范围this是指:

* uploadAvatar(path) {
    cloudinary.uploader.upload(path, function(result) {
      // "this" is now referring to your callback function
      this._userImage.imgData = result;
      return console.log(this._userImage);
    });
  }

最好,您可以使用箭头功能(保留父范围)来解决此问题:

 * uploadAvatar(path) {
    cloudinary.uploader.upload(path, (result) => {
      this._userImage.imgData = result;
      return console.log(this._userImage);
    });
  }

或者在输入回叫之前捕获this

 * uploadAvatar(path) {
    const _this = this;
    cloudinary.uploader.upload(path, function(result) {
      _this._userImage.imgData = result;
      return console.log(_this._userImage);
    });
  }