如何在 Jquery 3.4.1 和 Jquery-ui 1.12.1 中启用 CSP（内容安全策略）？

Question

我目前在我的网站上使用jQuery 3.4.1和jQuery-UI 1.12.1（用于自动完成）。我也在用unsafe-inline，但unsafe-eval我不想用。

我的<meta/>标签：

<meta
    http-equiv="Content-Security-Policy"
    content="script-src 'self' 'unsafe-eval' https: cdnjs.cloudflare.com code.highcharts.com stackpath.bootstrapcdn.com cdn.jsdelivr.net code.jquery.com 'unsafe-inline'; connect-src 'self' news.google.com; worker-src 'self'; manifest-src 'self';"
>

展开后，即content：

<meta
    http-equiv="Content-Security-Policy"
    content="script-src 'self' 'unsafe-eval' https: cdnjs.cloudflare.com code.highcharts.com stackpath.bootstrapcdn.com cdn.jsdelivr.net code.jquery.com 'unsafe-inline'; connect-src 'self' news.google.com; worker-src 'self'; manifest-src 'self';"
>

每当 AJAX 调用在 jQuery-UI 自动完成中发生时，它都会抛出一个错误，指出它违反了 CSP 策略。

我需要做什么才能使用 jQuery 在我的网站上正确启用 CSP？我不想在我的网站上使用unsafe-evaland unsafe-inline。

控制台错误：

Answer 1

每当 AJAX 调用在 jQuery-UI 自动完成中发生时，它都会抛出一个错误，指出它违反了 CSP 策略。

1. 显示此 CSP 错误的文本，我会告诉您该怎么做（最好使用 Chrome 控制台）。

2. 从 jQuery-UI 1.12.1 的 CSS 可以看出，您需要将其纳入img-src data:您的策略中。

3. 从脚本 1.12.1/jquery-ui.js 可以看出 - 它不使用不安全的 eval 调用。也许您在脚本中使用了这些。从 script-src 中删除“unsafe-eval”并检查控制台中引发的错误。如果没有类似Refused to evaluate a string as JavaScript because unsafe-eval is not an allowed或the page's settings blocked the loading of a resource at eval- 之类的消息，则不需要在 script-src 中包含“unsafe-eval”。

   。

最佳实践是忘记不安全的 HTTP: 并使用 HTTPS:。在某些情况下，互联网提供商（在互联网的 RU 段中）会干扰客户端的流量并将广告注入 jquery 库中。所以：

• 该规则connect-src 'self' news.google.com;应该是connect-src 'self' https://news.google.com;因为 news.google.com 总是退出到 HTTPS:。所有对 news.google.com 的 $ajax 请求也应该使用 https:// 方案。

• cdn.jsdelivr.net 也是如此，它总是重定向到 HTTPS：因此安全规则应该是：

  script-src 'self' 'unsafe-eval' https://cdnjs.cloudflare.com https://code.highcharts.com https://stackpath.bootstrapcdn.com https://cdn.jsdelivr.net https://cdn.jsdelivr.net https:/ /code.jquery.com

所有调用脚本都应使用 HTTPS 完成：<script src='https://cdn.jsdelivr.net/npm/jquery@3.2.1/dist/jquery.min.js'...

当您在 script-src 中仅指定 schema-source 时https:- 它会导致零保护，因为任何源都将允许通过 https:。

这还有助于避免混合内容阻塞的问题。