0

I would like to add custom headers on specific file extensions when using Gatsby on Gatsby Hosting.

I am trying out the gatsby-plugin-gatsby-cloud plugin, which generates a _headers.json file that Gatsby Hosting uses.

As a test, I did the following configuration:

    {
      resolve: 'gatsby-plugin-gatsby-cloud',
      options: {
        headers: {
          '/images/components/PromotionBoxDownloadApp/napp-demo-screens.webp': [
            'X-Test-Omega: MD00',
          ],
          '/images/components/PromotionBoxDownloadApp/*.webp': [
            'X-Test-StarWebp: true',
          ],
          '/images/components/PromotionBoxDownloadApp/*': [
            'X-Test-Star: true',
          ],
          '*.webp': [
            'X-Test-Three: MD33',
          ],
          '/*.webp': [
            'X-Test-Beta: MD11',
          ],
          '/**/*.webp': [
            'X-Test-Gamma: MD22',
          ],
          '/*': [
            'X-Test-Two: MD22',
          ],
        }
      }

And then I am fetching the the resource /images/images/components/PromotionBoxDownloadApp/napp-demo-screens.webp.

I see that the response headers return the following test headers:

  • X-Test-Omega: MD00
  • X-Test-Star: true
  • X-Test-Two: MD22

Meaning, the following sections worked:

  • '/images/components/PromotionBoxDownloadApp/napp-demo-screens.webp'
  • '/images/components/PromotionBoxDownloadApp/*'
  • '/*'

But it seems like '/*.webp' nor '/**/*.webp' worked.

Is it not possible to target specific file extensions with _headers.json?

corgrath
  • 11,673
  • 15
  • 68
  • 99

0 Answers0