Client-side security: code that runs in the browser
You recognise risks born in the browser from cross-origin communication, JavaScript-specific flaws and third-party scripts, and close CORS, postMessage, prototype pollution and SRI mistakes in code.
Level 301 · 15 lessons · 13 practice labs
Lessons
Cross-origin communication
- CORS misconfiguration: reflected origins and credentials
- postMessage: message listeners without origin checks
- Open redirects and how they help phishing
- WebSocket security: origin checks and authentication
- Short task: close the CORS and postMessage mistakes in the lab app
JavaScript-specific flaws
- Prototype pollution: the dark side of object merging
- DOM clobbering: HTML overwriting a variable
- Keys and hidden endpoints embedded in client code
- Sensitive data in browser storage
- Short task: evidence prototype pollution and fix it with a safe merge
Supply chain and monitoring
- Third-party scripts: analytics, ads and chat widgets
- Pinning CDN files with Subresource Integrity (SRI)
- npm dependencies and lock files
- Service workers and cache risks
- Capstone: run a client-side security review of a single-page app and close the findings
Practice labs
- A message listener with no origin check: Prove the postMessage listener accepts messages from any origin and add an origin check.
- An open redirect: the next parameter: Prove the next parameter redirects to an outside address after login and allow relative paths only.
- A WebSocket with no origin check: Show a WebSocket opened from another origin is accepted with the session cookie and add Origin validation.
- postMessage with a * target in a partner widget: Find sensitive data sent to a partner iframe widget without a target origin and pin the target origin.
- An origin validated with a regex: Show in the lab that CORS code validating the origin with a loose regex accepts a lookalike domain and change it to exact matching.
- An API key embedded in client code: Find the secret key embedded in the JavaScript bundle, move it to the server and rotate the key.
- Prototype pollution: deep merge: Prove the settings merge function accepts the __proto__ key and fix it with a safe merge.
- Configuration overwritten by DOM clobbering: Show in the lab that user HTML overwrites a global configuration variable and define the variable independently of the DOM.
- Sensitive data in browser storage: Find sensitive data stored in localStorage and IndexedDB, remove what is not needed and add clean-up at logout.
- Add SRI to a CDN script: Find CDN scripts without an integrity attribute, add SRI and show a modified file does not load.
- A third-party script inventory: List the third-party scripts the pages load, remove the unneeded ones and limit the rest with CSP.
- Dependency audit with the lock file: Trace the flaws from an npm audit in the lock file, upgrade the one that really affects you and show the build is reproducible.
- A service worker and a stale cache: Show personal pages are served from the service worker cache after logout and fix the cache scope.
About this course
You recognise risks born in the browser from cross-origin communication, JavaScript-specific flaws and third-party scripts, and close CORS, postMessage, prototype pollution and SRI mistakes in code.
What you will learn
- Cross-origin communication
- JavaScript-specific flaws
- Supply chain and monitoring
Prerequisites
You should be comfortable with the level 101 and 201 topics of the same path.
Lab environment
Lessons run on your own Kali Linux desktop in the browser, with the tools ready in their windowed interfaces. Nothing to install; a computer screen is recommended.
Frequently asked questions
- Is this course right for my level?
- The course is at level 301; it assumes you know the topics of the lower-level courses.
- Is there anything to install?
- No. Every lesson runs in your own lab environment that opens in the browser.
- How do lessons work?
- Each lesson has 8 to 10 steps and a short quiz. Early steps show the command to type, later steps give less help; if two attempts fail, the solution opens.
- Can I try it for free?
- Yes. The first three lessons of every course are free.