使用Content-Security-Policy和JavaScript避免“`script src”unsafe-inline“”

Question

我在设置内容-安全-策略时遇到问题

我有.html文件，外部.css和外部.js

下面是示例：http://kod.djpw.cz/kmxc

没有Content-Security-Policy页面可以正常工作。如果我设置：

Header set Content-Security-Policy "default-src 'none'；child-src 'self'；connect-src 'self'；script-src 'self'；base-uri 'self'；style-src 'self'；block-all-mixed-content；upgrade-insecure-requests；frame-ancestors 'none'；object-src 'self'；img-src 'self'；media-src 'self'；frame-src 'self'；font-src 'self'；form-action 'self';“

JavaScript有问题。它不起作用。当我重写script-src 'unsafe-inline‘-我的页面工作...(就像没有CPS设置一样)。但这是不安全的。

如何在.js中使用安全设置进行外部工作？

将打开第2个图像的onclick="openModal();currentSlide(2)" (或onclick="currentSlide(2)")并关闭onclick="closeModal()"

Answer 1

将事件处理程序与addEventListener绑定，而不是使用固有的事件属性。

document
  .querySelector("#element-id")
  .addEventListener("click", closeModal);

Answer 2

你不能在设置script-src 'self'的同时使用内联JS。您必须在JS文件中定义EventListeners，否则您将不得不禁用此策略。

https://developer.mozilla.org/de/docs/Web/API/EventTarget/addEventListener