집 > 기사 > 웹 프론트엔드 > 내 Chrome 확장 프로그램 팝업의 클릭 이벤트가 실행되지 않는 이유는 무엇입니까?

내 Chrome 확장 프로그램 팝업의 클릭 이벤트가 실행되지 않는 이유는 무엇입니까?

Why Aren't My Chrome Extension Popup's Click Events Firing?

Chrome 확장 프로그램 팝업 클릭 이벤트가 실행되지 않음: 콘텐츠 보안 정책 위반 해결

Chrome 확장 프로그램 팝업이 버튼 클릭에 응답하지 않아 의도된 행동. 원인은 브라우저에서 시행하는 기본 콘텐츠 보안 정책(CSP)에 있습니다.

문제 이해

문제를 디버깅하려면 팝업 버튼을 마우스 오른쪽 버튼으로 클릭하세요. '팝업 검사'를 선택하세요. 인라인 스크립트가 "script-src" CSP 지시문을 위반한다는 오류 메시지가 표시됩니다. 이는 클릭 이벤트가 실행되지 않는 이유를 설명합니다.

해결책: JavaScript 코드 분리

문제를 해결하려면 HTML 파일의 모든 인라인 JavaScript 코드를 별도의 코드로 이동하세요. JS 파일. 이는 HTML 문서에서 스크립트를 분리하여 CSP 요구 사항을 따릅니다.

수정된 코드:

hello.html(팝업 페이지)

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>

popup.js

var a = 0;
function count() {
    a++;
    document.getElementById('demo').textContent = a;
}
document.getElementById('do-count').onclick = count;

참고: 원하는 경우 innerHTML을 textContent로 바꾸세요. 텍스트를 수정합니다. 이 예에서는 이것이 중요하지 않지만 복잡한 애플리케이션에서는 보안 강화(XSS 완화)를 위해 textContent를 사용하는 것이 좋습니다.

위 내용은 내 Chrome 확장 프로그램 팝업의 클릭 이벤트가 실행되지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명：