使用angular + WordPress时不存在“ Access-Control-Allow-Origin”标头

Question

，当我在woocommerce api中使用POST方法发布数据时。我收到了CORS问题

从原点“ http://localhost/wordpress/wc-api/v3/customers?oauth_consumer_key=ck_64d88e1fa3516e9f5a06b6053f02976a534d3f8f&oauth_nonce=zsu3ysEnFHhvrZt4Nc7H66Dgu28H20K7&oauth_signature_method=HMAC-SHA256&oauth_timestamp=1562587817&oauth_version=1.0&oauth_signature=KtFxvyQNklUlfCi6rNWyJ0DEJ6AS2ZbwbO44u%2FEqxG4%3D”到“ http://localhost:8100”的访存访问已被CORS策略阻止：对预检请求的响应未通过访问控制检查：它没有HTTP正常状态。

Answer 1

如果服务器所在的域与发出请求的应用程序不在同一个域（服务器将其设置为响应头），则必须在对服务器的每个请求上设置一个Access-Control-Allow-Origin标头）。添加该标头将告诉系统，允许外部域“ localhost：8100”发出这些请求。

您不能在普通浏览器中规避此要求，因为它是一种内置的安全功能，可以减少CORS攻击

PS。同一域中的不同端口被视为不同域。因此，如果您向example.com:8100提出请求，example.com将收到401错误。本地主机或任​​何其他域也是如此。

我个人用来设置这些标头的Apache2 Web服务器.conf文件中的示例代码。

SetEnvIf Origin "^http(s)?://(.+\.)?(staging.\xxx\.com|xxx\.com|xxx\.local|xxx\.local:4200|a2\.local)$" origin_is=$0
Header always set Access-Control-Allow-Origin %{origin_is}e env=origin_is

只需将xxx.com域替换为localhost：8100或该阵列中需要的其他任何域。 （如果您使用的是Apache Web服务器）

因此，Chrome网络标签上应在请求上附加一个Access-Control-Allow-Origin标头