3-2. 웹 페이지 상태를 유지하는 방법 고찰

계획한 대로 개발을 하기 위해서는, 

지난 포스팅(3-1. 서버 할당과 웹페이지 작성, taeminator1.tistory.com/4)에서 언급한 문제 중 하나는 바로 해결해야 할 것 같다. 

 

바로 두 번째 문제로 언급된 웹페이지 내부의 버튼 State에 관한 문제이다. 웹 페이지를 reload 하거나, 다시 열거나 할 때마다 기존의 버튼들이 유지되지 않고 초기화되는 문제가 있었다. 

 

첫 번째로 시도한 방법은, Javascript파일에 전역변수를 선언하여 해당 변수를 사용하는 것이었다. 하지만 웹페이지가 로드될 때마다 javaScript파일을 새로 run 시키는지, 전역 변수도 초기화되어 이 방법은 적절하지 않았다. 

 

두 번째 방법은, javaScript에서 제공하는 Local Storage를 활용하는 것이었다.

인터넷 검색을 해보니, 웹페이지에서 저장할 수 있는 방법으로 Cookies, Session Storage, Local Storage 등이 있었고, 이 중에서 Local Storage는 페이지를 다시 로드해도 해당 저장소에 저장된 것들이 사라지지 않는 장점이 있었다.

하지만, Local Storage는 단말기별로 분리되어 있어, 여러 단말기에서 공유할 수가 없었다. 예를 들어 PC에서 Local Storage를 사용해서 변수를 저장해도 아이폰에서 웹페이지를 열면 PC에서 저장한 Local Storage를 사용하는 것이 아니라, 따로 Local Storage를 만들어 사용한다. 그래서 각 단말마다 웹페이지 내부 컨트롤의 상태가 제각각이 된다. 

 

마지막 방법으로는, txt 파일을 이용하는 것이다. 지난 포스팅때 할당받은 서버에 txt 파일을 넣어 놓고, 그 파일에 이전, 또는 현재의 웹페이지에 있는 여러 컨트롤의 상태를 저장해서 사용하자는 계획이다. 현재로서는 이 방법이 이번 프로젝트에서 가장 근접한 것 같다. 

다음 포스팅에서는 txt 파일을 통해, 이전 상태를 로드하고 현재 상태를 저장하는 방법을 알아보자.