Jenkins - HTML发布插件 - 在Jenkins服务器中查看报告时未显示CSS

Question

我在Jenkins中使用HTML发布插件时遇到了一个奇怪的问题，即当我在Jenkins中查看报告时，添加的所有漂亮的CSS都被剥离掉了。如果我将报告下载到本地，我就能够看到CSS格式。是否有一种Jenkins设置可以允许查看CSS？

我在Jenkins中的HTML发布器设置：

我的报告页面在 Jenkins 中显示：

本地显示的我的报告页面：

- Vall

---

可能是Jenkins HTML发布者插件：Jenkins 1.643没有外部链接的重复问题。 - Dave Bacher

所有人都在说，通过禁用内容安全策略来“修复”它，而没有考虑为什么首先需要它。任何能够影响要构建的更改的人都将能够劫持管理员凭据并访问整个Jenkins集群。虽然如果小心使用，内联CSS大多是安全的，但允许脚本会带来灾难。 - OrangeDog

Answer 1

找到了问题所在，这里分享给其他用户。

Jenkins 中的内容安全策略会导致 CSS 被剥离掉。（https://wiki.jenkins-ci.org/display/JENKINS/Configuring+Content+Security+Policy）

默认规则设置为：

sandbox; default-src 'none'; img-src 'self'; style-src 'self';

这个规则集会导致以下结果：

• 完全不允许JavaScript
• 不允许使用插件（object/embed）
• 不允许使用内联CSS或其他网站的CSS
• 不允许使用其他网站的图片
• 不允许使用框架
• 不允许使用Web字体
• 不允许XHR/AJAX等操作

要放宽这个规则，请前往

1. 管理Jenkins ->
2. 管理节点 ->
3. 单击设置（齿轮图标） ->

4. 在左侧点击脚本控制台，然后输入以下命令:

   System.setProperty("hudson.model.DirectoryBrowserSupport.CSP", "")

并按运行。如果您在“Result”标题下看到输出，则表示保护已禁用。重新运行构建，您将看到新的HTML文件启用了CSS。

- Vall

---

@Steerpike 我好奇你的意思，后来发现 Jenkins 重新启动后 CSS 被阻止了。所以我创建了一个 Jenkins 任务，每隔12小时运行一次该命令。看起来效果不错。 - Aeropher

@Steerpike 是正确的，除了它是一个很棒的命令，所以你需要在“执行系统 Groovy 脚本”构建步骤中执行它。然后在“构建触发器”部分，我选择了“定期构建”，值为：H 12 * * *。 - Aeropher

将此属性设置为空字符串似乎可以解决CSS的问题，但内联JS仍未执行（控制台日志显示_Content Security Policy：页面的设置阻止了在self（“script-src”）处加载资源..._）。有什么想法可以明确允许内联JS吗？ - bluenote10

完全禁用CSP并不是非常安全的。 - OrangeDog

还要注意，在管理Jenkins页面（例如http://localhost:8080/manage）中，您将能够看到类似于以下警告：`默认的Content-Security-Policy目前正在使用hudson.model.DirectoryBrowserSupport.CSP系统属性进行覆盖，这是在浏览不受信任的文件时可能存在的安全问题。作为替代方案，您可以设置一个资源根URL，Jenkins将使用它来提供一些静态文件，而不添加Content-Security-Policy标头。`如果解决方案已经应用成功。 - George Pligoropoulos

Answer 2

在CentOs中，启用html报告中的图片的方法如下：

• 使用sudo vi /etc/sysconfig/jenkins命令打开jenkins配置文件。
• 在JENKINS_JAVA_OPTION中设置以下内容：

JENKINS_JAVA_OPTIONS="-Djava.awt.headless=true -Dhudson.model.DirectoryBrowserSupport.CSP=\"default-src 'self' 'unsafe-inline' 'unsafe-eval'; img-src 'self' 'unsafe-inline' data:;\""

即使在重新启动jenkins服务器后，此操作仍然有效。

---

指令

default-src：default-src是加载JavaScript、图片、CSS、字体、AJAX请求、帧、HTML5媒体等内容的默认策略

img-src: 定义了图像的有效来源。

来源值

' self ' - 允许从同一源（相同的方案、主机和端口）加载资源。

用法：default-src 'self'

' unsafe-inline ' - 允许使用内联源元素，例如样式属性、onclick或脚本标签主体（取决于应用于其上下文的源）和javascript: URI。

用法：default-src 'unsafe-inline'

' unsafe-eval ' - 允许不安全的动态代码评估，例如JavaScript eval()

用法：default-src 'unsafe-eval'

data: - 允许通过数据方案（例如Base64编码的图像）加载资源

用法：img-src 'self' data:

有关内容安全策略的更多信息，请在此处查看。

- jithinkmatthew

---

你应该只启用内联CSS，而不是所有其他不安全的内容。 - OrangeDog

如果您在数据部分的对象中使用了一些SVG，例如<object type="image/svg+xml" data="imgs/lifecycle-diagram.svg"><span class="alt">lifecycleDiagram</span></object>（交互式asciidoctor spring-rest文档嵌入plantuml图的结果），则需要将object-src设置为self。请注意转义：JENKINS_JAVA_OPTIONS='-Djava.awt.headless=true -Dhudson.security.HudsonPrivateSecurityRealm.ID_REGEX="^[a-zA-Z0-9_.-]+$" -Dhudson.model.DirectoryBrowserSupport.CSP="sandbox; default-src '\''none'\''; img-src '\''self'\''; style-src '\''self'\''; object-src '\''self'\'';"' - Lubo

太好了！也可以在Docker中使用，只需使用--env JAVA_OPTS="..."。 - smelm

我用 vi /etc/default/jenkins 命令打开文件，编辑变量 JAVA_ARGS 来安装我的 Ubuntu 系统上的 Jenkins。 - mRyan

在 Jenkins 2.346.1 中，变量可能已更改为 "JAVA_OPTS"。https://dev59.com/B1oU5IYBdhLWcg3wRFkh#73874025 - Noam Manos

Answer 3

前往“管理Jenkins” -> “脚本控制台”，并运行以下命令：

System.setProperty("hudson.model.DirectoryBrowserSupport.CSP", "")

- Som

---

在将第二个参数修改为kithinkmatthew提到的值后，这对我起作用了，即System.setProperty("hudson.model.DirectoryBrowserSupport.CSP", "default-src 'self' 'unsafe-inline' 'unsafe-eval'; img-src 'self' 'unsafe-inline' data:;")。 - Andrew Mackrodt

@AndrewMackrodt，你提出的建议是唯一对我有用的解决方案（我正在CentOS上运行Jenkins）。 - lax1089

Answer 4

在CentOS上，以下解决方案（在另一个答案的评论中建议的）是我唯一有效的方法：

1. 转到：管理Jenkins >管理节点和云
2. 单击右侧节点的齿轮图标（默认情况下将只有一个名为Master的节点）
3. 点击左侧的“脚本控制台”
4. 在控制台窗口中输入以下内容：System.setProperty("hudson.model.DirectoryBrowserSupport.CSP", "default-src 'self' 'unsafe-inline' 'unsafe-eval'; img-src 'self' 'unsafe-inline' data:;")
5. 单击运行
6. 您应该在结果部分看到一些输出，类似于下面的屏幕截图：

我的特定问题是在Serenity BDD报告中缺少图像/ CSS。执行这些步骤后，我的Serenity报告中所有图像/CSS都正常呈现，包括在此更改之前执行的构建的报告。此解决方案也适用于任何发布的基于HTML的报告。

- lax1089

---

可能有点晚了，但这在我的Windows设置上起作用了。但出于某种原因，我需要点击两次运行才能显示预期的输出结果。 - KiritoLyn

谢谢，它起作用了。在 Jenkins 重启后也会继续工作吗？ - KingArasan

@KingArasan 是的，这个更改会在重新启动后保留。 - lax1089

Answer 5

您可以按照 Vall 的回答中指定的 groovy 命令进行修复。

该效果会一直存在，直到 Jenkins 重新启动之后，您需要再次执行此操作。

解决此问题的一个方法是配置一个作业，每当 Jenkins 启动时，它将为您执行此操作。

您可以使用 Startup Trigger 插件 来实现此操作。

安装插件后创建一个新作业，您将在构建触发器部分下看到一个新的复选框，您需要选中它。

然后添加一个“Execute system Groovy script”构建步骤，并使用以下命令：

System.setProperty("hudson.model.DirectoryBrowserSupport.CSP","")

保存后，一切都应该正常工作。

- dragosb

---

使用这种方法，如果您尚未安装Groovy插件，则需要安装它。 否则，“执行系统Groovy脚本”构建步骤将不会显示在可用的构建选项中。 - Bálint Pap

Answer 6

以下方案适用于Windows操作系统。

永久性解决方法是更改位于[Jenkins目录]\jenkins.xml中的一行代码（对我来说，它位于C:\Jenkins\jenkins.xml）。

<executable>java.exe</executable>
<arguments>[arguments are here]</arguments>

将以下参数添加到以空格分隔的参数列表中：

-Dhudson.model.DirectoryBrowserSupport.CSP=

然后重新启动Jenkins服务以使更改生效。

- twasbrillig

---

这对我来说是唯一有效的答案，我还在参数中添加了-Dfile.encoding=UTF-8。 - Sasha Bond

Answer 7

对于Ubuntu 14版本，有一些特殊的插件可以提供帮助：

https://wiki.jenkins-ci.org/display/JENKINS/Startup+Trigger - 在Jenkins启动时启动作业

https://wiki.jenkins-ci.org/display/JENKINS/Groovy+plugin - 运行系统Groovy脚本

我创建了一个作业，在Jenkins重新启动时启动并设置参数。

然后添加了系统Groovy脚本来设置参数。 System.setProperty("hudson.model.DirectoryBrowserSupport.CSP", "sandbox; img-src 'self';")

- abiab

---

虽然作业成功运行，但它没有启用我的报表的CSS显示。我在“脚本控制台”中运行了完全相同的Groovy脚本，那样就可以正常工作。还能做什么？这个作业的Groovy脚本未更改实际父Jenkins属性。 - Frak

@frakman1，此刻我的Groovy脚本看起来像这样 - System.setProperty("hudson.model.DirectoryBrowserSupport.CSP", "") 但这就是全部，一切都正常。也许你没有管理员用户？ - abiab

谢谢您的回复。最终我成功了。我不得不使用这个脚本：System.setProperty("hudson.model.DirectoryBrowserSupport.CSP", "sandbox allow-same-origin allow-scripts; default-src 'self'; script-src * 'unsafe-eval'; img-src *; style-src * 'unsafe-inline'; font-src *") - Frak

Answer 8

前往：

管理 Jenkins --> 脚本控制台

然后输入以下命令：

System.setProperty("hudson.model.DirectoryBrowserSupport.CSP", "")

然后点击“运行”。如果输出结果为“Result”，则重新运行构建并检查 HTML 报告格式。

- Shailendra

Answer 9

要进行永久设置，请创建一个Groovy脚本文件$JENKINS_HOME/init.groovy，或者在目录$JENKINS_HOME/init.groovy.d/中创建任何.groovy文件，并将以下内容添加到文件中：

System.setProperty("hudson.model.DirectoryBrowserSupport.CSP", "sandbox allow-scripts; default-src 'self'; img-src *; style-src 'self' 'unsafe-inline'; script-src * 'unsafe-inline';")

系统控制台重新启动Jenkins。

https://wiki.jenkins.io/display/JENKINS/后初始化脚本

- Karen Danielyan

---

Ubuntu主目录：/var/lib/jenkins - Jack Kitley

Answer 10

虽然这是一个旧帖子并且已经提供了答案，但我觉得有必要指出一些新的材料来增强答案。所以，对于这个话题来说，很抱歉打扰了，但毕竟这是搜索结果中排名最高的。

我看到之前的所有回答都建议将默认内容安全策略设置为自由访问。考虑到任何在您的Jenkins流水线上运行构建的人都可以修改内容，这确实存在一定的风险。毕竟，这是一种有效的设置，用于最小化跨站脚本攻击的风险。即使在这个帖子中，我也看到了几条评论指出了这一点。

为了进一步提供教育，以下是我找到的一些好资源。

https://www.jenkins.io/doc/book/security/configuring-content-security-policy/

https://content-security-policy.com/

以下是在我的托管Jenkins实例上启用美观的HTML覆盖率报告的步骤。Jenkins文档指出设置资源URL是比较优选的解决方案，但在我的情况下这是不可能的：

1. 在Jenkins网页前端导航至脚本控制台。
2. 输入System.setProperty("hudson.model.DirectoryBrowserSupport.CSP", "default-src 'none'; script-src 'self'; connect-src 'self'; img-src 'self'; style-src 'self';base-uri 'self';form-action 'self' ")并点击“运行”。
3. 该设置立即生效，通过重新加载要显示的“损坏”内容（例如你发布的作业HTML覆盖率报告）来检查结果。
4. 在脚本控制台中恢复为默认类型System.clearProperty("hudson.model.DirectoryBrowserSupport.CSP")。

所提供的CSP头部是上述第二个链接中所称的入门策略。

该策略允许来自同一源的图像、脚本、AJAX、表单操作和CSS，不允许加载其他任何资源（如对象、框架、媒体等）。对于许多站点来说，这是一个很好的起点。

对于在受访问保护的Jenkins实例中生成HTML覆盖率报告的情况，我发现这是可接受且有效的。

- Bastlwastl