내정보

Guest 님
보유포인트
0
  • 재구매 할인
    30%
  • 컨텐츠 환불
    100%
  • 평점 포인트
    10%
  • 포인트 자동책정
    0%
콘텐츠 수 403

PWA 모듈

최초 등록일: 2021.09.17 조회수 : 479

10P

5.0점 / 총 8명 참여
  • 구매자 25
  • 소개 PWA 모듈 
  • 설치경로 /modules/pwa 
  • 지원환경 Rhymix 
  • 라이선스 GPL v2 
  • 분류 모듈
  • 제작자 단비아빠
  • 다운로드
    pwa.0.9.2.zip 60.95KB (잔여일 : -, 잔여횟수 : -)

v0.9.2

이건 몰랐던건데 serviceWorker.js는 무조건 서비스되는 웹앱의

최상위 폴더에 있어야 하는 모양입니다.

(쓰바 이런 중요한 제약사항을 왜 아무데도 안써놓는거냐구...)

웹앱의 스코프가 serviceWorker.js의 위치에 의해 제한되네요.

그것도 모르고 모듈 경로에 serviceWorker.js를 놔뒀더니만... 

저는 초기 개발 와중에 잠시 루트에다가 serviceWorker.js를 놔뒀던 적이 있어서

그게 별도 등록된채로 남아있다보니 에러를 모르고 지나간 것이었습니다.

근데 루트 폴더에 파일을 복사하는건 모듈에서 도저히 할 수 없는 작업입니다.

그러므로 반드시 수동으로!!! serviceWorker.js를 웹사이트의 루트 폴더에 복사해주세요.

index.php가 있는 바로 그 위치입니다.

불편하시겠지만 어쩔 수가 없습니다....

-------------------

v0.9.1

아직 테스트 단계인데 모듈 기능을 항상 ON 시켜놓으면 불편하실 분이 많을 것 같아서

설정에서 모듈 기능을 OFF 시킬 수 있도록 했습니다.

이제 부담없이 테스트해보세요.

-------------------

이 모듈을 설치하면 PWA 규격을 만족시켜

사이트가 웹앱으로써 설치가 가능하게 됩니다.

 

https://realfavicongenerator.net/

 

위 사이트를 이용하셔서 아이콘 생성이나

기타 추가적인 설정 태그를 만드실 수 있습니다.

댓글 '34'

프로필 사진 profile
웅돌프 2021.09.17 23:05 댓글 별점
이거 설치하면 사용자 브라우저에 홈화면에 바로가기 추가 하시겠습니까? 메시지가 뜨는 건가요?
프로필 사진 profile
단비아빠 2021.09.17 23:15 댓글 별점
프로필 사진 profile
산소아빠 2021.09.17 23:47 댓글 별점
좋은모듈공유 감사합니다. 설치는 하였는데 버튼 노출을 어떻게 시켜야할까요?
프로필 사진 profile
chronos 2021.09.18 00:01 댓글 별점
감사합니다. ^^
프로필 사진 profile
adlib 2021.09.18 04:41 댓글 별점
좋은 자료 감사합니다.
프로필 사진 profile
맘잉 2021.09.18 08:34 댓글 별점
좋은 자료 감사드립니다. 이 모듈만 설치하고 핸드폰에서 사이트에 접속하면 접속하자마자 '홈화면에 바로가기 추가~' 문구가 나오는 건가요? 아무것도 나오지 않아요ㅠ.ㅠ 그리고 설치되어 있어도 브라우저로 접속하면 매번 문구가 나오나요?
프로필 사진 profile
단비아빠 2021.09.18 15:20 댓글 별점
PWA로 인식이 되고 있는지 확인하는 법은 모바일 크롬의 경우 메뉴에 들어가서 보시면 [앱 설치]라는 메뉴가 보이면 성공입니다. PWA로 인식안된 사이트에서는 이 메뉴 자체가 뜨지를 않습니다. 데스크탑 크롬의 경우에는 주소표시줄 오른쪽 구석에 보면 앱 설치 아이콘이 표시됩니다. 그걸 눌러서 웹앱으로 설치가 가능하죠. 윈도우에서 이거 설치해본 분 별로 없을텐데 (저도 처음 해봄) 신기하더군요. 그냥 윈도우 어플처럼 시작버튼 누르면 거기 앱 목록에 아이콘이 들어갑니다.
그리고 화면 하단에 아이콘 설치하겠냐고 모바일 크롬에서 뜰겁니다.
이건 무조건 매번 뜨는게 아닙니다. 알아보니까 처음에 두어번 물어보고서 설치 안하면 더이상 안뜨고 한동안 가만 있다가 또 뜬금없이 떠서 물어보고 뭐 그런 식이랍니다. 이걸 수동 제어하는 방법은 연구중입니다.
프로필 사진 profile
웅돌프 2021.09.18 16:27 댓글 별점
크롬 PC, 모바일 모두 앱 설치 아이콘이 보이지 않습니다.
제대로 설치가 안되서 그런걸까요?
프로필 사진 profile
단비아빠 2021.09.18 17:44 댓글 별점
버그가 있었습니다. 0.9.2 받아서 시도해보세요 이번엔 잘 될겁니다
프로필 사진 profile
맘잉 2021.09.18 17:04 댓글 별점
꼭 사용해보고 싶은 기능인데 말씀하신 [앱설치] 메뉴 등이 나오지 않습니다.
라이믹스 2.0 / 아이콘 목록 주소는 /favicon/android-chrome-192x192.png 오로 설정.
혹시 realfavicongenerator.net 에서 생성된 아이콘과 설정화일을 이미 레이아웃에서 로드하고 있으면 영향이 있을 수 있을까요? site.manifest 화일을 레이아웃에서 로드하거든요.
https://scorefactory.io
프로필 사진 profile
단비아빠 2021.09.18 17:43 댓글 별점
아 주소 알려주셔서 감사합니다..
점검해보니까 버그가 있었네요 수정해서 0.9.2 올리겠습니다
프로필 사진 profile
단비아빠 2021.09.18 18:18 댓글 별점
음.. 이 모듈에서 제공하는건 pwa.js 파일을 로드하는 것과 manifest를 로드하는 것입니다.
뭐 기왕에 manifest를 수동으로 로드시킬거면 그냥 pwa.js도 수동으로 로드시키세요.
모듈 활성화를 OFF로 하시면 될겁니다. 아니면 아마 manifest를 두번 포함시키더라도
별 문제는.. 없을거 같기는 한데 정확히는 장담 못하겠습니다.
프로필 사진 profile
맘잉 2021.09.18 21:03 댓글 별점
픽스된 모듈 올리니 잘작동합니다! 수동으로 로드하면 아마 나중에 도저히 기억이 나지 않을 것 같아서 모듈 형태로 관리하는 것이 좋습니다!
PC, 안드로이드폰, 안드로이드 태블릿에서 잘 작동했고 아이폰에서는 작동하지 않는듯합니다!
프로필 사진 profile
단비아빠 2021.09.18 21:58 댓글 별점
엥? 아이폰에서 안되나요? 아이폰에서도 된다고 하던데... 확인해보겠습니다.
프로필 사진 profile
웅돌프 2021.09.18 16:18 댓글 별점
"src": "/modules/pwa/android-chrome-192x192.png"
루트경로에 android-chrome-192x192.png 파일이름으로 앱 아이콘을 넣고
src 경로를 수정해줘야 하나요?
프로필 사진 profile
단비아빠 2021.09.18 17:45 댓글 별점
예.. 루트에 파일 올리셨으면 경로도 수정해주셔야 합니다.
프로필 사진 profile
adlib 2021.09.19 01:36 댓글 별점
대박이네요.
너무 좋네요. 감사합니다.
한가지 아이폰에서는 안되나요? 아이폰에서 까지 되면 정말 대박 물건이네요.
PC에서는 잘되는 것 확인했는데 아이폰 사용자라서 크롬 설치해서 테스트해봤는데
모바일 크롬의 경우 메뉴에 들어가서 보시면 [앱 설치]라는 메뉴가 보이면 성공입니다.
라고 되어 있는데 아이폰에서는 메뉴에 [앱 설치] 가 안뜹니다.
프로필 사진 profile
단비아빠 2021.09.27 21:59 댓글 별점
개발용 아이폰이 어디갔는지 며칠째 보이질 않아서 도통 점검해볼 방법이 없네요..
https://mobilesyrup.com/2020/05/24/how-install-progressive-web-app-pwa-android-ios-pc-mac/
이걸 참고해보심이... add to home screen이 뜨면 pwa 인식인 것 같습니다.
프로필 사진 profile
adlib 2021.09.27 23:55 댓글 별점
감사합니다.
크롬에서는 안되고 답변 내용대로 사파리에서 홈화면에 추가를 해서 해보니 되기는 하는데 index 화면이 아닌 특정 url 이 지정이 되고 ex) https://test.com 이렇게 등록이 안되고 https://test.com/board 이런식으로 홈화면에 추가됩니다.
메뉴버튼 등 클릭시 반응이 원활하지 않네요.
수정이 가능 할까요?
다시 한번 감사합니다.
프로필 사진 profile
웹조아 2021.09.24 08:07 댓글 별점
좋은 기능 감사합니다!
프로필 사진 profile
마음의빈자리 2021.09.24 09:53 댓글 별점
자료 나눔 감사드려요 ^^
프로필 사진 profile
DoubleU 2021.09.24 14:00 댓글 별점
예전에 xe로 사이트 만들 때 루트폴더에 xe를 설치하지 않고 xe폴더 안에 설치를 했었습니다.
그래서 도메인으로 접속시 루트폴더에서 htaccess로 xe폴더로 이동을 시켜주었습니다.

서비스워커 파일이 루트에만 있어야 하는데 모든 것을 RewriteRule에 의해 모든 것이 xe폴더로 이동하니 xe폴더 안에 서비스워커 파일이 있어도 동작을 안하더군요.

이런 경우에는 htaccess의 서비스워커 파일을 제외하라고 RewriteRule을 수정해야 합니다.

RewriteEngine on
RewriteRule ^serviceWorker.js - [L]
RewriteRule ^(.*) /xe/$1 [R=301,L]

2번째 줄로 제외를 시켜주니 서비스워커 파일을 제대로 받아오네요.
프로필 사진 profile
DoubleU 2021.09.24 14:03 댓글 별점
그리고 pwa의 또 다른 주요기능이 푸시인데.... 혹시 그것까지 개척할 의향은 있으신가요?
프로필 사진 profile
단비아빠 2021.09.27 16:25 댓글 별점
푸쉬알림은 라이믹스에서 기본 지원되는걸로 알고 있는데요..? 혹시 XE 말씀하시는건가요?
프로필 사진 profile
DoubleU 2021.09.27 16:29 댓글 별점
앱을 별도로 만들어야 합니다.
기본적인 웹은 푸시를 받을수가 없으니까요.
웹으로 푸시를 받게 해주는 역할을 서비스워커가 하구요.
https://xetown.com/questions/1552455
프로필 사진 profile
단비아빠 2021.09.27 22:06 댓글 별점
음.. 기본으로 되는줄 알았는데 송신만 되는거였군요...
왜 수신을 구현안했을까요...
저도 라이믹스에서 기본 지원 되는줄 알고 그거 써야지 생각하고 있었는데...
언젠가 구현을 하긴 해야겠군요.... 언제가 될진 모르겠습니다만...
프로필 사진 profile
adlib 2021.09.28 00:04 댓글 별점
푸시기능까지 지원되면 초 대박이네요. ^^*
앱개발을 별도로 할 필요가 없겠네요.
화이팅~
프로필 사진 profile
DoubleU 2021.09.24 14:17 댓글 별점
안드로이드 크롬과 삼성브라우저에서 만든 앱이 스플래시 이미지의 크기가 다르더군요.
크롬은 크고, 삼성은 작더군요.
크롬이 정상이고 삼성은 작은걸 사용하는 것 같습니다.
프로필 사진 profile
웅돌프 2021.09.27 11:43 댓글 별점
2개의 사이트에 테스트를 해봤는데요.
1개의 사이트는 정상적으로 잘됩니다.
다른 1개의 사이트는 관리자 페이지에서만 설치가 뜨고,
사이트에서는 설치가 안뜨는데...뭐가 잘못 된건지 모르겠습니다.
프로필 사진 profile
단비아빠 2021.09.27 16:23 댓글 별점
안되는 사이트 주소 좀 알려주세요
프로필 사진 profile
웅돌프 2021.09.27 20:15 댓글 별점
쪽지 드렸습니다.
프로필 사진 profile
루딩 2021.09.29 04:08 댓글 별점
라이믹스 1.9x버전대는 지원이 안될까요?

/index.php?module=pwa&act=getPwaSiteManifest 경로로 타고들어가면
Template not found:이 없다고 나오네요..
serviceWorker.js 위치도 /html 폴더내에 index.php랑 놓고
파비콘들도 생성해주고 경로도 설정해줬는데 템플렛이 없다고나오네요

nginx 문제인건지..

관리자페이지에서는 site.manifest 파일정보까지 수정해서 넣어줬어요.
프로필 사진 profile
단비아빠 2021.09.29 13:51 댓글 별점
1.9.9.9는 안써봤지만.. 말씀하시는거 들어보니 안될 것 같네요...
Context::setResponseMethod() 함수가 아예 없나봅니다.
프로필 사진 profile
루딩 2021.09.30 15:04 댓글 별점
앗 그렇군요:) 2버전으로 언능 업데이트해야겠네요 감사합니다~