Synopsys Enters into Definitive Agreement for Sale of Application Security (Software Integrity Group) Learn More

close search bar

Sorry, not available in this language yet

close language selection

Defensive Programming for HTML5 Security

Course Description

HTML5 is the fifth revision of the HTML standard. HTML5 and its integration with JavaScript introduce new security risks that you must consider carefully when writing web front-end code. Modern web-based software, including mobile web front-end applications, make heavy use of innovative JavaScript and HTML5 browser support to deliver advanced user experiences. Front-end developers focus their efforts on creating these experiences and are generally not aware of the security implications of the technologies they use.

This course helps web front-end developers understand the risks involved with manipulating the HTML Document Object Model (DOM) and using the advanced features of JavaScript and HTML5 (e.g., cross-origin resource sharing, local storage, and content security policy). In this course, we’ll reinforce some important security aspects of modern browser architecture and present defensive programming techniques that developers can apply immediately to avoid introducing common vulnerabilities. We’ll also provide a detailed description of typical JavaScript sources and sinks and explain how to use them to detect problems in code.


Learning Objectives

  • Recognize that client-side code can introduce security vulnerabilities
  • Appreciate the HTML5 risk landscape
  • Apply defensive programming techniques in HTML5
  • Identify and fix security vulnerabilities in HTML5 code


Delivery Format: eLearning

Duration: 1 hour 30 minutes

Level: Intermediate

Intended Audience:

  • Front-End Developers
  • Mobile Developers 


Course Outline

Risk Landscape

  • Modern Browsers
  • Modern Web Applications
  • The Attack Surface
  • The Reincarnation of Cross-Site Scripting

The Security Model of the Web

  • Same-Origin Policy
  • Same-Origin Policy Example
  • Sidestepping the SOP with Clickjacking
  • JavaScript Execution
  • Subresource Integrity

Client-Side Data Storage

  • Risks of Client-Side Data Storage
  • Security Considerations
  • Clearing Data

Web Messaging

  • Sending Messages
  • Receiving Messages
  • Overview of Best Practices

Iframe Sandboxing

  • The Sandbox Attribute
  • Relaxing the Sandbox
  • Sandboxing Use Cases
  • Consequences of the Sandbox

Content Security Policy (CSP)

  • Defining a CSP Policy
  • Limiting Cross-Site Scripting with CSP
  • Deploying a Strong CSP Policy
  • CSP Beyond XSS
  • Additional CSP Features
  • Overview of Best Practices

Understanding Cross-Origin Resource Sharing

  • Simple CORS Requests
  • Authenticated CORS Requests
  • Understanding the Threat Model of CORS
  • Preflighted CORS Requests
  • Handling Headers with CORS
  • CORS Beyond JavaScript

Securing Web Applications with CORS

  • Special CORS Cases
  • Building a CORS Policy
  • CORS and CSRF
  • Testing Your CORS policy

Additional HTML5 features

  • Permission-Based APIs
  • Web Workers
  • WebSockets


  • Controlling JavaScript
  • Compartmentalization


Developer Security Training

Equip development teams with the skills and education to write secure code and fix issues faster