Q273: Frontend Logging Privacy and Sensitive Data Redaction
What Interviewers Want To Evaluate
Interviewers want to know whether you can make production observable without turning logs into a privacy incident.
They want to hear about redaction, minimization, consent, PII, session replay risk, error context, telemetry schemas, and retention.
Short Interview Answer
Frontend logging should capture enough context to debug production issues while minimizing sensitive data. I avoid logging tokens, passwords, personal content, full URLs with secrets, form values, and raw API payloads. I use structured events, allowlisted fields, redaction, sampling, retention limits, user consent where needed, and privacy review for session replay or analytics. Observability is valuable only when it does not create a new data leak.
Detailed Interview Answer
Frontend logs often include context close to the user.
That context can be sensitive:
route
query string
form input
error message
API payload
browser metadata
user ID
organization ID
feature flags
session replay
console breadcrumbs
Good logging chooses what to capture intentionally.
Bad logging captures everything and hopes nobody looks.
Data Classification
Classify data before logging.
Categories:
safe operational metadata
personal data
sensitive personal data
authentication secrets
business confidential data
user-generated private content
regulated data
Each category needs different handling.
Secrets should not be logged.
Private content should be heavily limited or avoided.
Structured Logging
Prefer structured events over raw strings.
Example:
event: "question_read_progress_failed"
route: "/questions/[slug]"
questionId: "Q273"
release: "abc123"
status: 500
retryable: true
This is easier to query and safer to review.
Avoid:
console.log("failed", entireFormState)
Redaction
Redaction removes or masks sensitive fields.
Redact:
Authorization headers
cookies
tokens
passwords
email when not needed
phone numbers
addresses
payment data
free-form text inputs
Use allowlists when possible.
It is safer to say "only these fields may be logged" than "log everything except these fields."
URLs and Query Strings
URLs can contain sensitive data.
Examples:
reset token
invite token
authorization code
email address
search query
return URL
Log route patterns instead of full URLs when possible.
If full URLs are needed, scrub query strings.
Session Replay
Session replay tools can be powerful and risky.
They may capture:
typed input
visible personal data
DOM content
click behavior
screen layout
Use masking, route exclusions, sampling, consent, and retention controls.
Never enable replay casually on sensitive flows.
Error Boundaries and Context
Error reports should include useful context:
release
route
component area
browser
OS
feature flags
user action category
request ID
They should not include full private data.
The goal is to reproduce the failure path, not collect the user's life story.
Retention and Access
Logging privacy also depends on:
who can access logs
how long logs are retained
which vendors receive data
where data is stored
how deletion requests are handled
Frontend engineers may not own all policy decisions, but they should design telemetry that supports them.
Interview Example
If asked, "What would you log for a failed checkout form?"
Answer:
"I would log event name, route, release, browser, error code, field names with validation categories, request ID, and retryability. I would not log card numbers, CVV, full billing address, raw form state, tokens, or full provider payloads."
Common Mistakes
Common mistakes include:
logging raw form state
logging Authorization headers
capturing full URLs with tokens
enabling replay on sensitive routes
using denylist redaction only
keeping logs forever
sending private content to analytics
letting every developer access production replay data
Senior-Level Framing
The senior framing:
"I design frontend observability with privacy by default: structured allowlisted events, redaction, sampling, route exclusions, retention limits, and clear ownership."
Practice Prompt
Design logging for:
question page crash
practice console runtime error
failed PDF download
login callback failure
payment form validation error
For each, list allowed fields and forbidden fields.
Final Mental Model
Logs are production data.
If they collect sensitive user information, they become part of the attack surface.
Debug with evidence, but collect less than you technically can.