Chrome 확장 프로그램을 열 때마다 HTML을 다시로드하지 않도록하려면 어떻게해야합니까?

Question

저는 Chrome 확장 프로그램을 작업하고 있으며 파일을 열 때마다 상태를 유지해야합니다.

예를 들어 확장 프로그램을 닫았다가 다시 열면 채워져 있어야하는 입력 요소가 있습니다.

this page에서 매니페스트의 예를 발견했습니다. 그것은 내 매니페스트에 다음을 추가하기 위해 저를 리드했지만 작동하지 않았다 :

"background": { 
"persistent": true, 
"page": "popup.html" 
} 

구멍 사이의 확장 상태를 유지하는 방법이 있나요?

Answer 1

먼저 Chrome 확장 프로그램 Architecture Overview을 읽어보세요.

팝업 페이지는 팝업이 열려있는 동안에 만 존재하는 "제거 가능"페이지입니다. 당신은 그것에 영향을 줄 수 없습니다. 팝업에서 포커스를 잃으면 HTML 문서가 삭제됩니다.

대조적으로 "persistent": true이있는 배경 "페이지"(일반적으로 HTML 마크 업이 없으므로 "page" 대신에 "scripts"이 일반적으로 사용됨)가 Chrome이 실행되는 동안 존재합니다. 따라서 상태 정보를 보유 할 수 있습니다. 그러나 보이지 않는 페이지입니다.

올바른 접근 방식은 팝업 페이지를 동적으로 만들고 상태를 백그라운드 및/또는 다양한 저장소 API에 저장하고 열 때 상태를 복원하는 것입니다.

최소 예 : 링크 및 정보를

// popup.js 
// Suppose #myInput is a text input 
document.addEventListener('DOMContentLoaded', function() { 
    chrome.storage.local.get({setting: "default value"}, function(data) { 
    var inputElement = document.getElementById("myInput"); 
    inputElement.value = data.setting; 
    inputElement.addEventListener("input", function(e) { 
     chrome.storage.local.set({setting: e.target.value}); 
    }); 
    }); 
});