Chrome에서 중복 요청 발생

팀 여러분,

저희 팀은 Discourse 포럼을 관리하고 있으며, Chrome에서는 중복 요청 문제가 발생하지만 Firefox나 Safari에서는 발생하지 않는 현상을 겪고 있습니다. 이 문제가 Service Worker - workbox와 관련이 있다고 의심하고 있습니다.

현재 설정은 다음과 같습니다.

  1. 도메인: https://example.com
  2. 스크립트가 서브패스에 호스팅됨: https://example.com/assets/myScript.js
  3. myScript가 외부 엔드포인트 - https://foobar.com/ 에 GET 호출을 수행합니다.

발생하는 문제는 무엇인가요?

  1. 포럼에 처음 방문하거나(또는 하드 리프레시할 때) 브라우저에서 단일 요청이 전송됩니다.
  2. 두 번째 요청 시에는 브라우저에서 두 개의 요청이 전송됩니다. 하나는 Service Worker에서 서빙되는 파일로부터, 다른 하나는 fetchWrapper.mjs - workbox/packages/workbox-core/_private/fetchWrapper.mjs at 194cdeb63d5abb21490f88f01f02f4bcf7e6d54b · GoogleChrome/workbox · GitHub 로부터 전송됩니다.

추가 정보:
https://github.com/discourse/discourse/blob/master/app/assets/javascripts/service-worker.js.erb#L18-L35 - 이 설정은 Service Worker 생성을 담당합니다. Network first 전략을 사용합니다.

이를 어떻게 수정할 수 있을까요?
auth와 마찬가지로 https://github.com/discourse/discourse/blob/master/app/assets/javascripts/service-worker.js.erb#L10 - /analytics/를 라우트로 노출하거나, 사용자가 NetworkOnly로 설정되는 사용자 정의 라우트 배열을 전달할 수 있도록 구성 가능하게 만들 수 있습니다. 저희 환경은 Docker와 EC2를 사용하므로, 해당 부분에서도 이 설정이 노출되어야 합니다.

두 요청이 실제로 네트워크로 전송되는지 확인해 보셨나요? 두 번째 요청은 첫 번째 요청에 응답하기 위해 사용되는 것으로 보입니다.

네. 저희 환경에서는 분석 코드에서 이런 문제가 발생하고 있으며, 이로 인해 분석 데이터가 두 배로 중복되고 있습니다.

이것들은 중복된 요청이 아니라, Chrome Dev Tools가 서비스 워커 프록시를 표시하는 방식의 특성일 뿐입니다.

또한 애플리케이션 로그를 확인하면 /latest.json과 같은 어떤 경로에서도 서버가 중복 요청을 받지 않는 것을 볼 수 있습니다.

따라서 이는 Discourse의 버그가 아닙니다.

팀 여러분, 정말 감사합니다. 실제로 이것은 Chrome의 특이한 동작입니다. 데이터는 중복 제거가 되어 있는데, Chrome은 여러 요청을 표시하고 있습니다.