Mengapa Acara Klik Pop Timbul Sambungan Chrome Saya Gagal Kerana Pelanggaran Dasar Keselamatan Kandungan?-tutorial js-php.cn

Mengapa Acara Klik Pop Timbul Sambungan Chrome Saya Gagal Kerana Pelanggaran Dasar Keselamatan Kandungan?

Susan Sarandon

Lepaskan： 2024-11-25 03:37:12

asal

243 orang telah melayarinya

Why Are My Chrome Extension Popup Click Events Failing Due to a Content Security Policy Violation?

Acara Klik Pop Timbul Sambungan Gagal: Menyelesaikan Pelanggaran Dasar Keselamatan Kandungan

Perihalan Ralat

Dalam sambungan Chrome, klik acara pada kedua-dua ikon sambungan dan butang dalam halaman pop timbul tidak menjana tindak balas yang dijangkakan untuk menambah pembolehubah JavaScript.

Memeriksa the Root Cause

Untuk nyahpepijat isu, periksa halaman pop timbul dan periksa log konsol. Mesej ralat mungkin menunjukkan pelanggaran Dasar Keselamatan Kandungan (CSP):

Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' chrome-extension-resource:".

Salin selepas log masuk

Pematuhan CSP Terkompromi

Skrip sebaris dalam halaman HTML melanggar CSP lalai. JavaScript sebaris tidak dibenarkan di bawah dasar ini.

Penyelesaian: Mengasingkan JavaScript

Untuk menyelesaikan isu ini, hapuskan semua JavaScript sebaris daripada fail HTML dan letakkannya dalam fail JavaScript yang berasingan.

Struktur Kod Disemak

hello.html (Timbul Timbul Halaman)

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

Salin selepas log masuk

popup.js

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

Salin selepas log masuk

Nota

Ganti innerHTML dengan textContent apabila menukar teks kepada mengurangkan potensi kelemahan XSS.
Penyelesaian ini memastikan pematuhan CSP, mendayakan pelaksanaan skrip yang betul dan pengendalian acara klik.

Atas ialah kandungan terperinci Mengapa Acara Klik Pop Timbul Sambungan Chrome Saya Gagal Kerana Pelanggaran Dasar Keselamatan Kandungan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!