第一个响应中缺少Access-Control-Allow-Origin

Question

我正在开发一个通过CloudFront CDN服务器资产的Web应用程序(Angular + Rails).该应用程序通过nginx提供,该nginx已正确设置为设置"Access-Control-Allow-Origin"标头.CloudFront设置为转发标头.

问题是Angular模板的第一个响应中缺少标题,但它在后续响应中正确出现(如果我刷新页面).

例如,如果我清除Chrome中的所有历史记录和缓存并访问该页面,则模板文件的响应将不具有"Access-Control-Allow-Origin"标头.如果我刷新页面,模板的响应将具有标题.

我注意到,如果我清除所有历史记录和缓存,但不清除cookie,它会继续正常工作.

它在Firefox上的行为类似.如果我清除所有历史记录并缓存它对第一个响应不起作用,但它在后续响应中正常工作.清除所有历史记录和缓存但没有cookie后,它继续正常工作,与Chrome不同.

此外,如果我在Firefox中打开开发工具并禁用缓存,则每个响应都会丢失标头.

你知道问题可能是什么,或者我应该在下一步看看？

谢谢.

Answer 1

"Access-Control-Allow-Origin"是响应头,而不是请求头.当HTTP客户端使用OPTION方法发送请求时,它由HTTP服务器返回.例如,当目标URL不是当前页面URL时,浏览器中的ajax API在尝试POST请求之前发送OPTION请求(请参阅跨源资源共享问题).此OPTION请求包含"Origin"标头,该标头保存URL(scheme + domain)的当前页面开头.仅当响应包含带有与主页面1匹配的URL的标题"Access-Control-Allow-Origin"时,Ajax API才会发送POST请求.

如果要从其他服务器访问动态内容而不是服务当前页面的服务器,则只需要担心此类标头.这似乎不是你的情况.

有关CORS的更多信息,请参阅此维基百科页面:https://en.wikipedia.org/wiki/Cross-origin_resource_sharing