在.htaccess中启用的跨域资源共享不起作用

Question

我在我的图像服务器(maptile.org)上创建了一个。htaccess文件。

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Headers "origin, x-requested-with, content-type"
Header set Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS"

我使用a2enmod headers启用mod-headers我测试了它是否启用了apachectl -M，它列出了headers_module (shared)

这是在问题中推荐的:标题集Access-Control-Allow-Origin在。htaccess中不起作用

然而，当我试图将地图保存为图像(使用html2canvas)时，它会在控制台中给我一个错误http://www.justicemap.org/?id=63

错误:

图片从原点'http://maptile.org'已被阻止加载跨域资源共享策略:否"访问-控制-允许-起源"标头出现在请求上资源。因此，不允许使用原产地"http://www.justicemap.org"访问。

当图像存储在justicemap.org域中时，保存为图像功能有效。

当我使用html2canvas的请求方法是"GET"，响应状态码是"200"，mime类型是"image/png"。我没有看到Access-Control-Allow-Origin头。

我需要添加一个起源标题吗?当我在Chrome Javascript控制台检查请求时，我没有看到一个

Answer 1

原来我没有运行Apache。我用的是Lighttpd。我没有意识到这一点，因为Cloudflare用:Server:cloudflare-nginx替换了服务器头。

Answer 2

我有同样的问题，并通过将crossOrigin选项设置为null来解决，如下所示:

layers: [
  new ol.layer.Tile({
    source: new ol.source.OSM({
      url: 'http://tile-server-ip/osm/{z}/{x}/{y}.png',
      crossOrigin: null
    })
  })
],