SharePoint / sp-dev-docs

SharePoint & Viva Connections Developer Documentation
https://docs.microsoft.com/en-us/sharepoint/dev/
Creative Commons Attribution 4.0 International
1.25k stars 1.01k forks source link

Service Worker returning old files #7829

Open johannes-z opened 2 years ago

johannes-z commented 2 years ago

Target SharePoint environment

SharePoint Online

What SharePoint development model, framework, SDK or API is this about?

not applicable

Developer environment

Windows

What browser(s) / client(s) have you tested

Additional environment details

Describe the bug / error

The ServiceWorker returns old files for files served from SharePoint, e.g. Style Library, even when using url args for cache busting. When loading a script with <script src=".../Style Library/script.js"></script>, the ServiceWorker returns random versions (latest or an older version) of that file.

On a simple page I'm loading the same file, config.js, twice. I've added the current Date in ms as url args to get the latest version, but it doesn't work.

Request URL: `.../Style%20Library/config.js?1648200666963`

date: Fri, 25 Mar 2022 09:31:05 GMT
etag: "{8209E62C-313F-4763-B3F5-6B6D0EEEB56E},11pub"
last-modified: Fri, 25 Mar 2022 09:30:41 GMT
Request URL: `.../Style%20Library/config.js?1648200666965`

date: Fri, 25 Mar 2022 09:31:05 GMT
etag: "{8209E62C-313F-4763-B3F5-6B6D0EEEB56E},10pub"
last-modified: Tue, 16 Nov 2021 09:21:43 GMT

When I Clear site data, the ServiceWorker seems to return the correct version. I've seen behavior though, where the ServiceWorker would sometimes still serve old files. image

The only reliable way of getting the latest files is to disable the service worker under Application > Service Workers > Bypass for network and activating Network > Disable Cache.

I've had many co-workers and customers complain about seeing old file versions.

Steps to reproduce

  1. Upload a file to a Style Library
  2. Load the file (via requirejs, script-tag, fetch, etc.)
  3. Update the file
  4. Load the file again.
    1. The ServiceWorker should return either the latest or an older version.
    2. Rinse & repeat - the behavior seems non-deterministic

Expected behavior

The ServiceWorker caches files to long, or doesn't realise it should serve a newer file. Also cache busting to prevent caching doesn't work at all.

ghost commented 2 years ago

Thank you for reporting this issue. We will be triaging your incoming issue as soon as possible.

demyren commented 2 years ago

Hi, @johannes-z Can you provide me the request and response headers for your script file?

Thank you.

johannes-z commented 2 years ago

@demyren

Request 1

General

Request URL: .../sites/.../Style%20Library/.../config.js?1648712178469
Request Method: GET
Status Code: 200  (from service worker)
Referrer Policy: strict-origin-when-cross-origin

Response Headers

accept-ranges: bytes
cache-control: public, max-age=86400
content-encoding: gzip
content-security-policy: frame-ancestors 'self' teams.microsoft.com *.teams.microsoft.com *.skype.com *.teams.microsoft.us local.teams.office.com *.powerapps.com *.yammer.com *.officeapps.live.com *.office.com *.stream.azure-test.net *.microsoftstream.com *.dynamics.com *.microsoft.com;
content-type: application/javascript
date: Thu, 31 Mar 2022 07:36:17 GMT
etag: "{8209E62C-313F-4763-B3F5-6B6D0EEEB56E},11pub"
last-modified: Fri, 25 Mar 2022 09:30:41 GMT
microsoftsharepointteamservices: 16.0.0.22316
ms-cv: oC8RQyWAADDrBF32vB9XDg.0
nel: {"report_to":"network-errors","max_age":7200,"success_fraction":0.001,"failure_fraction":1.0}
p3p: CP="ALL IND DSP COR ADM CONo CUR CUSo IVAo IVDo PSA PSD TAI TELo OUR SAMo CNT COM INT NAV ONL PHY PRE PUR UNI"
report-to: {"group":"network-errors","max_age":7200,"endpoints":[{"url":"https://spo.nel.measure.office.net/api/report?tenantId=924c18cd-feab-4e6a-b5d2-840d1ceee5ae&destinationEndpoint=Edge-Prod-VIEr5i&frontEnd=AFD"}]}
request-id: 43112fa0-8025-3000-eb04-5df6bc1f570e
sprequestguid: 43112fa0-8025-3000-eb04-5df6bc1f570e
strict-transport-security: max-age=31536000
vary: Accept-Encoding
x-aspnet-version: 4.0.30319
x-cache: CONFIG_NOCACHE
x-content-type-options: nosniff
x-frame-options: SAMEORIGIN
x-ms-invokeapp: 1; RequireReadOnly
x-msedge-ref: Ref A: 053ADF0D380F4356AEF9410843E6D861 Ref B: VIEEDGE4419 Ref C: 2022-03-31T07:36:18Z
x-powered-by: ASP.NET

Request Headers

Referer: .../sites/...
sec-ch-ua: " Not A;Brand";v="99", "Chromium";v="100", "Google Chrome";v="100"
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/100.0.4896.60 Safari/537.36

Request 2

General

Request URL: .../sites/.../Style%20Library/.../config.js?1648712178470
Request Method: GET
Status Code: 200  (from service worker)
Referrer Policy: strict-origin-when-cross-origin

Response Headers

accept-ranges: bytes
cache-control: public, max-age=86400
content-encoding: gzip
content-security-policy: frame-ancestors 'self' teams.microsoft.com *.teams.microsoft.com *.skype.com *.teams.microsoft.us local.teams.office.com *.powerapps.com *.yammer.com *.officeapps.live.com *.office.com *.stream.azure-test.net *.microsoftstream.com *.dynamics.com *.microsoft.com;
content-type: application/javascript
date: Thu, 31 Mar 2022 07:36:17 GMT
etag: "{8209E62C-313F-4763-B3F5-6B6D0EEEB56E},13pub"
last-modified: Thu, 31 Mar 2022 07:34:56 GMT
microsoftsharepointteamservices: 16.0.0.22316
ms-cv: oC8RQyXwADDrBFtMacvcqA.0
nel: {"report_to":"network-errors","max_age":7200,"success_fraction":0.001,"failure_fraction":1.0}
p3p: CP="ALL IND DSP COR ADM CONo CUR CUSo IVAo IVDo PSA PSD TAI TELo OUR SAMo CNT COM INT NAV ONL PHY PRE PUR UNI"
report-to: {"group":"network-errors","max_age":7200,"endpoints":[{"url":"https://spo.nel.measure.office.net/api/report?tenantId=924c18cd-feab-4e6a-b5d2-840d1ceee5ae&destinationEndpoint=Edge-Prod-VIEr5i&frontEnd=AFD"}]}
request-id: 43112fa0-f025-3000-eb04-5b4c69cbdca8
sprequestguid: 43112fa0-f025-3000-eb04-5b4c69cbdca8
strict-transport-security: max-age=31536000
vary: Accept-Encoding
x-aspnet-version: 4.0.30319
x-cache: CONFIG_NOCACHE
x-content-type-options: nosniff
x-frame-options: SAMEORIGIN
x-ms-invokeapp: 1; RequireReadOnly
x-msedge-ref: Ref A: 7AD125E49A1D4B1AAD53FB8D014A4DD4 Ref B: VIEEDGE4419 Ref C: 2022-03-31T07:36:18Z
x-powered-by: ASP.NET

Request Headers

Referer: .../sites/...
sec-ch-ua: " Not A;Brand";v="99", "Chromium";v="100", "Google Chrome";v="100"
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/100.0.4896.60 Safari/537.36
demyren commented 2 years ago

@johannes-z From the cache-control header, the max age seems to be set to 1 day. Then the file should be re-fetched once a day under this configuration. Are you not seeing this working? If you go to the cache storage named "Site-[identifier]", can you see your file there and is it the wrong version? Can you provide also the request and response headers of that cache entry?

Thank you!

johannes-z commented 2 years ago

@demyren I've had customers complain about old versions weeks after I updated the file.

The file is also wrong in the cache storage.

Also, even if the file would be re-fetched after a day, why does cache busting only work for one of the two requests? And it's obviously a different file, as it exists in the cache twice. In a scenario, where a random url arg is appended, I don't see a reason why this file would still be cached :/ Either way it seems inconsistent; either none or both of the files should come from cache.

Request 1

General

Request URL: .../sites/.../Style%20Library/.../config.js?1648712178469
Request Method: GET
Status Code: 200 

Response Headers

accept-ranges: bytes
cache-control: public, max-age=86400
content-encoding: gzip
content-security-policy: frame-ancestors 'self' teams.microsoft.com *.teams.microsoft.com *.skype.com *.teams.microsoft.us local.teams.office.com *.powerapps.com *.yammer.com *.officeapps.live.com *.office.com *.stream.azure-test.net *.microsoftstream.com *.dynamics.com *.microsoft.com;
content-type: application/javascript
date: Thu, 31 Mar 2022 07:36:17 GMT
etag: "{8209E62C-313F-4763-B3F5-6B6D0EEEB56E},11pub"
last-modified: Fri, 25 Mar 2022 09:30:41 GMT
microsoftsharepointteamservices: 16.0.0.22316
ms-cv: oC8RQyWAADDrBF32vB9XDg.0
nel: {"report_to":"network-errors","max_age":7200,"success_fraction":0.001,"failure_fraction":1.0}
p3p: CP="ALL IND DSP COR ADM CONo CUR CUSo IVAo IVDo PSA PSD TAI TELo OUR SAMo CNT COM INT NAV ONL PHY PRE PUR UNI"
report-to: {"group":"network-errors","max_age":7200,"endpoints":[{"url":"https://spo.nel.measure.office.net/api/report?tenantId=924c18cd-feab-4e6a-b5d2-840d1ceee5ae&destinationEndpoint=Edge-Prod-VIEr5i&frontEnd=AFD"}]}
request-id: 43112fa0-8025-3000-eb04-5df6bc1f570e
sprequestguid: 43112fa0-8025-3000-eb04-5df6bc1f570e
strict-transport-security: max-age=31536000
vary: Accept-Encoding
x-aspnet-version: 4.0.30319
x-cache: CONFIG_NOCACHE
x-content-type-options: nosniff
x-frame-options: SAMEORIGIN
x-ms-invokeapp: 1; RequireReadOnly
x-msedge-ref: Ref A: 053ADF0D380F4356AEF9410843E6D861 Ref B: VIEEDGE4419 Ref C: 2022-03-31T07:36:18Z
x-powered-by: ASP.NET

Request Headers

Accept: */*
sec-ch-ua: " Not A;Brand";v="99", "Chromium";v="100", "Google Chrome";v="100"
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/100.0.4896.60 Safari/537.36

Request 2

General

Request URL: .../sites/.../Style%20Library/.../config.js?1648712178470
Request Method: GET
Status Code: 200 

Response Headers

accept-ranges: bytes
cache-control: public, max-age=86400
content-encoding: gzip
content-security-policy: frame-ancestors 'self' teams.microsoft.com *.teams.microsoft.com *.skype.com *.teams.microsoft.us local.teams.office.com *.powerapps.com *.yammer.com *.officeapps.live.com *.office.com *.stream.azure-test.net *.microsoftstream.com *.dynamics.com *.microsoft.com;
content-type: application/javascript
date: Thu, 31 Mar 2022 07:36:17 GMT
etag: "{8209E62C-313F-4763-B3F5-6B6D0EEEB56E},13pub"
last-modified: Thu, 31 Mar 2022 07:34:56 GMT
microsoftsharepointteamservices: 16.0.0.22316
ms-cv: oC8RQyXwADDrBFtMacvcqA.0
nel: {"report_to":"network-errors","max_age":7200,"success_fraction":0.001,"failure_fraction":1.0}
p3p: CP="ALL IND DSP COR ADM CONo CUR CUSo IVAo IVDo PSA PSD TAI TELo OUR SAMo CNT COM INT NAV ONL PHY PRE PUR UNI"
report-to: {"group":"network-errors","max_age":7200,"endpoints":[{"url":"https://spo.nel.measure.office.net/api/report?tenantId=924c18cd-feab-4e6a-b5d2-840d1ceee5ae&destinationEndpoint=Edge-Prod-VIEr5i&frontEnd=AFD"}]}
request-id: 43112fa0-f025-3000-eb04-5b4c69cbdca8
sprequestguid: 43112fa0-f025-3000-eb04-5b4c69cbdca8
strict-transport-security: max-age=31536000
vary: Accept-Encoding
x-aspnet-version: 4.0.30319
x-cache: CONFIG_NOCACHE
x-content-type-options: nosniff
x-frame-options: SAMEORIGIN
x-ms-invokeapp: 1; RequireReadOnly
x-msedge-ref: Ref A: 7AD125E49A1D4B1AAD53FB8D014A4DD4 Ref B: VIEEDGE4419 Ref C: 2022-03-31T07:36:18Z
x-powered-by: ASP.NET

Request Headers

Accept: */*
sec-ch-ua: " Not A;Brand";v="99", "Chromium";v="100", "Google Chrome";v="100"
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/100.0.4896.60 Safari/537.36
demyren commented 2 years ago

@johannes-z , the service worker cache should respect query strings for files in the Cache storage. It should generate separate cache entries for them.

If you go to the cache storages named "Site-[identifier]" in F12->Application->Cache Storage, can you see your file in any of those storages and is it the wrong version? If you can provide the request and response headers of that specific entry that is cached, that will help me reason about why that cache entry could possibly keep getting served for you if you request a different URL altogether. Also, finally, you could try delete that one file from the cache storage and refresh the page. Does that work? That would confirm that it is the file cached in the Site-[identifier] cache storage that causes problems.

johannes-z commented 2 years ago

@demyren Since I append the date to the url for every time I load it, the URL is always different. So there is never a cache hit in the cache storage. Yet, the version of the file returned is different for subsequent, unique requests. I already posted you the two Request headers and Response headers of 2 of the requests. I couldn't see anything different than the etag and last-modified properties.

demyren commented 2 years ago

@johannes-z Then I cannot understand how the service worker could possibly interfere. It should not match any requests in the service worker cache storage if you keep generating a new URL every time. Could you go look in the mentioned cache storage for your file and provide a screenshot of the file(s) as it looks there?

demyren commented 2 years ago

@johannes-z I'm wondering if the ETag may cause this. Out of curiosity, did you try hosting these files on the public CDN? That could help determining if the issue is related to SharePoint's use of ETag.

johannes-z commented 2 years ago

@demyren It seems as if it's the interaction between the service worker and SharePoint/ETag, or just the latter, is bugged. Without the service worker the file is correctly returned. Since I generate new URLs for every request, the service worker seems to handle the request correctly (at least from what I can tell in the frontend), but it receives old SharePoint files.

Regarding the screenshots: It's identical to the request and response headers I already posted. The file content is different too.

I didn't try hosting on a CDN yet. I'm beginning to doubt that it's the service worker, but rather SharePoint and its ETag handling bugging.

demyren commented 2 years ago

@johannes-z Thank you for debugging further into this. Would it be an option for you to try host the files on Office 365 CDN?