0

我正在开发一个使用 JCrop 裁剪用户个人资料图像的 Codeigniter 应用程序。

上传图像后，我使用标准方法运行 Jcrop 并通过表单提交坐标。

<script type="text/javascript">
    $(function() {
            $('#cropbox').Jcrop({
            onSelect: updateCoords,
            aspectRatio: 1,
            setSelect: [ 50, 50, 150, 150 ],
            bgColor: '#fff',
            bgOpacity: .2
        });
    });
    function updateCoords(c)
        {
            $('#x').val(c.x);
            $('#y').val(c.y);
            $('#w').val(c.w);
            $('#h').val(c.h);
        };
</script>

// some code here...

    <?php echo form_open('/profile/crop_picture', array('id' => 'crop_picture_form')); ?>

        <input type="hidden" name="x" id="x" />
        <input type="hidden" name="y" id="y" />
        <input type="hidden" name="w" id="w" />
        <input type="hidden" name="h" id="h" />
        <br />

    <?php echo form_close(); ?>

所有这些都可以在 Safari 和 FF 4.0 上完美运行。用户选择一个区域进行裁剪，提交，页面会用裁剪后的图像刷新。

在 Chrome 和 IE8 上，当用户提交时，页面会刷新但图像不会被裁剪。踢球者 - >如果在浏览器中点击刷新，则图像被裁剪。

不用说，这很奇怪。有没有人建议从哪里开始调试这个问题——或者你以前见过这种情况/描述过吗？

感谢您的帮助。

编辑：仍未解决，但进一步测试表明这可能是 Cr 和 IE8 上的缓存问题。即使裁剪尺寸已由服务器上的 codeigniter 提交、处理和保存，Chrome 似乎仍会保留原始上传的图像并显示它。在我用于裁剪的 CI 控制器的末尾，我放了

redirect('/profile/picture', 'refresh');

在提交裁剪图像后加载新页面时，这对 Chrome 和 IE8 没有影响。仅当我在浏览器上手动触发“刷新”时，裁剪的图像才会显示。

我检查了我的服务器图像文件并确认了这一点：虽然裁剪的图像保存在我的服务器中，但 Chrome 上显示的图像文件（同名）具有以前的未裁剪尺寸。

4

1 回答 1

0

这已通过更改包含以下内容的我的 .htaccess 来解决

<IfModule mod_headers.c>
# 45 MIN
<FilesMatch "\.(ico|gif|jpg|jpeg|png|flv|pdf)$">
  Header set Cache-Control "max-age=2700"
</FilesMatch>
</IfModule>

我删除了jpg|jpeg，现在在 Cr 和 IE8 中一切正常。

同意，这应该是最先解决问题的地方之一，但奇怪的是，FF 和 Saf 似乎不像 Cr 和 IE8 那样遵守这条规则。在 Saf 和 FF 上，尽管有 .htaccess 规则，但新生成的裁剪 JPEG——即使文件名与原始 JPEG 相同——也会被刷新。

如果有人对如何使这种行为在浏览器之间保持一致有任何想法，请发表评论。

于 2011-06-16T04:10:21.350 回答