답변:
일반적으로 서비스 워커를 사용하려면 HTTPS를 통해 페이지와 서비스 워커 스크립트를 모두 제공해야합니다. 그 이유는 강력한 새 기능을 위해 안전한 출처 선호에 설명되어 있습니다.
로컬 개발을 용이하게하기위한 HTTPS 요구 사항에는 예외가 있습니다.를 통해 http://localhost[:port]
또는을 통해 페이지 및 서비스 워커 스크립트에 액세스하는 경우 http://127.x.y.z[:port]
추가 작업없이 서비스 워커를 사용 설정해야합니다.
크롬의 최신 버전, 당신은을 통해 지역 발전을 duriing이 요구 사항을 해결할 수 있습니다 chrome://flags/#unsafely-treat-insecure-origin-as-secure
, 이 답변에 설명 된대로 .
Firefox 는devtools.serviceWorkers.testing.enabled
설정을 통해 유사한 기능을 제공 합니다.
이 기능은 다른 방법으로는 수행 할 수없는 테스트를 용이하게하기위한 것일 뿐이며 사이트의 프로덕션 버전을 제공 할 때 항상 HTTPS 사용을 계획해야합니다. 실제 사용자에게 해당 플래그를 활성화하는 단계를 거치도록 요청하지 마십시오!
devtools.serviceWorkers.testing.enabled
.
프로그레시브 웹 앱의 실제 동작 테스트를 위해 플러그인 된 모바일 장치의 서비스 워커 를 디버깅 하려는 경우 SSL 크롬 시작 옵션이 도움이되지 않으며 인증서를 구매할 필요가 없습니다.
@ chris-ruppel은 프록시 소프트웨어 설치를 언급했지만 실제로 포트 포워딩을 사용 하는 더 쉬운 방법이 있습니다 .
Chrome을 사용하여 기기를 연결하고 디버그한다고 가정합니다.
그런 다음 모바일 장치 에서 URL " http : // localhost : 8080 "을 호출 할 수 있으며 실제 PC / 테스트 서버 의 "localhost : 80"에 의해 응답됩니다 . 마치 모바일에서 실행되는 로컬 컴퓨터 인 것처럼 서비스 작업자와 완벽하게 작동합니다.
모바일 장치에서 권한이없는 포트를 사용하는 것을 기억하는 한 여러 포트 전달 및 다른 대상 도메인에서도 작동합니다. 스크린 샷보기 :
이 정보의 출처는 Google 원격 장치 문서입니다 : https://developers.google.com/web/tools/chrome-devtools/remote-debugging/local-server (그러나 2017 년 4 월 현재이 내용을 읽는 것이 명확하지 않습니다. 간단한 대답)
저는 종종 실제 장치에서 디버그하고 테스트하고 싶습니다. 내가 생각 해낸 한 가지 방법은 로컬 개발 중에 Charles Proxy를 통해 전화의 네트워크 트래픽을 라우팅하는 것 입니다. 모든 Chrome 전용 솔루션과 달리 이것은 휴대 전화의 모든 브라우저에서 작동합니다.
localhost
이제 내 모바일 장치에서 방문 하면 서비스 워커를 등록하고 테스트 할 수 있습니다.제 경우에는 pwa를 테스트하는 가장 쉬운 방법은 ngrok를 사용하는 것입니다. https://ngrok.com/download 로그인하고 토큰을 받고 설정하세요!
실행할 때 ./ngrok http {your server port}
위의 명령을 실행 한 후 터미널에 표시되는 https를 사용하는지 확인하십시오.
https://surge.sh 도 사용할 수 있습니다. 여기를 방문하면 정적 웹 페이지를 호스트하기위한 것입니다 . https://surge.sh/help/securing-your-custom-domain-with-ssl 은 다음을 수행 할 수 있습니다. SSL 인증서 설정 방법보기
Jeff가 첫 번째 응답에서 언급했듯이 Service Worker를 테스트하기 위해 localhost 수준에서 https가 필요하지 않습니다. 서비스 워커는 HTTPS없이 localhost 도메인에 액세스하는 한 정상적으로 등록하고 작동합니다.
localhost에서 애플리케이션을 테스트하고 실제 https에서 어떻게 작동하는지 확인하려면 가장 간단한 방법은 앱을 GitHub에 업로드하는 것입니다. 무료로 (그리고 HTTPS로!) 퍼블릭 도메인을 만들 수 있습니다.
지침은 다음과 같습니다 : https://pages.github.com/
localhost에서 웹 서버를 실행할 수없는 클라이언트 장치에서 서비스 워커를 테스트하려는 경우 일반적인 기술은 다음과 같습니다.
그러나 이것은 말처럼 쉬운 일입니다. 2016 년 11 월 Reddit의 AMA에서 Let 's Encrypt 담당자 는 사설 LAN의 HTTPS가 "정말 어려운 질문이며 지금까지 만족스러운 답변을 제시 한 사람은 아무도 없다고 생각합니다."라고 인정했습니다.
컴퓨터에 호스트 이름을 지정하는 일반적인 방법은 매일 또는 인터넷 게이트웨이 어플라이언스의 전원을 껐다 켤 때마다 변경되는 것이 아니라 안정적인 내부 IP 주소를 제공하는 것입니다. 특정 개인 주소 (일반적으로 10/8
또는 내부 192.168/16
)를 개발 워크 스테이션 이더넷 카드의 MAC 주소와 연결하는 "예약"을 설정하려면 일반적으로 게이트웨이에있는 네트워크에서 DHCP 서버를 구성해야합니다 . 이를 위해 게이트웨이 설명서를 읽으십시오.
이제 개발 워크 스테이션에 안정적인 IP 주소가 있으므로 시간 / 돈의 균형이 맞습니다. 고급 DNS 및 OpenSSL 사용법을 배우고 테스트하려는 모든 장치에 루트 인증서를 설치하려는 경우 :
다른 사람이 소유 한 장치 (BYOD) 또는 사용자가 신뢰할 수있는 루트 인증서를 추가하는 것을 허용하지 않는 더 잠긴 브라우저로 테스트하려는 경우와 같이 루트 인증서를 추가하거나 로컬 DNS를 제어 할 수없는 경우 비디오 게임 콘솔을 사용하려면 정규화 된 도메인 이름 (FQDN)이 필요합니다.
A
에서 개발 워크 스테이션의 개인 IP 주소에 있는 레코드를 가리 킵니다 . 이렇게하면 개발 워크 스테이션에 FQDN이 제공됩니다.dns-01
하여 Let 's Encrypt 인증 기관에서이 FQDN에 대한 인증서를 얻습니다.서비스 워커를 테스트하는 가장 쉬운 방법은 무료 호스팅 제공 업체를 찾는 것입니다. 요즘에는 무료 호스팅을 제공하는 사이트가 많이 있습니다. 이 무료 서버에서 앱을 쉽게 호스팅 할 수 있습니다.
나는 주로 heroku 와 netlify를 사용 합니다. 이것은 무료이며 사용하기 쉽습니다.