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

Question

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

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)。

这是在以下问题中推荐的：头集访问-控制-允许-起源在.htaccess中不起作用

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

错误：

来自原点的图像“http://maptile.org”已被跨源资源共享策略阻止加载:请求的资源上不存在“访问控制-允许-原产地”标题。因此，“http://www.justicemap.org”源是不允许访问的。

当图像存储在justicemap.org域中时，“另存为图像”函数可以工作。

当我使用html2canvas时，请求方法是"GET"，响应状态代码是"200"，而mimeType是"image/png“。我没有看到访问控制-允许-原产地标题.

我需要添加一个原产地标题吗？当我检查控制台中的请求时，我没有看到任何请求。

Answer 1

结果发现我没有在运行Apache。我用的是莱特普。我没有意识到这一点，因为Cloudflare将服务器头替换为：Server:cloudflare-nginx。

我能够使用2.本建议配置Lighttpd来工作。

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
    })
  })
],