Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Tighten CSP around script-src and style-src #6270

Merged
merged 4 commits into from
May 8, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
1 change: 1 addition & 0 deletions lib/sidekiq/web.rb
Original file line number Diff line number Diff line change
Expand Up @@ -114,6 +114,7 @@ def use(*args, &block)
end

def call(env)
env[:csp_nonce] = SecureRandom.base64(16)
app.call(env)
end

Expand Down
12 changes: 8 additions & 4 deletions lib/sidekiq/web/application.rb
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ class WebApplication
extend WebRouter

REDIS_KEYS = %w[redis_version uptime_in_days connected_clients used_memory_human used_memory_peak_human]
CSP_HEADER = [
CSP_HEADER_TEMPLATE = [
"default-src 'self' https: http:",
"child-src 'self'",
"connect-src 'self' https: http: wss: ws:",
Expand All @@ -15,8 +15,8 @@ class WebApplication
"manifest-src 'self'",
"media-src 'self'",
"object-src 'none'",
"script-src 'self' https: http:",
"style-src 'self' https: http: 'unsafe-inline'",
"script-src 'self' 'nonce-!placeholder!'",
"style-src 'self' 'nonce-!placeholder!'",
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm wondering if we can allow style-src 'unsafe-inline' until Sidekiq 8.0. Most people can extract JavaScript pretty easily but a lot of dynamic CSS isn't as easy to extract. Are you aware of any issues or trade offs here?

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It would be great to allow both nonce and unsafe-inline for 7.3 so extensions can migrate from inline to nonce smoothly.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nonce and unsafe-inline are not compatible with each other, when both are specified only nonce is respected, at least on modern browsers.

It seems fine to just undo the policy changes for style-src to allow for a smoother upgrade path, script-src is what this PR was all about. Loading arbitrary css is not exactly what you'd want to do but loading arbitrary scripts even less so.

Let me know what you think, I can make a PR for that. Or just do that yourself, either is fine for me.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok, we'll continue to implement nonce but need to allow unsafe-inline for styles for now. We can enable nonce and disable unsafe-inline in 8.0. Extensions can use 7.3 to implement nonce so they can remain compatible with 7.3 and 8.0. I don't want to require a hard break in compatibility between major versions if possible.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You're welcome to send a PR for that if you're in a good place to do so.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, sure. I will do so. I'm currently looking into something else but will probably have time to do that tomorrow

"worker-src 'self'",
"base-uri 'self'"
].join("; ").freeze
Expand Down Expand Up @@ -428,13 +428,17 @@ def call(env)
Rack::CONTENT_TYPE => "text/html",
Rack::CACHE_CONTROL => "private, no-store",
Web::CONTENT_LANGUAGE => action.locale,
Web::CONTENT_SECURITY_POLICY => CSP_HEADER
Web::CONTENT_SECURITY_POLICY => process_csp(env, CSP_HEADER_TEMPLATE)
}
# we'll let Rack calculate Content-Length for us.
[200, headers, [resp]]
end
end

def process_csp(env, input)
input.gsub("!placeholder!", env[:csp_nonce])
end

def self.helpers(mod = nil, &block)
if block
WebAction.class_eval(&block)
Expand Down
4 changes: 4 additions & 0 deletions lib/sidekiq/web/helpers.rb
Original file line number Diff line number Diff line change
Expand Up @@ -267,6 +267,10 @@ def csrf_tag
"<input type='hidden' name='authenticity_token' value='#{env[:csrf_token]}'/>"
end

def csp_nonce
env[:csp_nonce]
end

def to_display(arg)
arg.inspect
rescue
Expand Down
5 changes: 3 additions & 2 deletions test/web_test.rb
Original file line number Diff line number Diff line change
Expand Up @@ -68,9 +68,10 @@ def job_params(job, score)
get "/", {}
policies = last_response.headers["Content-Security-Policy"].split("; ")
assert_includes(policies, "connect-src 'self' https: http: wss: ws:")
assert_includes(policies, "style-src 'self' https: http: 'unsafe-inline'")
assert_includes(policies, "script-src 'self' https: http:")
assert_includes(policies, "style-src 'self' 'nonce-#{last_request.env[:csp_nonce]}'")
assert_includes(policies, "script-src 'self' 'nonce-#{last_request.env[:csp_nonce]}'")
assert_includes(policies, "object-src 'none'")
assert_operator(24, :>=, last_request.env[:csp_nonce].length)
end

it "provides a cheap HEAD response" do
Expand Down
34 changes: 22 additions & 12 deletions web/assets/javascripts/dashboard-charts.js
Original file line number Diff line number Diff line change
Expand Up @@ -108,17 +108,27 @@ class RealtimeChart extends DashboardChart {
}

renderLegend(dp) {
this.legend.innerHTML = `
<span>
<span class="swatch" style="background-color: ${dp[0].dataset.borderColor};"></span>
<span>${dp[0].dataset.label}: ${dp[0].formattedValue}</span>
</span>
<span>
<span class="swatch" style="background-color: ${dp[1].dataset.borderColor};"></span>
<span>${dp[1].dataset.label}: ${dp[1].formattedValue}</span>
</span>
<span class="time">${dp[0].label}</span>
`;
const entry1 = this.legendEntry(dp[0]);
const entry2 = this.legendEntry(dp[1]);
const time = document.createElement("span");
time.classList.add("time");
time.innerText = dp[0].label;

this.legend.replaceChildren(entry1, entry2, time)
}

legendEntry(dp) {
const wrapper = document.createElement("span");

const swatch = document.createElement("span");
swatch.classList.add("swatch");
swatch.style.backgroundColor = dp.dataset.borderColor;
wrapper.appendChild(swatch)

const label = document.createElement("span");
label.innerText = `${dp.dataset.label}: ${dp.formattedValue}`;
wrapper.appendChild(label)
return wrapper;
}

renderCursor(dp) {
Expand Down Expand Up @@ -179,4 +189,4 @@ class RealtimeChart extends DashboardChart {
if (hc != null) {
var htc = new DashboardChart(hc, JSON.parse(hc.textContent))
window.historyChart = htc
}
}
10 changes: 5 additions & 5 deletions web/views/dashboard.erb
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<script type="text/javascript" src="<%= root_path %>javascripts/dashboard.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/dashboard.js" nonce="<%= csp_nonce %>"></script>
<div class= "dashboard clearfix">
<h3 >
<%= t('Dashboard') %>
Expand Down Expand Up @@ -99,7 +99,7 @@
</div>
</div>

<script type="text/javascript" src="<%= root_path %>javascripts/chart.min.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/chartjs-plugin-annotation.min.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/base-charts.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/dashboard-charts.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/chart.min.js" nonce="<%= csp_nonce %>"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/chartjs-plugin-annotation.min.js" nonce="<%= csp_nonce %>"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/base-charts.js" nonce="<%= csp_nonce %>"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/dashboard-charts.js" nonce="<%= csp_nonce %>"></script>
12 changes: 6 additions & 6 deletions web/views/layout.erb
Original file line number Diff line number Diff line change
Expand Up @@ -5,20 +5,20 @@
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />

<link href="<%= root_path %>stylesheets/bootstrap.css" media="screen" rel="stylesheet" type="text/css" />
<link href="<%= root_path %>stylesheets/bootstrap.css" media="screen" rel="stylesheet" type="text/css" nonce="<%= csp_nonce %>" />
<% if rtl? %>
<link href="<%= root_path %>stylesheets/bootstrap-rtl.min.css" media="screen" rel="stylesheet" type="text/css"/>
<link href="<%= root_path %>stylesheets/bootstrap-rtl.min.css" media="screen" rel="stylesheet" type="text/css" nonce="<%= csp_nonce %>"/>
<% end %>

<link href="<%= root_path %>stylesheets/application.css" media="screen" rel="stylesheet" type="text/css" />
<link href="<%= root_path %>stylesheets/application-dark.css" media="screen and (prefers-color-scheme: dark)" rel="stylesheet" type="text/css" />
<link href="<%= root_path %>stylesheets/application.css" media="screen" rel="stylesheet" type="text/css" nonce="<%= csp_nonce %>" />
<link href="<%= root_path %>stylesheets/application-dark.css" media="screen and (prefers-color-scheme: dark)" rel="stylesheet" type="text/css" nonce="<%= csp_nonce %>" />
<% if rtl? %>
<link href="<%= root_path %>stylesheets/application-rtl.css" media="screen" rel="stylesheet" type="text/css" />
<link href="<%= root_path %>stylesheets/application-rtl.css" media="screen" rel="stylesheet" type="text/css" nonce="<%= csp_nonce %>" />
<% end %>

<link rel="apple-touch-icon" href="<%= root_path %>images/apple-touch-icon.png">
<link rel="shortcut icon" type="image/ico" href="<%= root_path %>images/favicon.ico" />
<script type="text/javascript" src="<%= root_path %>javascripts/application.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/application.js" nonce="<%= csp_nonce %>"></script>
<meta name="google" content="notranslate" />
<%= display_custom_head %>
</head>
Expand Down
8 changes: 4 additions & 4 deletions web/views/metrics.erb
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<script type="text/javascript" src="<%= root_path %>javascripts/chart.min.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/chartjs-plugin-annotation.min.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/base-charts.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/chart.min.js" nonce="<%= csp_nonce %>"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/chartjs-plugin-annotation.min.js" nonce="<%= csp_nonce %>"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/base-charts.js" nonce="<%= csp_nonce %>"></script>

<div class="header-container">
<div class="page-title-container">
Expand Down Expand Up @@ -88,4 +88,4 @@

<!--p><small>Data from <%= @query_result.starts_at %> to <%= @query_result.ends_at %></small></p-->

<script type="text/javascript" src="<%= root_path %>javascripts/metrics.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/metrics.js" nonce="<%= csp_nonce %>"></script>
8 changes: 4 additions & 4 deletions web/views/metrics_for_job.erb
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<script type="text/javascript" src="<%= root_path %>javascripts/chart.min.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/chartjs-plugin-annotation.min.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/base-charts.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/chart.min.js" nonce="<%= csp_nonce %>"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/chartjs-plugin-annotation.min.js" nonce="<%= csp_nonce %>"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/base-charts.js" nonce="<%= csp_nonce %>"></script>

<%
job_result = @query_result.job_results[@name]
Expand Down Expand Up @@ -56,4 +56,4 @@
<div class="alert alert-success"><%= t('NoJobMetricsFound') %></div>
<% end %>

<script type="text/javascript" src="<%= root_path %>javascripts/metrics.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/metrics.js" nonce="<%= csp_nonce %>"></script>