bootstrap 3 模态，cropperjs

Question

使用 bootstrap 3 模态显示cropperjs cropper(https://github.com/fengyuanchen/cropper) 以及从 api 加载的图像。由于某种原因，当图像宽度为 0 时调用图像加载，并且裁剪器正在将 display:none 添加到图像中，因此它不会出现

function createCropZone(url){
            $('#options-modal')
                    .modal('show')
                    .find('.modal-title')
                    .text('Crop Zone ')

            var img = $('<img>', {'src' : url})

            $('.modal-body .row')
                    .empty()
                    .append(img)


                img.on('load', function(){
                        var defaultWidth = 1024;
                        if(img.width() === 0){
                            $('.modal-body').css({'width' : defaultWidth + 'px'})
                            $('.modal-content').css({'width' : (defaultWidth + 50) + 'px'})
                            $('.modal-content').css({'left': '-220px'})

                        }else{
                            $('.modal-body').css({'width' : img.width() + 'px'})
                            $('.modal-content').css({'width' : (img.width() + 50) + 'px'})
                            if(img.width() > 800){
                                $('.modal-content').css({'left': '-220px'})
                            }

                        }

//                cropZone( $('.modal-body .row').get(0))

                })
                $(img).cropper({
                              aspectRatio: 16 / 9,
                              crop: function(e) {
                                // Output the result data for cropping image.
                                console.log(e.x);
                                console.log(e.y);
                                console.log(e.width);
                                console.log(e.height);
                                console.log(e.rotate);
                                console.log(e.scaleX);
                                console.log(e.scaleY);
                              }
                            });



        }

Answer 1

这个问题是因为cropper从图片发送者那里寻找cross origin header