자바 스크립트 이미지 저장 클립지 백엔드에 대한 크로 피 결과

Question

반응 레일이있는 자바 스크립트 이미지 크로퍼 (크로 피)를 사용하고 있습니다. 나는 반응기에 크 로피를 설치했고 잘 작동한다. 여기 내 코드가있다. 나는 다음과 같다 "onclick을 = {this.resultantImage을}"을 사용하여 crooped 이미지를 얻을하려고하면 다음

var el = $('.crop-area')[0]; 

    var vanilla = new Croppie(el, { 
     // enforceBoundary: false, 
     viewport: { width: 200, height: 200 }, 
     boundary: { width: 300, height: 300 }, 
     showZoomer: false, 
     // enableResize: true, 
     enableOrientation: true 
    }); 
    vanilla.bind({ 
     url: this.props.imgSrc, 
    }); 
    this.vanilla = vanilla; 

내 이미지 SRC

<img className="crop-area image-responsive" src={this.props.imgSrc}/> 
<button className="btn btn-primary" onClick={this.resultantImage}>Image</button> 

입니다 :

resultantImage: function() { 

    var _this = this; 

    this.vanilla.result('base64','original').then(function (resp) { 
     console.log(resp); 
    }); 
}, 

1. resp는이 이미지 src를 검사하려고 할 때 이미지 src를 제공합니다. src는 비어 있습니다 (투명)?
2. 이 이미지를 종이 클립에 저장하려고하면 빈 이미지가 나타 납니까?

도와주세요. 감사합니다

Answer 1

몇 가지 연구를 한 후 해결책을 찾았습니다. 왜 이런 일이 일어날 지 모르지만 간단히 말하면 : 설정에서 "enforceBoundary : false"를 만들어야합니다. 당신은 올바른을 얻을 것이다

enforceBoundary: false, 

는이 약속을 초래할립니다.

this.vanilla.result('base64','original').then(function (resp) { 
    console.log(resp); 
});