WordPress 웹 사이트를 프로그레시브 웹 앱으로 변환
Progressive Web App을 만들고 있습니다만, 아직 온라인에서는 문서나 서포트가 거의 없습니다.저는 이 메일에 궁금한 점을 모두 기재하고 있습니다.
데스크톱용 Service Worker API(Offline Mode)의 현재 지원은 무엇입니까?모바일(Android-Chrome)에서는 오프라인 모드로 동작하지만 데스크톱(Chrome42)에서는 동작하지 않는 작은 앱을 작성했습니다.이를 위해 개발 환경을 구성해야 하므로 애플리케이션 테스트에 무엇이 필요한지 알아야 합니다.IOS-Safari/Chrome에서도 동작하지 않습니다.
서비스 작업에서는 캐시를 광범위하게 사용하고 있으며, Dekstop Chrome에서 서비스 워커의 내부 디버깅 또는 등록 해제 방법을 사용할 수 있습니다.그러나 모바일에서 애플리케이션을 실행하는 경우 서비스 워커의 캐시를 삭제하려면 어떻게 해야 합니까?
응답성이 뛰어난 애플리케이션(WordPress 사이트)이 있어 PWA로 변환해야 하는 경우, RestAPI for mobile version을 사용하여 애플리케이션을 다시 작성해야 합니까?(PWA의 App Shell을 읽습니다).PWA에서는 애플리케이션 셸이 데이터와 분리되지만 WordPress와 같은 CMS에서는 데이터가 UI와 분리되지 않습니다.
나는 오랫동안 이 답을 찾았지만 마땅한 지원을 찾을 수 없었다.
데스크톱용 Service Worker API(Offline Mode)의 현재 지원은 무엇입니까?모바일(Android-Chrome)에서는 오프라인 모드로 동작하지만 데스크톱(Chrome42)에서는 동작하지 않는 작은 앱을 작성했습니다.이를 위해 개발 환경을 구성해야 하므로 애플리케이션 테스트에 무엇이 필요한지 알아야 합니다.IOS-Safari/Chrome에서도 동작하지 않습니다.
Safari는 현재 서비스 워커를 지원하지 않지만 Chrome 42에서 작동하지만 브라우저 업데이트를 고려해야 합니다.어쨌든, 다양한 장소에서 최신 기술을 확인할 수 있습니다.
- 서비스 워커: https://platform-status.mozilla.org/ #service-worker
- 푸시 API: https://platform-status.mozilla.org/ #push
- 백그라운드 동기화: https://platform-status.mozilla.org/ #background-sync
소프트웨어 상세:
- 서비스 워커는 준비가 되었습니까?https://jakearchibald.github.io/isserviceworkerready/
- 사용할 수 있나요? http://caniuse.com/ #http=서비스 워커
서비스 작업에서는 캐시를 광범위하게 사용하고 있으며, Dekstop Chrome에서 서비스 워커의 내부 디버깅 또는 등록 해제 방법을 사용할 수 있습니다.그러나 모바일에서 애플리케이션을 실행하는 경우 서비스 워커의 캐시를 삭제하려면 어떻게 해야 합니까?
데스크톱 크롬에서 Android용 Chrome을 디버깅해야 합니다.
어쨌든 Chrome://service workers-internals라는 URL은 Android용 Chrome에서 사용할 수 있지만 오프라인 캐시를 쉽게 지울 수 있는 방법은 없습니다.
응답성이 뛰어난 애플리케이션(WordPress 사이트)이 있어 PWA로 변환해야 하는 경우, RestAPI for mobile version을 사용하여 애플리케이션을 다시 작성해야 합니까?(PWA의 App Shell을 읽습니다).PWA에서는 애플리케이션 셸이 데이터와 분리되지만 WordPress와 같은 CMS에서는 데이터가 UI와 분리되지 않습니다.
아니요. 사실 WP는 주제와 콘텐츠를 분리할 수 있는 훌륭한 아키텍처를 가지고 있습니다.문제는 이 서버에서 실행되지만 PWA가 되기 위해 클라이언트에서 사이트를 실행할 필요는 없다는 것입니다.Mozilla는 WordPress 설치를 진행하기 위해 WP 플러그인 제품군을 지원합니다.
- Offline Shell [github]는 셸 자산(테마 파일 등)을 식별하고 오프라인 캐시에 캐시합니다.
- Offline Content [github]는 동적 콘텐츠를 식별하고 사용자가 방문할 때 캐시합니다.
- Web Push [github]를 사용하면 새로운 콘텐츠를 게시하는 즉시 실시간 알림을 독자에게 푸시할 수 있습니다.
- Add To Home Screen [github](홈 화면에 WordPress를 배치하여 독자를 매료시킵니다)
모두 매우 젊은 플러그인이지만, GitHub에서 추적해, 원한다면 투고할 수 있습니다!
@Salva에 의해 매우 훌륭하고 도움이 되는 답변이 이미 추가되어 있습니다만, 도움이 될 만한 것을 몇 가지 추가하도록 하겠습니다.
세 번째 파트에서는 자동 프로그레시브 웹 앱 컨버터 플랫폼인 https://www.escalatingweb.com에서 작업했습니다.이 플랫폼을 사용하여 WordPress의 웹 앱을 프로그레시브 웹 앱으로 변환할 수 있을 것 같습니다.몇 분 안에 웹 앱을 pwa로 변환할 수 있습니다.또한 자동 pwa 컨버터 플랫폼 http://www.techromance.com/2017/07/22/automatic-pwa-converter-platform/을 사용하기 위한 매우 좋은 튜토리얼도 작성했습니다.
두 번째 파트에서는 위의 답변에 덧붙이기 위해 테스트 목적으로 특정 웹 사이트의 캐시를 사이트 설정에서 모두 삭제하면 서비스 워커의 캐시가 지워집니다.
첫 번째 파트에는 덧붙일 게 없어요.
추신. 혹시나 제 플랫폼을 홍보하는 값싼 방법이라고 생각할지 모르니 아무도 기분 나쁘게 생각하지 마세요.그 목적은 단지 플랫폼을 구축하거나 필요한 청중에게 인식시킴으로써 커뮤니티를 돕는 것이다.@McNab 제안 감사합니다.:)
저도 워드프레스 사이트를 사용하고 있는데, 당신의 문제를 해결할 수 있는 플러그인이 있습니다.Mozilla 플러그인을 많이 설치하는 대신 Super Progressive Web Apps 플러그인을 설치할 수 있습니다(플러그인 설치에서 검색). 완벽하게 작동합니다.Android Phone과 IOS https://wordpress.org/plugins/super-progressive-web-apps/ 모두에서 시험해 보았다.
언급URL : https://stackoverflow.com/questions/36565068/converting-wordpress-website-to-progressive-web-app
'programing' 카테고리의 다른 글
React.forwardRef를 사용하는 것과 커스텀 레퍼런스 프로포즈를 사용하는 것의 가치 (0) | 2023.03.07 |
---|---|
브라우저에서 testacular를 사용한 디버깅(현재의 카르마) (0) | 2023.03.07 |
React Native: 텍스트를 중앙에 배치하는 방법 (0) | 2023.03.07 |
동기 XMLHttpRequest를 사용해야 하는 이유가 있습니까? (0) | 2023.03.07 |
SQL JPA - 여러 열을 기본 키로 지정 (0) | 2023.03.07 |