解決jenkins拉取報告沒有樣式的問題(還沒試過)

來源: https://testerhome.com/topics/9476css

對於測試報告來講，除了內容的簡潔精煉，樣式的美觀也很重要。經常使用的作法是，採用HTML格式的文檔，並搭配CSS和JS，實現自定義的樣式和動畫效果（例如展開、摺疊等）。html

在Jenkins中要展現HTML文檔，一般採用的方式有兩種：java

使用HTML Publisher Plugin；
使用Files to archive功能，在Build Artifacts中顯示HTML文檔連接。

第一種方式配合插件，能夠經過圖形化操做實現簡易配置，而且展現效果也不錯；而第二種方式的優點在於使用Jenkins自帶的功能，不依賴插件也能實現基本的需求。node

然而，不論是採用哪一種方式，都有可能會遇到一種狀況，就是展現出來的HTML報告樣式全無。在瀏覽器的Network中查看資源加載狀況，會發現相關的CSS和JS都無法正常加載。web

Refused to load the stylesheet 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css' because it violates the following Content Security Policy directive: "style-src 'self'".
Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-0EZqoz+oBhx7gF4nvY2bSqoGyy4zLjNF+SDQXGp/ZrY='), or a nonce ('nonce-...') is required to enable inline execution.
Blocked script execution in 'http://10.13.0.146:8888/job/SkyPixel-SmokeTest/34/artifact/reports/SkyPixel-smoketest/34.html' because the document's frame is sandboxed and the 'allow-scripts' permission is not set.
Refused to load the stylesheet 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css' because it violates the following Content Security Policy directive: "style-src 'self'".

問題分析

出現該現象的緣由在於Jenkins中配置的CSP（Content Security Policy）。bootstrap

簡單地說，這是Jenkins的一個安全策略，默認會設置爲一個很是嚴格的權限集，以防止Jenkins用戶在workspace、/userContent、archived artifacts中受到惡意HTML/JS文件的攻擊。瀏覽器

默認地，該權限集會設置爲：安全

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

在該配置下，只容許加載：服務器

Jenkins服務器上託管的CSS文件
Jenkins服務器上託管的圖片文件

而以下形式的內容都會被禁止：app

JavaScript
plugins (object/embed)
HTML中的內聯樣式表（Inline style sheets），以及引用的外站CSS文件
HTML中的內聯圖片（Inline image definitions），以及外站引用的圖片文件
frames
web fonts
XHR/AJAX
etc.

能夠看出，這個限制很是嚴格，在此限制下也就不難理解爲何咱們的HTML無法正常展現樣式了。

解決方案

臨時解決方案

要解決該問題，方式也比較簡單，就是修改Content Security Policy的默認配置。

修改方式爲，進入Manage Jenkins->Script console，輸入以下命令並進行執行。

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

當看到以下結果後，則說明配置修改已經生效。

Result
Result:

再次進行構建，新生成的HTML就能夠正常展現樣式了。須要說明的是，該操做對以前構建生成的HTML報告無效。

永久解決方案

不過，該方法還存在一個問題：該配置只是臨時生效，當重啓Jenkins後，Content Security Policy又會恢復爲默認值，從而HTML樣式又無法展現了。

當前，Jenkins官方尚未相應的解決方法，咱們只能在每次啓動或重啓Jenkins時，從新修改該安全策略。

若是手工地來重複這項工做，也是可行，但並非一個好的解決方案。

回到剛纔的Script console，會發現咱們執行的命令其實就是一段Groovy代碼；那麼，若是咱們能夠實如今Jenkins每次啓動時自動地執行該Groovy代碼，那麼也就一樣能解決咱們的問題了。

好在Jenkins已經有相應的插件：

Startup Trigger: 可實如今Jenkins節點(master/slave)啓動時觸發構建；
Groovy plugin: 可實現直接執行Groovy代碼。

搜索安裝startup-trigger-plugin和Groovy插件後，咱們就能夠進行配置了。

配置方式以下：

新建一個job，該job專門用於Jenkins啓動時執行的配置命令；
在Build Triggers模塊下，勾選Build when job nodes start；
在Build模塊下，Add build step->Execute system Groovy script，在Groovy Script中輸入配置命令，System.setProperty("hudson.model.DirectoryBrowserSupport.CSP", "")。

須要注意的是，添加構建步驟的時候，應該選擇Execute system Groovy script，而不是Execute Groovy script。關於這二者之間的差別，簡單地說，Groovy Script至關因而運行在master/slave系統JVM環境中，而system groovy script，則是運行在Jenkins master的JVM環境中，與前面提到的Jenkins Script Console功能相同。如需瞭解更多信息，可查看Groovy plugin的詳細說明。

至此，咱們就完全解決HTML樣式展現異常的問題了。

但還有一點須要格外注意，在本文的演示中，咱們修改CSP（Content Security Policy）配置時關閉了的全部安全保護策略，即將hudson.model.DirectoryBrowserSupport.CSP設置爲空，其實這是存在很大的安全隱患的。

正確的作法，咱們應該是結合項目的實際狀況，選擇對應的安全策略。例如，若是咱們須要開啓腳本文件加載，可是隻限於Jenkins服務器上託管的CSS文件，那麼就能夠採用以下配置。

System.setProperty("hudson.model.DirectoryBrowserSupport.CSP", "sandbox; style-src 'self';")

除此以外，CSP能夠實現很是精細的權限配置，詳細配置可參考Content Security Policy Reference。