기본 콘텐츠로 건너뛰기

[html5] application cache


안드로이드 아이폰 두 벌 만드느니,
차라리 웹 하나로 만들자
뜬구름 잡는 소린줄 알았는데,
이번에 application cache 보면서
html5가 새삼 다르게 보이는게
webos기반에서
html5로 만드는 앱이
나오긴 나올것 같다.
암튼지간에,
application cache 쓰는법을 설명하자면.
1. manifest 파일을 하나 생성
2. 현재 html에서 참조하는, 캐싱이 필요한 js,css 목록들을 적어준다.
3. manifest 파일을 html에서 include 한다.
끝. 간단하다.
이렇게만 하면,
페이지에 처음 한번 접속한 이후부터는
오프라인 상태에서도 실행 할 수 있다. 
manifest 파일
- 방금말한대로 캐싱할 파일들 목록을 적어주는 곳
- 'CACHE MANIFEST' 라는 문구로 시작
- 캐싱방법
. CACHE : 캐쉬할 파일 (문구 표기 생략가능)
. NETWORK : 캐싱하면 안되는 파일 온라인 상태에서만 가능한
. FALLBACK : 캐싱실패 했을때 대체 파일 (ex: A   B - A가 없으면 B 호출)
- 아직은 용량이 5MB 밖에 안됨.
- 주석표시는 '#' 으로
ex) cache.manifest
CACHE MANIFEST
#v 1.0001

CACHE:
css/jquery.mobile-1.0a2.min.css
css/test.css
js/jquery.mobile-1.0a2.min.js
js/jquery-1.7.1.js

NETWORK:
test.jsp

FALLBACK:
A     B
ex) test.jsp
<! DOCTYPE html>
< html manifest ="cache.manifest" >
.....
</html>
cache 업데이트 
- 일단 기본적으로 mafnifest 내용이 수정되야만 앱캐쉬가 변경됨.
- 즉 manifest에 들어있는 a.png라는 이미지가 변경되었지만 파일변경 그대로 a.png 라면 앱캐쉬는 예전 내용만 보여줌.
- 그래서 주석으로 버전명 표기하는식으로 많이 사용
cache 상태
- 상태값 = window.applicationCache.satus
- UNCACHED = 캐쉬초기화전(maifest 비교전)
- IDLE = 더 이상 다운로드 할게 없음
- CHECKING = 업데이트 준비 (manifest 비교중)
- DOWNLOADING - 캐시 다운로드중
- UPDATEREADY = 새버전으로 업데이트완료
- OBSOLETE = manifest 파일 못 찾음. 캐쉬삭제.

cache 함수
- update() : manifest 파일 비교
- swapCache() : 캐쉬교체 (캐쉬상태가 updateready 일때 가능)
applicaion cache 관련 블로그 

http://www.html5rocks.com/en/tutorials/appcache/beginner/
http://xguru.net/621

태그

라벨:

댓글

댓글 쓰기

이 블로그의 인기 게시물

메일서버가 스팸으로 취급받을때

설치한 메일서버를 통해 발송되는 메일이 스팸으로 들어가는 경우가 더러 있다. 이게 한번 들어가기는 쉬운데, 빠져나오기는 드럽게 힘든것 같다... 본인의 경우에는 우선 국내서비스에는 별 무리 없이 들어간다. (naver,daum 등) 그런데 해외메일 그중 Gmail, Hotmail 에는 에누리없이 스팸으로 간주되고 있었다. Gmail같은 경우에는 그래도 스팸함으로 발송은 제대로 되는반면에 Hotmail같은경우에는 아예 수신자체가 안되는 경우도 더러있다.. ㅡ,.ㅡ; 제일 좋은 방법은 Gmail,Hotmail에 전화걸어서 우리 메일서버 IP white Ip로 등록해달라!!! 하면 좋지만, 얘네들은 걸어봤자 자동응답기고, 문의채널은 구글 그룹스 게시판이 전부다.. 본론으로 들어가서. 해외 메일이 차단될 경우 내 매일서버ip가 스팸ip로 등록되 버린 경우일 수 있다. (본인처럼. ㅎ) 이것부터 조회 해보고 싶으면 RBL(real-time blocking List) 체크를 해야 하는데, RBL체크 해주는 사이트는 꽤 많이 있고, 그중 좀 깔끔해 보이는곳 하나 소개. http://www.anti-abuse.org/ 메일서버ip 입력하고 조회해보면 쭈루룩 리스트가 나온다. 그 중 빨간불이 들어온 부분이 메일 서버가 스팸서버가 된 각종 이유들이다.ㅋ 본인의 경우 CBL 때문에 걸렸는데, 내용은 아래와 같다. This IP address is HELO'ing as  "localhost.localdomain"  which violates the relevant standards (specifically: RFC5321). 메일서버 도메인에 별다른 작업을 안해놓아서 "localhost.localdomain" 으로 설정되어있었다. 만약 CBL만 바로 테스트 해보고 싶으면 http://cbl.abusea...
댓글 4개
자세한 내용 보기

[javascript] 특정시간에만 함수 실행

특정시간에만 팝업을 띄우려면?? 특정시간에만 로그인을 막으려면?? 특정시간에만 할일은 의외로 참 많다. 방법? 딱히 없다. 현재시간 구해서 시작시간, 종료시간 사이에 있을때 시작하는 수밖엔. if ((현재시간 > 시작시간) && (현재시간 < 종료시간)){ .. 팝업노출(); 공사페이지 리다이렉트(); 기타등등(); .. } 자바스크립트로 작성하면 다음과 같다. var startdate = "2014012008" ; var enddate = "2014012418" ; var now = new Date (); //현재시간 year = now. getFullYear (); //현재시간 중 4자리 연도 month = now. getMonth () + 1 ; //현재시간 중 달. 달은 0부터 시작하기 때문에 +1 if ((month + "" ). length < 2 ){ month = "0" + month; //달의 숫자가 1자리면 앞에 0을 붙임. } date = now. getDate (); //현재 시간 중 날짜. if ((date + "" ). length < 2 ){ date = "0" + date; } hour = now. getHours (); //현재 시간 중 시간. if ((hour + "" ). length < 2 ){ hour = "0" + hour; } today = year + "" + month + "" + date + "" + hour; //오늘 날짜 완성. / / 시간비교 i...
댓글 6개
자세한 내용 보기

(java) 크롬에서 쿠키 삭제 안되는 경우

  java에서 쿠키 삭제하는 방법은 똑같은 이름의 쿠키를 만들고 업데이트 하는 방식이다.  이때 maxAge를 '0' 으로 설정한다.  그래서 아래처럼 코딩한결과  크롬을 제외한 나머지 브라우저에서는 전부 쿠키가 삭제가 되었으나 크롬만 삭제가 되지 않았다.  문제의코드 Cookie cookie = new Cookie(name , null ) ; cookie.setHttpOnly( false ) ; cookie.setMaxAge( 0 ) ; cookie.setPath( "/" ) ; cookie.setDomain( "test.co.kr" ) ; 결론만 얘기하면  Secure 설정을 ture로 추가해서 해결했다.  https, ssl 기반에서만 주고받을 수 있게된다.  public void setSecure ( boolean flag) { secure = flag ; } /** * Returns <code> true </code> if the browser is sending cookies only over a * secure protocol, or <code> false </code> if the browser can send cookies * using any protocol. * * @return <code> true </code> if the browser uses a secure protocol; * otherwise, <code> true </code> * @see #setSecure */ 원인은 이사이트의 쿠키설정중 samesite가 'none' 으로 설정되어있었다.  samesite가 none인 경우에는 반드시 secure 옵션을 같이 넣어줘야 크롬에서 정상동작한다. (chrome 80 버전 업데이트 이슈) 웹서버에서 변경하고 싶으면 nginx.c...
댓글 쓰기
자세한 내용 보기