Joel Brock
5124010b8a
Three quick fixes off first-deploy testing: 1. /api/staff/file 404'd for valid files. Refactor fileBelongsToOrg to SELECT the org's and activities' file columns and JS-compare instead of WHERE ... OR with custom field refs (APIv4 fragility around nested OR + dotted custom fields). Same ownership probe, same shape /api/staff/report itself uses to read file values. 2. Lightbox ballooned to full report height because the staff iframe auto-grows to fit content (often 3000+ px). Cap to a fixed 640px x min(92vw, 900px) box so it stays a reasonable preview regardless of iframe document size. 3. Production frame-ancestors blocked crm.fci.coop from iframing survey.fci.coop -- the CSP only included the dev Civi origin derived from CIVI_BASE_URL. Add CIVI_FRAME_ALLOWED_ORIGINS (comma-separated) so one app deploy can be embedded by both dev and prod Civi. Falls back to CIVI_BASE_URL for single-Civi compatibility. PRODUCTION_CUTOVER.md updated inline and in the change log.
125 lines
4.5 KiB
TypeScript
125 lines
4.5 KiB
TypeScript
import path from "node:path";
|
|
import type { NextConfig } from "next";
|
|
|
|
/**
|
|
* Security headers.
|
|
*
|
|
* Two profiles:
|
|
* - strict (default): frame-ancestors 'none' + X-Frame-Options: DENY.
|
|
* Applied to every route except the embed-friendly ones.
|
|
* - staff-embed: frame-ancestors 'self' <civi-origin>, no X-Frame-Options.
|
|
* Lets the CiviCRM "Engagement Report" extension embed /staff/report,
|
|
* and lets the lightbox iframe inside that page load the
|
|
* /api/staff/file proxy for PDF preview.
|
|
*
|
|
* The catch-all source uses a negative lookahead so it does NOT match the
|
|
* embed-friendly routes — otherwise both rules apply and the browser ANDs
|
|
* the frame-ancestors directives together, blocking embedding entirely.
|
|
*/
|
|
const isDev = process.env.NODE_ENV !== "production";
|
|
const devOnlyDynamicScript = isDev ? " 'unsafe-eval'" : "";
|
|
|
|
const buildCsp = (frameAncestors: string) =>
|
|
[
|
|
"default-src 'self'",
|
|
`script-src 'self' 'unsafe-inline'${devOnlyDynamicScript}`,
|
|
"style-src 'self' 'unsafe-inline' https://fonts.googleapis.com",
|
|
"font-src 'self' https://fonts.gstatic.com data:",
|
|
"img-src 'self' data:",
|
|
"connect-src 'self'",
|
|
`frame-ancestors ${frameAncestors}`,
|
|
"form-action 'self'",
|
|
"base-uri 'self'",
|
|
"object-src 'none'",
|
|
].join("; ");
|
|
|
|
const sharedHeaders = [
|
|
{ key: "Strict-Transport-Security", value: "max-age=63072000; includeSubDomains; preload" },
|
|
{ key: "X-Content-Type-Options", value: "nosniff" },
|
|
{ key: "Referrer-Policy", value: "same-origin" },
|
|
{
|
|
key: "Permissions-Policy",
|
|
value: "camera=(), microphone=(), geolocation=(), interest-cohort=()",
|
|
},
|
|
];
|
|
|
|
/**
|
|
* Civi origins permitted to embed the staff report in an iframe.
|
|
*
|
|
* Reads `CIVI_FRAME_ALLOWED_ORIGINS` (comma-separated origins) so a single
|
|
* survey.fci.coop deployment can be framed by both the dev Civi
|
|
* (client.crm.fci.coop) and the production Civi (crm.fci.coop). Falls
|
|
* back to the origin of `CIVI_BASE_URL` when the multi-origin var isn't
|
|
* set so existing single-Civi deployments keep working.
|
|
*
|
|
* Each entry is validated as a parsable URL; bad values are dropped and
|
|
* logged at build time rather than silently making the CSP invalid.
|
|
*/
|
|
function civiOriginsForCsp(): string[] {
|
|
const explicit = process.env.CIVI_FRAME_ALLOWED_ORIGINS;
|
|
if (explicit) {
|
|
const raws = explicit.split(",").map((s) => s.trim()).filter(Boolean);
|
|
const origins: string[] = [];
|
|
for (const raw of raws) {
|
|
try {
|
|
origins.push(new URL(raw).origin);
|
|
} catch {
|
|
console.warn(`[next.config] ignoring invalid CIVI_FRAME_ALLOWED_ORIGINS entry: ${raw}`);
|
|
}
|
|
}
|
|
return origins;
|
|
}
|
|
const base = process.env.CIVI_BASE_URL;
|
|
if (!base) return [];
|
|
try {
|
|
return [new URL(base).origin];
|
|
} catch {
|
|
return [];
|
|
}
|
|
}
|
|
|
|
const strictHeaders = [
|
|
{ key: "Content-Security-Policy", value: buildCsp("'none'") },
|
|
...sharedHeaders,
|
|
{ key: "X-Frame-Options", value: "DENY" },
|
|
];
|
|
|
|
const staffEmbedHeaders = (() => {
|
|
const origins = civiOriginsForCsp();
|
|
const frameAncestors = origins.length > 0 ? `'self' ${origins.join(" ")}` : "'self'";
|
|
return [
|
|
{ key: "Content-Security-Policy", value: buildCsp(frameAncestors) },
|
|
...sharedHeaders,
|
|
// Intentionally NO X-Frame-Options: frame-ancestors above is the policy.
|
|
// (X-Frame-Options can only encode one origin; CSP supersedes here.)
|
|
];
|
|
})();
|
|
|
|
const nextConfig: NextConfig = {
|
|
poweredByHeader: false,
|
|
reactStrictMode: true,
|
|
// Pin Turbopack's filesystem root to THIS app's directory. Without this,
|
|
// Next 16 walks up to the parent civi-webform/ workspace (it sees two
|
|
// package-lock.json files and silently picks the outer one), which causes
|
|
// Turbopack to watch the parent node_modules/, .claude-flow/, .swarm/, and
|
|
// ruvector.db. Background writes in those trees trigger a recompile loop:
|
|
// compile → write .next/dev → re-trigger → memory blows up. The build-time
|
|
// warning surfaces the same issue.
|
|
turbopack: {
|
|
root: path.resolve(__dirname),
|
|
},
|
|
async headers() {
|
|
return [
|
|
{ source: "/staff/report", headers: staffEmbedHeaders },
|
|
// The lightbox in /staff/report iframes this proxy for inline PDF
|
|
// previews. Must share the embed-friendly profile so the browser
|
|
// doesn't block the same-origin iframe.
|
|
{ source: "/api/staff/file", headers: staffEmbedHeaders },
|
|
// Catch-all that excludes the embed-friendly routes — see header notes.
|
|
{ source: "/((?!staff/report|api/staff/file).*)", headers: strictHeaders },
|
|
];
|
|
},
|
|
};
|
|
|
|
export default nextConfig;
|