Chrome 확장 프로그램에서 \"Unchecked Runtime.lastError: The Message Port Closed...\" 오류를 방지하는 방법은 무엇입니까?

범인 공개: 분리된 스크립트 및 확장 프로그램 업데이트

실수로 Chrome 확장 프로그램을 다시 로드한 후 다음과 같은 성가신 오류가 발생할 수 있습니다. "검사되지 않은 런타임 .lastError: 응답을 받기 전에 메시지 포트가 닫혔습니다." 이 오류는 팝업과 콘텐츠 페이지 간의 통신을 중단시키는 고아 스크립트 생성으로 인해 발생합니다.

고아 스크립트 개념 파악

고아 스크립트는 유령 같은 잔재입니다. 확장이 업데이트되거나 다시 로드된 후에도 계속 남아 있는 이전에 로드된 확장입니다. 이 고스트 스크립트는 새 콘텐츠 스크립트를 위한 메시지를 가로채서 통신 중단을 초래합니다.

고아 스크립트 근절

이 스펙트럼 스크립트를 제거하려면 먼저 해당 스크립트가 여전히 반응이 좋습니다. 그렇다면 창 개체를 통해 새 콘텐츠 스크립트에서 메시지를 전달할 수 있습니다. 이 메시지를 받으면 고아 스크립트는 모든 이벤트 리스너의 등록을 취소하고 가비지 수집을 준비해야 합니다.

다시 로드 시 콘텐츠 스크립트 보충

이 문제가 재발하지 않도록 하려면 팝업 페이지에서 메시지를 보내기 전에 사용 가능한 콘텐츠 스크립트가 있는지 확인할 수 있습니다. 존재하지 않는 경우 콘텐츠 스크립트를 다시 삽입할 수 있습니다.

콘텐츠 스크립트용 샘플 코드

앞서 언급한 솔루션을 구현하려면 수정된 다음 content.js 스크립트를 통합하세요.

<code class="javascript">var orphanMessageId = chrome.runtime.id + 'orphanCheck';
window.dispatchEvent(new Event(orphanMessageId));
window.addEventListener(orphanMessageId, unregisterOrphan);

// ... (register named functions for event listeners)

window.running = true;

function unregisterOrphan() {
  // ... (deregister listeners and nullify variables)
}

function onMessage(msg, sender, sendResponse) {
  // ... (handle message)
}

function onMouseMove(event) {
  // ... (DOM event handler)
}</code>

팝업 페이지 확인

메시지 전송 전에 콘텐츠 스크립트가 삽입되도록 하려면 다음 코드 조각으로 popup.js 스크립트를 향상하세요.

<code class="javascript">async function sendMessage(data) {
  // ... (fetch active tab)
  if (await ensureContentScript(tab.id)) {
    return await chrome.tabs.sendMessage(tab.id, data);
  }
}

async function ensureContentScript(tabId) {
  // ... (check for existing content script)
  if (!result) {
    await chrome.scripting.executeScript({
      // ... (inject content script)
    });
  }
  return true;
}</code>

이러한 조치를 구현하면 고아 스크립트를 제거하고 확장 프로그램의 팝업 페이지와 콘텐츠 페이지 간의 원활한 통신을 유지할 수 있습니다.

위 내용은 Chrome 확장 프로그램에서 \"Unchecked Runtime.lastError: The Message Port Closed...\" 오류를 방지하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!