Configure HTTP security response headers for Azure Static Web Apps

Introduction

HTTP security headers are the most crucial part of web applications that helps to protect against a variety of attacks mostly like as cross-site scripting, clickjacking and other script attacks, configure HTTP security headers frequently got forget by Developers ! I recently checked this blog on this website securityheaders.com the results indicated many of HTTP security headers are not configured then I decided to put some HTTP security headers to my blog that it is running on Azure Static Web Apps.

Recommended HTTP security headers

1. Strict-Transport-Security

2. Content-Security-Policy

3. X-Frame-Options

4. X-Permitted-Cross-Domain-Policies

5. X-Content-Type-Options

6. Permissions-Policy

Configure HTTP security headers

You can create a JSON file is called ( staticwebapp.config.json ) in the root of the website and put the configuration like the folloing after you can deploy it to your Azure Static Web App.

{
      "globalHeaders": {
        "content-security-policy": "frame-ancestors 'self'; upgrade-insecure-requests",
        "X-Frame-Options": "SAMEORIGIN",
        "X-Permitted-Cross-Domain-Policies": "none",
        "Referrer-Policy":"no-referrer",
        "X-Content-Type-Options": "nosniff",
        "Permissions-Policy": "autoplay=()"
    }
  }