即使已设置标题,也不存在“ Access-Control-Allow-Origin”标题

时间:2019-11-28 22:07:44

标签: reactjs apache cors axios

让我在开始之前先说一下,我了解CORS的工作原理以及在请求跨站点资源时如何不接收错误消息。

不幸的是,无论出于什么原因,我仍然收到此消息。

过程:

  1. 我的网站位于https://ironeko.com/
  2. 在Chrome(只有Chrome)上,出现以下错误
    Access to image at 'https://api.ironeko.com/wp-content/uploads/2019/08/Group-12-3-300x272.png' from origin 'https://ironeko.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

但是,在第一页加载时,来自同一资源的所有其他图像加载都很好。

这是在我的.htaccess文件中:

<IfModule mod_setenvif.c>
  <IfModule mod_headers.c>
    <FilesMatch "\.(bmp|cur|gif|ico|jpe?g|png|svgz?|webp)$">
      SetEnvIf Origin ":" IS_CORS
      Header Set Access-Control-Allow-Origin "*" env=IS_CORS
    </FilesMatch>
  </IfModule>
</IfModule>

我是从Mozilla那里得到的。

我在Apache中检查了已启用的模块:

 core_module (static)
 so_module (static)
 watchdog_module (static)
 http_module (static)
 log_config_module (static)
 logio_module (static)
 version_module (static)
 unixd_module (static)
 access_compat_module (shared)
 actions_module (shared)
 alias_module (shared)
 auth_basic_module (shared)
 authn_core_module (shared)
 authn_file_module (shared)
 authz_core_module (shared)
 authz_host_module (shared)
 authz_user_module (shared)
 autoindex_module (shared)
 deflate_module (shared)
 dir_module (shared)
 env_module (shared)
 filter_module (shared)
 headers_module (shared) <----
 http2_module (shared)
 mime_module (shared)
 mpm_event_module (shared)
 negotiation_module (shared)
 proxy_module (shared)
 proxy_fcgi_module (shared)
 proxy_http_module (shared)
 reqtimeout_module (shared)
 rewrite_module (shared)
 setenvif_module (shared) <----
 socache_shmcb_module (shared)
 ssl_module (shared)
 status_module (shared)

(无论哪种方式,即使没有IfModule,这仍然无法正常工作)

编辑:我以前认为问题是由我的正常图像请求引起的。但是我正在使用react-palette发出辅助请求。我认为这实际上是导致CORS错误的原因。

function returnImageColor(src) {
  const { data, loading, error } = usePalette(src);
  return data;
}

这是怎么回事?为什么Chrome会发生这种情况? CORS标头中是否有错误?

0 个答案:

没有答案