我有一个 Rails 3 应用程序，其中包含在 AWS S3 上托管并由 Paperclip gem 管理的图像。
我正在尝试对其进行设置，以便用户可以使用 js 库在浏览器中编辑这些图像（现在我正在使用 Pixastic，但我愿意尝试 Caman）但遇到了一个问题js 图像处理库失败是因为浏览器的 CSRF 保护拒绝 S3 图像来自不同的域。
有没有办法代理图像，使它们看起来来自同一个域，或者以其他方式解决这个问题？
【问题讨论】：
标签： ruby-on-rails amazon-s3 paperclip
我刚刚和一个合作伙伴一起用 CamanJS 解决了这个问题。
在不知道您是如何构建视图的情况下（并且根本不了解 Pixastic），我会尽力回答。
假设您要链接到 html 中的原始图片，请将 crossorigin='anonymous' 添加到图片标签中：
<img class='image' crossorigin='anonymous' data-camanheight='450' src=<%= @photo.url%>>
这将设置浏览器的预期图像不会来自您网站的网址。
我们发现这适用于初始图像，但是当 CamanJS 的 revert() 函数重建图像（在将其转换回画布元素之前）时，它会遗漏让浏览器知道可以这样的标题信息它是跨域数据。因此，每次我们还原图像时，都会再次遇到 CORS 问题。我简要浏览了 Pixastic 的文档，但无法就您是否会遇到类似问题提供建议。
注意：超级流畅的体验是我们的首要任务，我们不想设置代理，所以我们的解决方法是在 Javascript 变量中保留手头的图像标签的克隆并编写我们自己的方法恢复画布，重新克隆图像标签，将克隆的标签之一推入 DOM，然后将其转换为新的画布元素并摆脱旧的元素。它遇到了一些 CamanJS 特定的行为，这使它有点“hacky”。
我的项目合作伙伴已经向 CamanJS 提交了一个保留标头信息的拉取请求，因此这个问题可能很快就会得到解决，使 CamanJS 成为跨源资源共享的更好解决方案。
希望这会有所帮助。
【讨论】：