Question

我们已在codeigniter应用程序中实现了图像裁剪。它使用jquery ajax正确上传图像，但在上传后无法在页面中正确显示。它显示旧图像。仅刷新一页后，将显示新页面。

我们添加了页面刷新，重定向方法以在上传后刷新页面，但无效。

我试过了，

header("Location:".$_SERVER['HTTP_REFERER']);
window.location.reload();

它在本地服务器上运行良好。在服务器中，刷新不起作用。任何人都可以为此做出解决方案......？

<script type="text/javascript">
window.onload = function() {
    var options =
    {
        imageBox: '.imageBox',
        thumbBox: '.thumbBox',
        spinner: '.spinner',
        imgSrc: 'avatar.png'
    }
    var cropper = new cropbox(options);
    document.querySelector('#file').addEventListener('change', function(){
        var reader = new FileReader();
        reader.onload = function(e) {
            options.imgSrc = e.target.result;
            cropper = new cropbox(options);
        }
        reader.readAsDataURL(this.files[0]);
        this.files = [];
    })
    document.querySelector('#btnCrop').addEventListener('click', function(){
        var img = cropper.getDataURL();

        var simple = '<?php echo base_url(); ?>';
        var member_id ='<?php echo $this->session->userdata('current_member');?>';
        $.ajax({url: simple + 'admin/admin_home/membercrop',
            type: "POST",
            async: false,
            data: {
                "image": img
            },
            success: function (data) {

              window.location.reload();

            },
            error: function (error) {
                alert('error');
            }
        });

    })
    document.querySelector('#btnZoomIn').addEventListener('click', function(){
        cropper.zoomIn();
    })
    document.querySelector('#btnZoomOut').addEventListener('click', function(){
        cropper.zoomOut();
    })

};

</script>

Answer 1

解决方案是在图像后面添加一个时间戳，这将阻止缓存：

<img src="test.jpg?t=<?=date('U')?>" />

裁剪后上载的图像未使用codeigniter刷新

1 个答案: