반응 앱을 만들 때 서비스 워커가 기본적으로 호출됩니다. 서비스 워커가 사용되는 이유는 무엇입니까? 기본 호출의 이유는 무엇입니까?
답변
애플리케이션에 서비스 워커가 필요하지 않을 수 있습니다. create-react-app으로 프로젝트를 생성하는 경우 기본적으로 호출됩니다.
이 기사에서는 서비스 워커에 대해 잘 설명 합니다. 그것을 요약하려면
A
service worker
는 브라우저가 웹 페이지와 별도로 백그라운드에서 실행되는 스크립트로, 웹 페이지 나 사용자 상호 작용이 필요하지 않은 기능에 대한 문을 엽니 다. 오늘날, 그들은 이미 같은 기능을 포함push notifications
하고background sync
그리고이
ability to intercept and handle network requests
포함
programmatically managing a cache of responses
.앞으로 서비스 워커는
periodic sync
또는 같은 다른 것을 지원할 수 있습니다
geofencing
.
이 PR에 따르면 create-react-app
Service workers
를 통해 create-react-app에 도입되었습니다
SWPrecacheWebpackPlugin
.캐시 우선 전략과 함께 서버 작업자를 사용하면 네트워크가 더 이상 탐색 요청을 수행하는 데 병목 현상이 발생하지 않기 때문에 성능상의 이점이 있습니다. 그러나 이전에 캐시 된 리소스가 백그라운드에서 업데이트되므로 개발자 (및 사용자)는 페이지에 대한 “N + 1″방문시 배포 된 업데이트 만 볼 수 있습니다.
에 대한 호출 register service worker
은 새 앱에서 기본적으로 활성화되어 있지만 언제든지 제거 할 수 있으며 일반 동작으로 돌아갑니다.
답변
간단하고 평이한 말로 브라우저가 백그라운드에서 실행되고 웹 페이지 또는 DOM과 아무런 관련이 없으며 즉시 사용 가능한 기능을 제공하는 스크립트입니다. 또한 사용자가 오프라인이거나 느린 네트워크에있을 때 자산 및 기타 파일을 캐시하는 데 도움이됩니다.
이러한 기능 중 일부는 프록시 네트워크 요청, 푸시 알림 및 백그라운드 동기화입니다. 서비스 워커는 사용자에게 풍부한 오프라인 경험을 제공합니다.
서비스 워커는 클라이언트와 서버 사이에있는 사람으로 생각할 수 있으며 서버에 대한 모든 요청은 서비스 워커를 통과합니다. 기본적으로 중개인입니다. 모든 요청이 서비스 워커를 통과하므로 이러한 요청을 즉석에서 가로 챌 수 있습니다.
답변
고려해야 할 서비스 워커에 대한 두 가지 중요한 고려 사항을 추가하고 싶습니다.
-
서비스 워커에는 HTTPS가 필요합니다. 하지만 로컬 테스트를 사용하려면이 제한이
localhost
. 이는 서비스 워커가 웹 애플리케이션과 서버 사이의 중간에 있는 사람 처럼 행동하기 때문에 보안상의 이유 입니다. -
으로는 앱 반작용 만들기 실행하는 경우, 예를 들어, 서비스 노동자는 생산 환경에서 사용할 수 있습니다
npm run build
.
Service Worker는 프로그레시브 웹 앱 개발을 돕기 위해 여기에 있습니다. Create React App의 맥락에서 이에 대한 좋은 리소스는 여기 웹 사이트 에서 찾을 수 있습니다 .