angularjs - 浏览器后退按钮上的 CORS 错误

Question

我有一个 ASP.NET Web API 2 服务。并且多个客户端( Angular )应用程序与该服务对话。应用程序和服务发布在不同的子域上，如下所示:

service.mydomain.com

app1.mydomain.com

app2.mydomain.com

我使用 Microsoft.AspNet.WebApi.Cors - NuGet 包来启用 CORS，它工作正常，除了一种情况:
当用户打开一个应用程序 (app1.mydomain.com) 时。
然后导航到另一个 (app2.mydomain.com)。然后按浏览器后退按钮。以下 CORS 错误:

The 'Access-Control-Allow-Origin' header has a value 'http://app2.mydomain.com' that is not equal to the supplied origin. 
Origin 'http://app1.mydomain.com' is therefore not allowed access

我配置了Microsoft.AspNet.WebApi.Cors-NuGet包，如下:

public static void Register(HttpConfiguration config)
        {
        var cors = new EnableCorsAttribute(
                //to-do allow cross domains for all maarif.com sites
                origins: "*", //and also tried "http://app1.mydomain.com, http://app2.mydomain.com" gives same result
                headers: "*",
                methods: "*") {SupportsCredentials = true};

            config.EnableCors(cors);
        }

我在服务器上跟踪了 Origin header 值。
我将以下代码放在服务 'global.asax' 中:

protected void Application_BeginRequest()
        {
            var origin = HttpContext.Current.Request.Headers["Origin"];

            if (origin != null )
            {
                HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", origin);
                HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "*");
                HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "*");
                HttpContext.Current.Response.AddHeader("Access-Control-Allow-Credentials", "true");
            }
        }

当用户单击“app2.mydomain.com”到“app1.mydomain.com”的后退按钮时会出现问题，随请求发送的源是“app2.mydomain.com”，这就是服务允许访问的内容: HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", 'app2.mydomain.com');
有什么办法解决这个问题吗？

请注意，我不能输入“*”，因为请求已通过身份验证。

Answer 1

问题是由于浏览器的缓存机制。因为浏览器会使用缓存中的数据，即使是 AJAX 请求，当您单击 BACK 按钮时也是如此。
为此，浏览器不会重新发送 CORS 预检以检查 Access-Control-Allow-Origin为上一页的原点。然后它将使用最新的 Access-Control-Allow-Origin ，这是 app2.mydomain.com ，使 app1.mydomain.com应该失败。
一个简单的解决方案是在 api 查询字符串的末尾添加时间戳或随机字符串，例如:
js:

let url = 'https://service.mydomain.com/xxxxx?v=' + Date.now();

但是它会忽略 Access-Control-Max-Age ，它对 service.mydomain.com 的每个请求进行 CORS 预检.
或者，您可以在新窗口中强制打开指向其他来源的所有链接，这样就无法执行 BACK 操作。
除了这些，我找不到任何其他解决方案。
更新:
我后来在这个anwser之后测试了，然后找到了最终的解决方案:
在 service.mydomain.com 中添加以下 HTTP 响应 header ，然后一切正常。
网址:

Cache-Control: no-store,no-cache,must-revalidate
Pragma: no-cache

只需禁用 AJAX 请求的所有缓存。而且 CORS Max-age 也有效。
现在它适用于 Chrome 和 Firefox。我没有尝试其他浏览器，但我认为应该没有什么不同。