2013-11-02 2 views
1

HTML5 및 로컬 저장소를 사용하면 웹 페이지의 상태를 저장하는 데 JavaScript를 사용할 수 있습니까?로컬로 JavasScript 설정 저장

예를 들어 일부 사이트에는 JS로 제어 될 가능성이 가장 높은 increase font size 버튼이 있습니다. 새로 고침 할 때 크기가 동일하도록 속성을 어떻게 저장할 수 있습니까? 아니면 JS없이 끝났습니까?

답변

2

새로운 세션에서 설정을 유지하지 않는 한 가장 좋은 방법은 localStorage입니다.이 경우에는 sessionStorage을 사용하십시오. 여러 설정이있는 경우 일련 화 된 설정을 저장할 수 있습니다.

예.

var settings = { 
    fontSize: '11px', 
    otherConfig: 'test' 
}; 

localStorage.setItem('settings', JSON.stringify(settings)); 

//then you can retrieve it 
settings = JSON.parse(localStorage.getItem('settings')); 

console.log(settings.fontSize); //11px 

사용자가 여러 컴퓨터에서 연결할 때 설정을 유지하려면 일부 서버 측 지원을 사용해야합니다.

+0

도움을 주셔서 감사합니다. – jpQuick

2

예, 자바 스크립트로 처리됩니다. 당신은이 페이지의 세션 기간 동안 사용할 수 저장 영역을 유지하는 전역 객체 (sessionStorage)입니다

  • Cookies

  • Sessionstorage

    사용할 수 있습니다. 페이지 세션은 브라우저가 열려 있고 페이지 재로드 및 복원시까지 지속됩니다. 새 탭이나 창에서 페이지를 열면 새 세션이 시작됩니다.

  • Localstorage

    localStorage

    적용 같은 동일 출처 규칙 sessionStorage과 동일하지만 지속됩니다.

더 나은/쉬운 것들 sessionStoragelocalStorage 있습니다. 문제는 오래된 브라우저가 지원하지 않는다는 것입니다.

대신 쿠키를 다루는 것은 악몽 일 수 있지만 오래된 브라우저에서도 작동합니다.

+0

브라우저가 닫히면 만료되므로 'sessionStorage'를 사용할 수 없습니다. – plalx

+1

어느 것이 더 낫고, 더 쉽고, 더 많은 이점이 있습니까? – jpQuick

+0

쿠키가 가장 많은 브라우저를 지원하지만 쿠키가 각 요청과 함께 서버로 다시 전송되기 때문에 많은 네트워크 오버 헤드가 발생합니다. IE8 지원이 필요하지 않으면 Localstrorage가 최상의 솔루션입니다. – AHM

1

예는 상태를 localStorage에 저장할 수 있습니다.

var settingsObj={ 

    pageClass:'bigFont', 
    widgetSortOrder : [1,5,3,7] 

} 

당신은 객체를 stringifying에 의해 하나의 로컬 스토리지 키에 그 전체 개체를 저장할 수 :

하면 객체가 있다고 가정.

localStorage.setItem('mySettings', JSON.stringify(settingsObj)); 

스토리지에서 검색 및 JS 객체

로 변환 :이 키는 로컬 스토리지에 존재하여 사용자가 자바 스크립트가 그

는 캐릭터 라인 화 설정 저장과에 NeDS에 무엇이든이있는 경우 페이지가로드 당신은 볼 것이다 때

var settings=JSON.parse(localStorage.getItem('mySettings')); 
관련 문제