Configuração de cabeçalhos personalizados - AWS Amplify Hospedagem
Exemplo de cabeçalhos personalizados de segurançaConfiguração de cabeçalhos personalizados de controle de cache

As traduções são geradas por tradução automática. Em caso de conflito entre o conteúdo da tradução e da versão original em inglês, a versão em inglês prevalecerá.

Configuração de cabeçalhos personalizados

Há duas formas de se especificar cabeçalhos HTTP personalizados para uma aplicação do Amplify. É possível especificar cabeçalhos no console do Amplify ou especificar cabeçalhos baixando e editando o arquivo customHttp.yml de uma aplicação e salvando-o no diretório raiz do seu projeto.

Para definir cabeçalhos personalizados para uma aplicação e salvá-los no console

  1. Faça login no AWS Management Console e abra o console do Amplify.

  2. Escolha o aplicativo para o qual definir cabeçalhos personalizados.

  3. No painel de navegação, escolha Hospedagem e, em seguida, escolha Cabeçalhos personalizados.

  4. Na página Cabeçalhos personalizados, escolha Editar.

  5. Na janela Editar cabeçalhos personalizados, insira as informações dos seus cabeçalhos personalizados usando o formato YAML de cabeçalho personalizado.

    1. Para pattern, insira o padrão a ser correspondente.

    2. Para key, insira o nome do cabeçalho personalizado.

    3. Para value, insira o valor do cabeçalho personalizado.

  6. Escolha Salvar.

  7. Reimplante o aplicativo para aplicar os novos cabeçalhos personalizados.

    • Para um aplicativo CI/CD, navegue até a filial para implantar e escolha Reimplantar esta versão. É possível também realizar uma nova compilação a partir do seu repositório Git.

    • Para um aplicativo de implantação manual, implante o aplicativo novamente no console do Amplify.

Para definir cabeçalhos personalizados para uma aplicação e salvá-los na raiz do seu repositório

  1. Faça login no AWS Management Console e abra o console do Amplify.

  2. Escolha o aplicativo para o qual definir cabeçalhos personalizados.

  3. No painel de navegação, escolha Hospedagem e, em seguida, escolha Cabeçalhos personalizados.

  4. Na página Cabeçalhos personalizados, escolha Baixar YML.

  5. Abra o arquivo customHttp.yml baixado no editor de código de sua preferência e insira as informações dos cabeçalhos personalizados usando o formato YAML do cabeçalho personalizado.

    1. Para pattern, insira o padrão a ser correspondente.

    2. Para key, insira o nome do cabeçalho personalizado.

    3. Para value, insira o valor do cabeçalho personalizado.

  6. Salve o arquivo customHttp.yml editado no diretório raiz do seu projeto. Se você estiver trabalhando com um monorepo, salve o arquivo customHttp.yml na raiz do seu repositório.

  7. Reimplante o aplicativo para aplicar os novos cabeçalhos personalizados.

    • Para um aplicativo de CI/CD, execute uma nova compilação do seu repositório Git que inclua o novo arquivo customHttp.yml.

    • Para um aplicativo de implantação manual, implante o aplicativo novamente no console do Amplify e inclua o novo arquivo customHttp.yml com os artefatos que você carrega.

nota

Os cabeçalhos personalizados definidos no arquivo customHttp.yml e implantados no diretório raiz da aplicação substituirão os cabeçalhos personalizados definidos na seção Cabeçalhos personalizados no console do Amplify.

Exemplo de cabeçalhos personalizados de segurança

Cabeçalhos de segurança permitem aplicar HTTPS, impedindo ataques XSS e defendendo seu navegador contra clickjacking. Use a seguinte sintaxe YAML para aplicar cabeçalhos de segurança personalizados ao seu aplicativo.

customHeaders:
  - pattern: '**'
    headers:
      - key: 'Strict-Transport-Security'
        value: 'max-age=31536000; includeSubDomains'
      - key: 'X-Frame-Options'
        value: 'SAMEORIGIN'
      - key: 'X-XSS-Protection'
        value: '1; mode=block'
      - key: 'X-Content-Type-Options'
        value: 'nosniff'
      - key: 'Content-Security-Policy'
        value: "default-src 'self'"

Configuração de cabeçalhos personalizados de controle de cache

As aplicações hospedadas com o Amplify respeitam os cabeçalhos Cache-Control enviados pela origem, a menos que você os substitua por cabeçalhos personalizados definidos por você. O Amplify só aplica cabeçalhos personalizados de controle de cache para respostas com êxito com um código de status 200 OK. Isso evita que as respostas de erro sejam armazenadas em cache e veiculadas a outros usuários que façam a mesma solicitação.

É possível ajustar manualmente a diretiva s-maxage para ter mais controle sobre o desempenho e a disponibilidade de implantação do seu aplicativo. Por exemplo, para aumentar o tempo de permanência do conteúdo em cache na borda, é possível aumentar manualmente o tempo de vida útil (TTL) atualizando s-maxage para um valor maior que o padrão de 600 segundos (10 minutos).

Para especificar um valor para s-maxage, use o seguinte formato YAML. Este exemplo mantém o conteúdo associado em cache na borda por 3600 segundo (uma hora).

customHeaders:
  - pattern: '/img/*'
    headers:
      - key: 'Cache-Control' 
        value: 's-maxage=3600'

Para obter mais informações sobre como controlar o desempenho do aplicativo com cabeçalhos, consulte Uso do cabeçalho Cache-Control para aumentar a performance da aplicação.