[Umbrella] Make the DSpace UI deployable under a strict Content-Security-Policy

Open
  • Is something wrong?
#6,079 1 comment 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

Nobody has claimed this yet.

Assessment

Difficulty
5/5
Estimated time
Over a week
Newbie friendliness
30/100
Issue type
Feature
Clarity
Mostly clear
Activity status
Quiet
Tech stack
angular, typescript
Domain
frontend, security

Research direction

This is an umbrella issue; its implementation work is split into #6077 (SSR nonce support) and #6078 (removing remaining inline scripts), with backend security headers tracked in DSpace/DSpace#12951. Read those sub-issues first to identify a scoped task; this issue is done when the UI can run without 'unsafe-inline' or 'unsafe-eval' in script-src or style-src while retaining supported features.

Written by the indexing model from the issue text.

Description

help wanted needs discussion new feature security

Is your feature request related to a problem? Please describe.

Institutions are increasingly required by their security teams to serve DSpace under a
Content-Security-Policy (CSP). DSpace/DSpace#9881 already proposes documenting CSP as a
recommended production hardening measure.

The problem is that today the only CSP the DSpace UI can actually run under is one that
provides close to no XSS protection. A working policy has to include:

script-src 'self' 'unsafe-inline' 'unsafe-eval' https:;
style-src  'self' 'unsafe-inline' https:;

script-src with 'unsafe-inline', 'unsafe-eval' and a blanket https: permits arbitrary
inline script and script from any HTTPS host, which is the exact class of injection CSP exists
to stop. Deployers therefore take on the breakage risk and the maintenance burden of a CSP
without getting the benefit, and a security review is very likely to raise concerns about such a
policy, rightfully so.

Two separate things force 'unsafe-inline':

  1. Styles. Angular injects component styles as <style> elements at runtime. This is
    unavoidable without supplying Angular a CSP nonce. CSP_NONCE / ngCspNonce exist in the
    Angular version we ship (@angular/core 20.3.x), but nothing in dspace-angular provides them.
    There is currently no occurrence of CSP_NONCE or ngCspNonce anywhere in this repository.
  2. Scripts. The bundle <script> tags in the served HTML carry no nonce, and several
    integrations build <script> elements at runtime, two of them with inline content.

Describe the solution you'd like

Make it possible for a deployer to serve the DSpace UI under a policy with no
'unsafe-inline' and no 'unsafe-eval' in script-src or style-src, without losing any
currently supported feature.

Proposed phasing:

Phase 1 (keystone): nonce support in SSR

See #6077. Generate a per-request nonce, stamp it on the bundle script tags and on Angular's
injected styles, emit the header from Express, and solve the interaction with the SSR page cache.

Target policy after phase 1:

script-src 'nonce-{random}' 'strict-dynamic' https:;
style-src  'nonce-{random}';

'strict-dynamic' means the nonced bundle is trusted and anything it loads is trusted too, so
Google Analytics, Matomo, MathJax, reCAPTCHA and AddToAny keep working untouched and their hosts
no longer need to be allowlisted. The trailing https: is ignored by browsers that understand
'strict-dynamic' and acts as a fallback for those that do not.

This is a large improvement over the status quo and is achievable without touching any feature
code. It is not the endpoint: 'strict-dynamic' still trusts anything application code loads.

Phase 2: remove the remaining inline scripts

See #6078. Independent of phase 1 and mergeable on its own.

Phase 3 (follow-up, not yet scoped): drop 'strict-dynamic'

Once phases 1 and 2 land, the remaining blocker to an explicit-allowlist policy is that the hosts
of the optional integrations are runtime configuration, not build-time constants:

Integration Where the host comes from
Matomo matomo.tracker.url, fetched from the backend configuration at runtime (src/app/statistics/matomo.service.ts:105,143)
Google reCAPTCHA google.recaptcha.key.site from backend config (src/app/core/google-recaptcha/google-recaptcha.service.ts:95)
MathJax jsdelivr or cdnjs, selected by markdown.mathjax (src/app/core/shared/client-math.service.ts:50,54)
AddToAny environment.addToAnyPlugin.scriptUrl (config.yml)
IIIF / Mirador manifest and tile hosts, potentially third-party

A statically written Apache header goes stale the moment an admin enables one of these. Phase 3
would derive the source lists from configuration so that enabling a feature cannot silently break
it. Filing this as a follow-up rather than scoping it now.

Documentation

DSpace/DSpace#9881 should carry the recommended policy and, importantly, the rollout procedure
(Content-Security-Policy-Report-Only with a reporting endpoint first). This matters more than
usual for DSpace: because the UI is server-rendered and then hydrated, a CSP-blocked script
typically leaves the SSR HTML visible and fails only during hydration, so breakage does not show
up in a quick visual smoke test.

Describe alternatives or workarounds you've considered

  • Document the permissive policy and stop there. This is the status quo and is what most
    deployers currently do. It satisfies a checkbox but not a threat model. Worth documenting as an
    interim step regardless, which is what #9881 covers.
  • Hashes instead of nonces. 'sha256-...' for each inline block avoids per-request state and
    therefore avoids the SSR cache problem entirely. It does not work here, because Angular's
    runtime-injected styles are not known at build time.
  • Eliminate all inline styles from Angular. Not under our control; this is framework behaviour.

Additional information

Dominant language
TypeScript
Stars
180
Forks
577
Avg merge
2d 1h
Merged PRs (30d)
100

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from DSpace/dspace-angular

All issues in DSpace/dspace-angular

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.