Headers

import { Render } from "/components"; import { Code } from "/components";

Default headers

When serving static assets, Workers will attach some headers to the response by default. These are:

• Content-Type

  A Content-Type header is attached to the response if one is provided during the asset upload process. Wrangler automatically determines the MIME type of the file, based on its extension.

• Cache-Control: public, max-age=0, must-revalidate

  Sent when the request does not have an Authorization or Range header, this response header tells the browser that the asset can be cached, but that the browser should revalidate the freshness of the content every time before using it. This default behavior ensures good website performance for static pages, while still guaranteeing that stale content will never be served.

• ETag

  This header complements the default Cache-Control header. Its value is a hash of the static asset file, and browsers can use this in subsequent requests with an If-None-Match header to check for freshness, without needing to re-download the entire file in the case of a match.

• CF-Cache-Status

  This header indicates whether the asset was served from the cache (HIT) or not (MISS).[^1]

Cloudflare reserves the right to attach new headers to static asset responses at any time in order to improve performance or harden the security of your Worker application.

Custom headers

The default response headers served on static asset responses can be overridden, removed, or added to, by creating a plain text file called _headers without a file extension, in the static asset directory of your project. This file will not itself be served as a static asset, but will instead be parsed by Workers and its rules will be applied to static asset responses.

<Render product="workers" file="headers_redirects_directory-workers" params={{ filename: "_headers" }} />

Headers defined in the _headers file override what Cloudflare ordinarily sends.

:::caution

Custom headers defined in the _headers file are not applied to responses generated by your Worker code, even if the request URL matches a rule defined in _headers. If you use a server-side rendered (SSR) framework, have configured assets.run_worker_first, or otherwise use a Worker script, you will likely need to attach any custom headers you wish to apply directly within that Worker script.

:::

Attach a header

Header rules are defined in multi-line blocks. The first line of a block is the URL or URL pattern where the rule's headers should be applied. On the next line, an indented list of header names and header values must be written:

[url]
  [name]: [value]

Using absolute URLs is supported, though be aware that absolute URLs must begin with https and specifying a port is not supported. _headers rules ignore the incoming request's port and protocol when matching against an incoming request. For example, a rule like https://example.com/path would match against requests to other://example.com:1234/path.

You can define as many [name]: [value] pairs as you require on subsequent lines. For example:

<Code lang="txt" code={# This is a comment\n/secure/page\n\tX-Frame-Options: DENY\n\tX-Content-Type-Options: nosniff\n\tReferrer-Policy: no-referrer\n\n/static/*\n\tAccess-Control-Allow-Origin: *\n\tX-Robots-Tag: nosnippet\n\nhttps://myworker.mysubdomain.workers.dev/*\n\tX-Robots-Tag: noindex} />

An incoming request which matches multiple rules' URL patterns will inherit all rules' headers. Using the previous _headers file, the following requests will have the following headers applied:

You may define up to 100 header rules. Each line in the _headers file has a 2,000 character limit. The entire line, including spacing, header name, and value, counts towards this limit.

If a header is applied twice in the _headers file, the values are joined with a comma separator.

Detach a header

You may wish to remove a default header or a header which has been added by a more pervasive rule. This can be done by prepending the header name with an exclamation mark and space (! ).

/*
  Content-Security-Policy: default-src 'self';

/*.jpg
  ! Content-Security-Policy

Match a path

The same URL matching features that _redirects offers is also available to the _headers file. Note, however, that redirects are applied before headers, so when a request matches both a redirect and a header, the redirect takes priority.

Splats

When matching, a splat pattern — signified by an asterisk (*) — will greedily match all characters. You may only include a single splat in the URL.

The matched value can be referenced within the header value as the :splat placeholder.

Placeholders

<Render product="workers" file="headers_redirects_placeholders" params={{ filetype: "header" }} />

/movies/:title
  x-movie-name: You are watching ":title"

Examples

Cross-Origin Resource Sharing (CORS)

To enable other domains to fetch every static asset from your Worker, the following can be added to the _headers file:

/*
  Access-Control-Allow-Origin: *

This applies the Access-Control-Allow-Origin header to any incoming URL. Note that the CORS specification only allows *, null, or an exact origin as valid Access-Control-Allow-Origin values — wildcard patterns within origins are not supported. To allow CORS from specific Version URLs, you will need to handle this dynamically in your Worker code rather than through the _headers file.

Prevent your workers.dev URLs showing in search results

Google and other search engines often support the X-Robots-Tag header to instruct its crawlers how your website should be indexed.

For example, to prevent your *.*.workers.dev URLs from being indexed, add the following to your _headers file:

<Code lang="txt" code={https://:version.:subdomain.workers.dev/*\n\tX-Robots-Tag: noindex} />

Configure custom browser cache behavior

If you have a folder of fingerprinted assets (assets which have a hash in their filename), you can configure more aggressive caching behavior in the browser to improve performance for repeat visitors:

/static/*
  Cache-Control: public, max-age=31556952, immutable

Harden security for an application

:::caution

If you are server-side rendering (SSR) or using a Worker to generate responses in any other way and wish to attach security headers, the headers should be sent from the Worker's Response instead of using a _headers file. For example, if you have an API endpoint and want to allow cross-origin requests, you should ensure that your Worker code attaches CORS headers to its responses, including to OPTIONS requests.

:::

You can prevent click-jacking by informing browsers not to embed your application inside another (for example, with an <iframe>) with a X-Frame-Options header.

X-Content-Type-Options: nosniff prevents browsers from interpreting a response as any other content-type than what is defined with the Content-Type header.

Referrer-Policy allows you to customize how much information visitors give about where they are coming from when they navigate away from your page.

Browser features can be disabled to varying degrees with the Permissions-Policy header (recently renamed from Feature-Policy).

If you need fine-grained control over your application's content, the Content-Security-Policy header allows you to configure a number of security settings, including similar controls to the X-Frame-Options header.

/app/*
  X-Frame-Options: DENY
  X-Content-Type-Options: nosniff
  Referrer-Policy: no-referrer
  Permissions-Policy: document-domain=()
  Content-Security-Policy: script-src 'self'; frame-ancestors 'none';

[^1]: Due to a technical limitation that we hope to address in the future, the CF-Cache-Status header is not always entirely accurate. It is possible for false-positives and false-negatives to occur. This should be rare. In the meantime, this header should be considered as returning a "probabilistic" result.