Heim >Web-Frontend >js-Tutorial >Warum werden die Klickereignisse meines Chrome-Erweiterungs-Popups nicht ausgelöst?

Warum werden die Klickereignisse meines Chrome-Erweiterungs-Popups nicht ausgelöst?

Susan Sarandon
Susan SarandonOriginal
2024-11-26 06:51:14509Durchsuche

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

Klick-Ereignisse im Popup der Chrome-Erweiterung werden nicht ausgelöst: Verstöße gegen Richtlinien zur Inhaltssicherheit werden behoben

Das Popup-Fenster Ihrer Chrome-Erweiterung reagiert nicht auf Schaltflächenklicks, was die Funktion behindert beabsichtigtes Verhalten. Der Schuldige liegt in der standardmäßigen Content Security Policy (CSP), die vom Browser durchgesetzt wird.

Das Problem verstehen

Um das Problem zu beheben, klicken Sie mit der rechten Maustaste auf die Popup-Schaltfläche und wählen Sie „Popup prüfen“. Sie erhalten eine Fehlermeldung, die besagt, dass ein Inline-Skript gegen die CSP-Direktive „script-src“ verstößt. Dies erklärt, warum das Klickereignis nicht ausgelöst wird.

Lösung: JavaScript-Code trennen

Um das Problem zu beheben, verschieben Sie den gesamten Inline-JavaScript-Code aus der HTML-Datei in eine separate JS-Datei. Dies folgt der CSP-Anforderung, indem Skripte aus dem HTML-Dokument isoliert werden.

Überarbeiteter Code:

hello.html (Popup Seite)

<!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;

Hinweis: Ersetzen Sie innerHTML durch textContent in den Fällen, in denen Sie dies beabsichtigen Text ändern. Obwohl dies in diesem Beispiel nicht kritisch ist, wird die Verwendung von textContent für erhöhte Sicherheit (XSS-Abwehr) in komplexen Anwendungen empfohlen.

Das obige ist der detaillierte Inhalt vonWarum werden die Klickereignisse meines Chrome-Erweiterungs-Popups nicht ausgelöst?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel:Modal vs. DialogNächster Artikel:Modal vs. Dialog