why my chrome does not cache my JavaScript files? - javascript

Our one page met some performance issue, during the triage,I found our js files are not cached while other resource like img/css are retrieved from cache(in F12 Network tab, in size column, it shows "from memory cache").
And in Firefox js files are retrieved from cache,this issue only occurred in chrome.
Did someone know the reason?Thanks a lot!
I take a js file request/response for example:
Request Header:
GET /emsaasui/emcpdfui/libs/1.13.0-161128.193454/js/oraclejet/js/libs/require/require.js HTTP/1.1
Host: slc10uan.us.oracle.com:4443
Connection: keep-alive
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/54.0.2840.99 Safari/537.36
Accept: /
DNT: 1
Referer: https://slc10uan.us.oracle.com:4443/emsaasui/emcpdfui/builder.html?dashboardId=15
Accept-Encoding: gzip, deflate, sdch, br
Accept-Language: zh-CN,zh;q=0.8,en;q=0.6
Response Header:
HTTP/1.1 200 OK
Date: Tue, 29 Nov 2016 07:59:08 GMT
X-Frame-Options: SAMEORIGIN
Accept-Ranges: bytes
Content-Type: text/javascript; charset=UTF-8
Last-Modified: Tue, 29 Nov 2016 03:38:36 GMT
X-ORACLE-DMS-ECID: 005GajqWd^qDWb85Rjs1yd0006^80000hX
APIGW: true
Set-Cookie: JSESSIONID=DB-vGDHUkRhI0s2oGq-KN_oGs7ToT7oRrZYsz6eXHsMGBgZCxKQv!1414641782; path=/apigw/resources; HttpOnly
Vary: Accept-Encoding
Content-Encoding: gzip
Cache-Control: max-age=2592000
Keep-Alive: timeout=5, max=97
Connection: Keep-Alive
Transfer-Encoding: chunked
Content-Language: en

Related

Browser random behaviour in using cache and reloading for js/css from server despite setting cache-control header

I have set cache-control header in my nginx conf file successfully for js/css files.
location ~* \.(css|js)$ {
add_header Pragma public;
add_header Cache-Control "public, must-revalidate, proxy-revalidate, max-age=305360000, s-maxage=305360000";
}
But the js/css files are randomly loaded from cache and server on page refreshes. What exactly tells browser to re-load the files from the cache other than cache-control header?
Request headers when file is loaded from cache:
Provisional headers are shown. Disable cache to see full headers.
Learn more
Referer: https://hacdomain/login/?next=%2Fui%2F%23%2Fdashboard
sec-ch-ua: "Not?A_Brand";v="8", "Chromium";v="108", "Google Chrome";v="108"
sec-ch-ua-mobile: ?0
sec-ch-ua-platform: "Windows"
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/108.0.0.0 Safari/537.36
Response headers when file is loaded from cache:
c-trace: a37def20-1192-48e2-8664-6b819d7d768f
cache-control: public, must-revalidate, proxy-revalidate, max-age=305360000, s-maxage=305360000
content-encoding: gzip
content-security-policy: default-src 'self' data: mediastream: blob: filesystem: 'unsafe-inline' 'unsafe-eval'
content-type: application/javascript; charset=utf-8
date: Wed, 14 Dec 2022 07:50:34 GMT
etag: W/"62db1945-6ecb68"
last-modified: Fri, 22 Jul 2022 21:40:21 GMT
pragma: public
referrer-policy: same-origin
strict-transport-security: max-age=31536000; includeSubDomains
transfer-encoding: chunked
vary: Accept-Encoding
x-content-type-options: nosniff
x-frame-options: SAMEORIGIN
x-xss-protection: 1
Request headers when file request goes to server:
Accept: text/css,*/*;q=0.1
Accept-Encoding: gzip, deflate, br
Accept-Language: en-GB,en-US;q=0.9,en;q=0.8,hi;q=0.7
Connection: keep-alive
Cookie: watcher.session_id=MTY3MTAwMzE2MHxOd3dBTkZBMFdFODNVMVZHV1ZoRVVVWllRVFpXV0VWRFIwMU5XVmRUUkVkWlRFdFRNMFkyVFVkSU4wdE5OMWsxVEZGV1FVZEVUMEU9fPRrNkIO81Pe0pho9cQJCkXH3cPrpYFumxaPLZdT1snG
Host: hacdomain
Referer: https://hacdomain/login/?next=%2Fui%2F%23%2Fdashboard
sec-ch-ua: "Not?A_Brand";v="8", "Chromium";v="108", "Google Chrome";v="108"
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/108.0.0.0 Safari/537.36
Response headers when request is server by server:
c-trace: 3880cc51-32a0-477c-aac1-63d60107062f
cache-control: public, must-revalidate, proxy-revalidate, max-age=305360000, s-maxage=305360000
content-encoding: gzip
content-security-policy: default-src 'self' data: mediastream: blob: filesystem: 'unsafe-inline' 'unsafe-eval'
content-type: text/css
date: Wed, 14 Dec 2022 07:51:40 GMT
etag: W/"62db1945-37f0f"
last-modified: Fri, 22 Jul 2022 21:40:21 GMT
pragma: public
referrer-policy: same-origin
strict-transport-security: max-age=31536000; includeSubDomains
transfer-encoding: chunked
vary: Accept-Encoding
x-content-type-options: nosniff
x-frame-options: SAMEORIGIN
x-xss-protection: 1
Browser started using the cache as per defined age after importing valid CA signed certificates of the server to the browser.

Chrome Keeps Sending GET for SSEs

Why does browser (Chrome) keep sending GET requests for SSE (Server-Sent Events)? Any idea why?
I only run the 'subscribeMe' function below once via clicking on button on the HTML page.
I understand that SSE works by only one GET is sent, and one 200 OK is received .. then with changes, server only pushes "data: ....." through the kept-open TCP HTTP/HTTPS connection.
const state = ['connecting', 'open', 'closed'];
let EPEvent;
function subscribeMe() {
EPEvent = new EventSource(`/event/${window.sessionStorage.getItem("Token")}/EPRegistration`);
EPEvent.onmessage = function (e) { console.log(state[this.readyState]); console.log(e); console.log(JSON.parse(e.data)) }
EPEvent.onopen = function () { console.log(state[this.readyState]) }
}
GET /event/MTSE-960a8337-1f95-495c-a313-92659ba8ba5d/EPRegistration HTTP/1.1
Host: 192.168.1.2
Connection: keep-alive
Accept: text/event-stream
Cache-Control: no-cache
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.132 Safari/537.36
Referer: http://192.168.1.2/manage
Accept-Encoding: gzip, deflate
Accept-Language: en-GB,en-US;q=0.9,en;q=0.8
HTTP/1.1 200 OK
Connection: keep-alive
Content-Type: text/event-stream
Cache-Control: no-cache
Date: Sun, 08 Mar 2020 21:07:45 GMT
Server: Home SE
Content-Length: 14
data: null
GET /event/MTSE-960a8337-1f95-495c-a313-92659ba8ba5d/EPRegistration HTTP/1.1
Host: 192.168.1.2
Connection: keep-alive
Accept: text/event-stream
Cache-Control: no-cache
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.132 Safari/537.36
Referer: http://192.168.1.2/manage
Accept-Encoding: gzip, deflate
Accept-Language: en-GB,en-US;q=0.9,en;q=0.8
HTTP/1.1 200 OK
Cache-Control: no-cache
Connection: keep-alive
Content-Type: text/event-stream
Date: Sun, 08 Mar 2020 21:07:48 GMT
Server: Home SE
Content-Length: 14
data: null
GET /event/MTSE-960a8337-1f95-495c-a313-92659ba8ba5d/EPRegistration HTTP/1.1
Host: 192.168.1.2
Connection: keep-alive
Accept: text/event-stream
Cache-Control: no-cache
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.132 Safari/537.36
Referer: http://192.168.1.2/manage
Accept-Encoding: gzip, deflate
Accept-Language: en-GB,en-US;q=0.9,en;q=0.8
HTTP/1.1 200 OK
Cache-Control: no-cache
Connection: keep-alive
Content-Type: text/event-stream
Date: Sun, 08 Mar 2020 21:07:51 GMT
Server: Home SE
Content-Length: 14
data: null
GET /event/MTSE-960a8337-1f95-495c-a313-92659ba8ba5d/EPRegistration HTTP/1.1
Host: 192.168.1.2
Connection: keep-alive
Accept: text/event-stream
Cache-Control: no-cache
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.132 Safari/537.36
Referer: http://192.168.1.2/manage
Accept-Encoding: gzip, deflate
Accept-Language: en-GB,en-US;q=0.9,en;q=0.8
HTTP/1.1 200 OK
Cache-Control: no-cache
Connection: keep-alive
Content-Type: text/event-stream
Date: Sun, 08 Mar 2020 21:07:54 GMT
Server: Home SE
Content-Length: 14
data: null
GET /event/MTSE-960a8337-1f95-495c-a313-92659ba8ba5d/EPRegistration HTTP/1.1
Host: 192.168.1.2
Connection: keep-alive
Accept: text/event-stream
Cache-Control: no-cache
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.132 Safari/537.36
Referer: http://192.168.1.2/manage
Accept-Encoding: gzip, deflate
Accept-Language: en-GB,en-US;q=0.9,en;q=0.8
HTTP/1.1 200 OK
Cache-Control: no-cache
Connection: keep-alive
Content-Type: text/event-stream
Date: Sun, 08 Mar 2020 21:07:57 GMT
Server: Home SE
Content-Length: 14
data: null
GET /event/MTSE-960a8337-1f95-495c-a313-92659ba8ba5d/EPRegistration HTTP/1.1
Host: 192.168.1.2
Connection: keep-alive
Accept: text/event-stream
Cache-Control: no-cache
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.132 Safari/537.36
Referer: http://192.168.1.2/manage
Accept-Encoding: gzip, deflate
Accept-Language: en-GB,en-US;q=0.9,en;q=0.8
HTTP/1.1 200 OK
Cache-Control: no-cache
Connection: keep-alive
Content-Type: text/event-stream
Date: Sun, 08 Mar 2020 21:08:00 GMT
Server: Home SE
Content-Length: 14
data: null
Fixed it!
I should have not put 'Content-Length' in my response! .. This is a stream, Content-Length has no meaning.
Now, it is working fine.

HTTP header ETag not sent back to server

I'm providing an ETag in the Response Header from the server to the browser when supplying a javascript file generated programatically.
On subsequent requests for that same javascript file the ETag does not get supplied back in Request Header by the browser.
I've tried this in both Chrome and IE, same results find below the request and response headers from original request and subsequent one.
Original Request Header
GET /v11/RUNTIME_SUPPORT.GetGlobalFormResources.aspx HTTP/1.1
Host: 101.152.80.163
Connection: keep-alive
Cache-Control: max-age=0
Accept: */*
X-FirePHP-Version: 0.0.6
User-Agent: Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.66 Safari/537.36
Referer: http://101.152.80.163/v11/Web_Support.Html.aspx
Accept-Encoding: gzip, deflate, sdch
Accept-Language: en-US,en;q=0.8,ro;q=0.6,es;q=0.4
Cookie: StaraspxOpenTabsCount=0; ASP.NET_SessionId=jpdkfccaf0zttoxyvys53ac3; STARaspx_SessionId=1006606D-F415-4AE5-AA4C-847625EB2BAE
If-None-Match: 0.0.459
Original Response Header
HTTP/1.1 200 OK
Cache-Control: public, max-age=604800
Content-Type: application/javascript; charset=utf-8
Content-Encoding: gzip
ETag: 0.0.459,0.0.0,0.00
Vary: Accept-Encoding
Server: Microsoft-IIS/8.5
ItemType: FORMS
Digest: e0d3a2bdee4c0a48bc4f61bb744755c21c1d6c19
X-Powered-By: ASP.NET
X-Frame-Options: SAMEORIGIN
X-XSS-Protection: 1
X-Content-Type-Options: nosniff
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET,PUT,POST,DELETE,OPTIONS
Access-Control-Allow-Headers: callfrom, content-type, runtimecalltype
Access-Control-Allow-Credentials: true
Date: Tue, 12 Apr 2016 11:46:06 GMT
Content-Length: 31763
Subsequent Request Header
GET /v11/RUNTIME_SUPPORT.GetGlobalFormResources.aspx HTTP/1.1
Host: 101.152.80.163
Connection: keep-alive
Cache-Control: max-age=0
Accept: */*
X-FirePHP-Version: 0.0.6
User-Agent: Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.66 Safari/537.36
Referer: http://101.152.80.163/v11/Web_Support.Html.aspx
Accept-Encoding: gzip, deflate, sdch
Accept-Language: en-US,en;q=0.8,ro;q=0.6,es;q=0.4
Cookie: StaraspxOpenTabsCount=0; ASP.NET_SessionId=jpdkfccaf0zttoxyvys53ac3; STARaspx_SessionId=1006606D-F415-4AE5-AA4C-847625EB2BAE
If-None-Match: 0.0.459
Subsequent Response Header
HTTP/1.1 200 OK
Cache-Control: public, max-age=604800
Content-Type: application/javascript; charset=utf-8
Content-Encoding: gzip
ETag: 0.0.459,0.0.0,0.00
Vary: Accept-Encoding
Server: Microsoft-IIS/8.5
ItemType: FORMS
Digest: e0d3a2bdee4c0a48bc4f61bb744755c21c1d6c19
X-Powered-By: ASP.NET
X-Frame-Options: SAMEORIGIN
X-XSS-Protection: 1
X-Content-Type-Options: nosniff
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET,PUT,POST,DELETE,OPTIONS
Access-Control-Allow-Headers: callfrom, content-type, runtimecalltype
Access-Control-Allow-Credentials: true
Date: Tue, 12 Apr 2016 11:46:48 GMT
Content-Length: 31763
I've identified the root causes for ETags not working in my scenario:
I should have looked at the If-None-Match request header field rather than expecting an ETag field be provided to the server (more details here Header Field Definitions)
I should have not used commas in my ETag respose header field value, only the sub-string before the first comma gets sent back in request header field If-None-Match. In my case the ETag value in respose header was 0.0.459,0.0.0,0.00 and the subsequent request had 0.0.459 in the If-None-Match header field.
Response header from server now: HTTP/1.1 304 Not Modified :)

Strange issue with CORS preflight request fails on IE 11

The problem, is that the the POST query fails on IE11, in all the other browsers it's seems working.
Lets describe the problem step by step:
XHR request from application to REST API.
Preflight OPTIONS request (request parameters are following)
Accept: */*
Origin: https://app.example.com
Access-Control-Request-Method: POST
Access-Control-Request-Headers content-type, accept
:
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko
Host: api.example.com
Content-Length: 0
Connection: Keep-Alive
Cache-Control: no-cache
preflight request response parameters are:
X-Powered-By: Sugar
Access-Control-Allow-Origin: https://app.example.com
Vary: Origin
Access-Control-Allow-Credentia true
ls:
Access-Control-Allow-Methods: GET,POST,DELETE,OPTIONS
Access-Control-Allow-Headers: X-Requested-With,X-HTTP-Method-Override,Content-Type,Accept
set-cookie: sugar.sid=s%Pb9OoTTPUkVw%2F2vUPoFMNG
LMXACSkQevo; Path=/; Expires=Thu, 15 Jan 2015 18:27:07 GMT; HttpOnly; Secure
Date: Mon, 12 Jan 2015 18:27:07 GMT
Connection: close
The real HTTP request after preflight request parameters:
Accept: application/json
Content-Type: application/json
Referer: https://app.example.com/
Accept-Language: en-US
Origin: https://app.example.com
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko
Host: api.example.com
Content-Length: 9
Connection: Keep-Alive
Cache-Control: no-cache
Cookie: sugar.sid=s%3A-%2FGF1YoFmRfmBsxK4vLBoGjY5NT0QoYvf5s;
Last response parameters:
Content-Type: application/json; charset=utf-8
Content-Length: 72
Vary: Accept-Encoding
Date: Mon, 12 Jan 2015 18:27:07 GMT
Connection: close
Basically the response end with the IE error: Origin: https://app.example.com not found in Access-Control-Allow-Origin header. Does the first request needs also the Access-**-Origin header, which seems to be missing.
Also followed the CORS flow chart for debugging problem, but I could not spot it http://www.html5rocks.com/static/images/cors_server_flowchart.png.
I am using Node.js Express server with the node-cors module + modified options.
I was using Fiddler to debug this issue on my site and got this message:
HTTP/1.1 400 Bad Request
Cache-Control: no-cache
Pragma: no-cache
Content-Type: application/json; charset=utf-8
Expires: -1
Server: Microsoft-IIS/8.5
X-AspNet-Version: 4.0.30319
X-Frame-Options: SAMEORIGIN
X-Content-Type-Options: nosniff
X-XSS-Protection: 1; mode=block
Date: Mon, 12 Sep 2016 19:40:20 GMT
Content-Length: 103
{"Message":"The collection of headers 'accept,if-modified-since,cache-control,pragma' is not allowed."}
CORS the collection of headers accept,if-modified-since,cache-control,pragma
So I just added to my web.api the list of missing headers to CORS.
I hope this helps to someone.

MP4 streaming in FireFox but not Chrome?

I'm building a Node.js program and I've gotten a fairly good music streaming method down. But for some reason, the audio is only streaming in FireFox (not in Chrome). I've provided a sample link for a song I know isn't working here. I'm almost positive this is a header issue. What should I change to get everything working smoothly?
Note: If the above url says "No App Running" or something along those lines, wait about an hour and try again. I'm currently knee-deep in development.
Two requests are made by Chrome:
GET https://mesh-c9-triforce1.c9.io/stream/Katrah-Query/Rainfall%20Roots HTTP/1.1
Host: mesh-c9-triforce1.c9.io
Connection: keep-alive
Cache-Control: max-age=0
Accept-Encoding: identity;q=1, *;q=0
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/37.0.2062.120 Safari/537.36
Accept: */*
Referer: https://mesh-c9-triforce1.c9.io/stream/Katrah-Query/Rainfall%20Roots
Accept-Language: en-US,en;q=0.8
Range: bytes=0-
And:
GET https://mesh-c9-triforce1.c9.io/stream/Katrah-Query/Rainfall%20Roots HTTP/1.1
Host: mesh-c9-triforce1.c9.io
Connection: keep-alive
Cache-Control: max-age=0
Accept-Encoding: identity;q=1, *;q=0
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/37.0.2062.120 Safari/537.36
Accept: */*
Referer: https://mesh-c9-triforce1.c9.io/stream/Katrah-Query/Rainfall%20Roots
Accept-Language: en-US,en;q=0.8
Range: bytes=2808-
The response headers are the same for both:
HTTP/1.1 200 OK
x-powered-by: Express
last-modified: Wed, 12 Mar 2014 08:56:38 GMT
date: Thu, 18 Sep 2014 23:40:14 GMT
expires: Thu, 18 Sep 2014 23:40:14 GMT
content-type: audio/mp4; codecs="mp4a.40.2"
accept-ranges: bytes
content-length: 4754197

Categories