Issue with Chrome not Utilizing Cache for .NET Project I'm encountering a puzzling behavior

Chrome seems to be ignoring cache directives for certain static files. Here's the relevant excerpt from my web.config as i use IIS:

<location path="Scripts">
    <system.web>
        <authorization>
            <allow users="*" />
        </authorization>
    </system.web>
    <system.webServer>
        <staticContent>
            <clientCache cacheControlCustom="public" cacheControlMode="UseMaxAge" cacheControlMaxAge="100.00:00:00" />
        </staticContent>
    </system.webServer>
</location>

I have a file named app2.css for the example loaded from an ASPX file like so:

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <link href="/Themes/General/css/ant.css" rel="stylesheet" type="text/css"/>
    <link href="../Scripts/vue/Components/css/app2.css" rel="stylesheet" type="text/css" />
</asp:Content>

Upon inspecting the network traffic in Chrome, I notice that on the initial request, the response headers include the expected cache control directives:

Request:

• Request URL: https://localhost:8088/Scripts/vue/Components/css/app2.css
• Request Method: GET

Response:

• Status Code: 200 OK
• Remote Address: [::1]:8088
• Referrer Policy: strict-origin-when-cross-origin
• Accept-Ranges: bytes
• Cache-Control: public,max-age=8640000
• Content-Length: 1355294
• Content-Type: text/css
• Date: Sun, 29 Oct 2023 07:43:59 GMT
• Etag: "59b46bf2dc7da1:0"
• Last-Modified: Thu, 26 Oct 2023 07:20:50 GMT
• Server: Microsoft-IIS/10.0

Request Headers:

• :authority: localhost:8088
• :method: GET
• :path: /Scripts/vue/Components/css/app2.css
• :scheme: https
• Accept: text/css,/;q=0.1
• Accept-Encoding: gzip, deflate, br
• Accept-Language: en-US,en;q=0.9
• Cookie: (My cookie data)
• Referer: https://localhost:8088/Pages/Monitor.aspx
• Sec-Ch-Ua: "Chromium";v="118", "Google Chrome";v="118", "Not=A?Brand";v="99"
• Sec-Ch-Ua-Mobile: ?0
• Sec-Ch-Ua-Platform: "Windows"
• Sec-Fetch-Dest: style
• Sec-Fetch-Mode: no-cors
• Sec-Fetch-Site: same-origin
• User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/118.0.0.0 Safari/537.36

Strangely, this behavior is not observed in Firefox, which consistently loads the file from the cache as anticipated.

I've attempted to address this by adding the immutable directive to the cache control header, but it had no effect. Additionally, running Chrome with increased memory limits did not yield any improvements. i have Etag that is remain the same and last-modifeid is fine.

In a broader context, the page initiates a total of 180 requests. While approximately 70% of them load from in-memory cache in Chrome, the remaining JavaScript and CSS files continue to be fetched from the server. (talking about those with proper cache-control). i will mention the Etag remain the same for the assets and last-modified is lower then request time

I'm at a loss as to what might be causing this discrepancy between Chrome and Firefox. Any insights or suggestions on how to resolve this issue would be greatly appreciated.

i've tried adding immutiable to the cache-control.lowering max-age. minimizing assets file sizes. many other attempts that failed. checking the behavior in develop and production envirunments. from diffrent computers. chrome browser from mac and windows. and as i said. all is looking good on firefox.

Finaly i've manage to understand what cause this behavior in chrome. it was due to bad site certificate leading to 'not secure' error. only fixing the certificate helped. not chrome security flag coul'd bypass this issue. after fixing the certificate all assets loaded from cache as expected