내 Chrome 확장 프로그램 팝업 클릭 이벤트가 작동하지 않는 이유는 무엇입니까?
- Susan Sarandon원래의
- 2024-12-06 01:18:10399검색
Chrome 확장 팝업 문제 해결: 클릭 이벤트 처리
JavaScript로 Chrome 확장 팝업을 생성할 때 클릭 이벤트가 발생하는 문제가 사용자에게 발생할 수 있습니다. 올바르게 처리되지 않았습니다. 이는 기본 콘텐츠 보안 정책(CSP) 위반으로 인해 발생할 수 있습니다.
문제 설명:
개발자가 확장 기능 내에 JavaScript 변수와 버튼을 생성했습니다. 팝업. 버튼을 클릭하면 변수가 1씩 증가할 것으로 예상됩니다. 그러나 코드가 의도한 대로 작동하지 않습니다.
Manifest.json 구성:
{
"name":"Facebook",
"version":"1.0",
"description":"My Facebook Profile",
"manifest_version":2,
"browser_action":{
"default_icon":"google-plus-red-128.png",
"default_popup":"hello.html"
}
}
팝업페이지 HTML:
<!DOCTYPE html>
<html>
<head>
<script>
var a=0;
function count()
{
a++;
document.getElementById("demo").innerHTML=a;
return a;
}
</script>
</head>
<body>
<p>
설명:
이 문제는 HTML 파일에 인라인 JavaScript가 있기 때문에 발생합니다. 인라인 JavaScript는 기본 CSP에 의해 금지됩니다.
해결 방법:
이 문제를 해결하려면 모든 인라인 JavaScript를 별도의 JS 파일로 이동하세요.
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를 사용합니다. 취약점.
위 내용은 내 Chrome 확장 프로그램 팝업 클릭 이벤트가 작동하지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.