A React single-page app for recreation registration embeds a privileged Cognito app client secret and a long-lived AWS access key in the browser bundle. What should the team do?
Select an answer to reveal the explanation.
Short Explanation
Anything in a React bundle is a postcard — the whole internet can read it. Privileged Cognito secrets and AWS keys stay on the server; browsers get public-client OAuth patterns like PKCE.
Full Explanation
A React single-page app for recreation registration must not embed a privileged Cognito app client secret or a long-lived AWS access key in the browser bundle. The team should remove privileged secrets from the client, use a public app client with Authorization Code and PKCE (or a comparable public-client flow), and keep AWS keys only on server-side components. Browser bundles are downloadable by every resident device; municipal identity design assumes anything shipped to JavaScript is public.
Rotating the access key weekly but keeping both secrets in the bundle fails because rotation does not stop extraction from downloaded JavaScript between rotations. Base64-encoding the Cognito secret in localStorage fails conceptually—encoding is not confidentiality and localStorage is still client-visible. Publishing the bundle to an open S3 website to help scanners find keys faster fails because it increases exposure rather than removing secrets.
Exam caveat: public Cognito app clients still need correct callback URLs, PKCE, and scoped tokens; removing the secret is necessary but not sufficient alone. Operational check: scan the production JS bundle for AKIA-like keys and client secrets, confirm only public client IDs remain, and verify AWS credentials exist only in server/Lambda roles.