Total: Today: Yesterday:
연구소/Chrome Extension | 2016. 4. 4. 16:11 | Posted by 자수씨

본 포스트는 크롬 익스텐션 개발자 페이지(https://developer.chrome.com/extensions/overview)를 토대로 작성되었습니다.


그냥 공부하는 차원에서 개발자스러운 번역 중...



페이지 간 통신


익스텐션 안에 있는 HTML 페이지들은 종종 통신을 필요로 한다. 익스텐션의 모든 페이지들은 같은 프로세스의 같은 스레드에서 수행되기 때문에 페이지들은 다른 페이지의 함수를 직접 호출할 수 있다.



익스텐션 안에 있는 페이지를 찾는다면 chrome.extension 의 getViews() 나 getBackgroundPage() 를 사용한다. 일단 페이지는 익스텐션 안에서 다른 페이지의 참조를 가지며, 첫 페이지는 다른 페이지의 함수를 호출할 수 있고, 다른 페이지의 DOM 을 조종할 수 있다.




데이터 저장 및 익명 모드(시크릿 모드?)


익스텐션은 HTML5 web storage API(localStorage 와 같은) 나 서버에 데이터 저장을 요청하는 방식으로 데이터를 저장할 수 있다. 언제라도 저장하기를 원한다면 익명모드의 창으로 부터를 첫번째로 고려해야 한다. 기본적으로 익스텐션은 익명의 윈도우에서 실행되지 않는다. 사용자의 기대에 의해 익명의 브라우저에서 필요할 수 있음을 고려해야 한다.



익명 모드는 윈도우가 아무런 흔적을 남기지 않음을 보장한다. 익명의 윈도우에서 데이터를 다룰 때 이것을 보장하기 위해 최선을 다해야 한다. 예를 들어 익스텐션이 일반적으로 브라우징 히스토리를 남긴다면 익명의 윈도우에서는 히스토리를 저장하지 않도록 해야한다. 반면에 익스텐션의 설정은 익명이건 아니건 간에 저장할 수 있어야 한다.



익명의 모드를 감지하려면 tabs.Tab 이나 windows.Window 객체의 incognito 프로퍼티를 체크한다.



### javascript

function saveTabData(tab, data) {

  if (tab.incognito) {

    chrome.runtime.getBackgroundPage(function(bgPage) {

      bgPage[tab.url] = data;      // 메모리에만 저장

    });

  } else {

    localStorage[tab.url] = data;  // 로컬데이터에 저장

  }

}




기본적인 것들은 슭 훑어봤으니 간단한 예제 만들러 갑니다//