사용자 지정 헤더 - AWS Amplify 호스팅

기계 번역으로 제공되는 번역입니다. 제공된 번역과 원본 영어의 내용이 상충하는 경우에는 영어 버전이 우선합니다.

사용자 지정 헤더

사용자 지정 HTTP 헤더를 사용하면 모든 HTTP 응답에 대해 헤더를 지정할 수 있습니다. 응답 헤더는 디버깅, 보안 및 정보 제공을 목적으로 사용할 수 있습니다. AWS Management Console에서 헤더를 지정하거나 앱의 customHttp.yml 파일을 다운로드하고 편집한 후 프로젝트의 루트 디렉터리에 저장하여 헤더를 지정할 수 있습니다. 자세한 절차는 사용자 지정 헤더 설정 섹션을 참조하세요.

이전에는 AWS Management Console에서 빌드 사양(buildspec)을 편집하거나 amplify.yml 파일을 다운로드하고 업데이트한 다음, 프로젝트의 루트 디렉터리에 저장하는 방식으로 앱에 대한 사용자 지정 HTTP 헤더를 지정했습니다. 이러한 방식으로 지정된 사용자 지정 헤더는 buildspec 및 amplify.yml 파일 외부로 마이그레이션해야 합니다. 지침은 사용자 지정 헤더 마이그레이션 섹션을 참조하세요.

사용자 지정 헤더 YAML 형식

다음 YAML 형식을 사용하여 사용자 지정 헤더를 지정합니다.

customHeaders: - pattern: '*.json' headers: - key: 'custom-header-name-1' value: 'custom-header-value-1' - key: 'custom-header-name-2' value: 'custom-header-value-2' - pattern: '/path/*' headers: - key: 'custom-header-name-1' value: 'custom-header-value-2'

모노레포의 경우, 다음 YAML 형식을 사용합니다.

applications: - appRoot: app1 customHeaders: - pattern: '**/*' headers: - key: 'custom-header-name-1' value: 'custom-header-value-1' - appRoot: app2 customHeaders: - pattern: '/path/*.json' headers: - key: 'custom-header-name-2' value: 'custom-header-value-2'

앱에 사용자 지정 헤더를 추가할 때 다음에 대해 고유한 값을 지정해야 합니다.

패턴

패턴과 일치하는 모든 URL 파일 경로에 사용자 지정 헤더가 적용됩니다.

헤더

파일 패턴과 일치하는 헤더를 정의합니다.

사용자 지정 헤더의 이름입니다.

사용자 지정 헤더의 값입니다.

HTTP 헤더에 대한 자세한 내용은 Mozilla의 HTTP 헤더 목록을 참조하세요.

사용자 지정 헤더 설정

AWS Amplify 앱에 사용자 지정 HTTP 헤더를 지정하는 방법은 두 가지가 있습니다. AWS Management Console에서 헤더를 지정하거나 앱의 customHttp.yml 파일을 다운로드하고 편집한 후 프로젝트의 루트 디렉터리에 저장하여 헤더를 지정할 수 있습니다.

AWS Management Console에서 앱에 사용자 지정 헤더를 설정하려면
  1. AWS Management Console에 로그인하고 Amplify 콘솔을 엽니다.

  2. 사용자 지정 헤더를 설정할 앱을 선택합니다.

  3. 탐색 창에서 앱 설정, 사용자 지정 헤더를 선택합니다.

  4. 사용자 지정 헤더 사양 섹션에서 편집을 선택합니다.

  5. 편집 창에서 사용자 지정 헤더 YAML 형식을 사용하여 사용자 지정 헤더의 정보를 입력합니다.

    1. pattern에 일치시킬 패턴을 입력합니다.

    2. key에 사용자 지정 헤더의 이름을 입력합니다.

    3. value에 사용자 지정 헤더의 값을 입력합니다.

  6. 저장을 선택합니다.

  7. 앱을 재배포하여 새 사용자 지정 헤더를 적용합니다.

    • CI/CD 앱의 경우, 배포할 브랜치로 이동한 다음 이 버전 재배포를 선택합니다. Git 리포지토리에서 새 빌드를 수행할 수도 있습니다.

    • 수동 배포 앱의 경우, Amplify 콘솔에서 앱을 다시 배포합니다.

customHttp.yml 파일을 사용하여 사용자 지정 헤더를 설정하려면
  1. AWS Management Console에 로그인하고 Amplify 콘솔을 엽니다.

  2. 사용자 지정 헤더를 설정할 앱을 선택합니다.

  3. 탐색 창에서 앱 설정, 사용자 지정 헤더를 선택합니다.

  4. 사용자 지정 헤더 사양 섹션에서 다운로드를 선택합니다.

  5. 다운로드한 customHttp.yml 파일을 선택한 코드 편집기에서 열고 사용자 지정 헤더 YAML 형식을 사용하여 사용자 지정 헤더에 대한 정보를 입력합니다.

    1. pattern에 일치시킬 패턴을 입력합니다.

    2. key에 사용자 지정 헤더의 이름을 입력합니다.

    3. value에 사용자 지정 헤더의 값을 입력합니다.

  6. 편집된 customHttp.yml 파일을 프로젝트의 루트 디렉터리에 저장합니다. 모노레포로 작업하는 경우, 리포지토리의 루트에 customHttp.yml 파일을 저장합니다.

  7. 앱을 재배포하여 새 사용자 지정 헤더를 적용합니다.

    • CI/CD 앱의 경우, 새 customHttp.yml 파일이 포함된 Git 리포지토리에서 새 빌드를 수행합니다.

    • 수동 배포 앱의 경우, Amplify 콘솔에서 앱을 다시 배포하고 업로드하는 아티팩트와 함께 새 customHttp.yml 파일을 포함합니다.

참고

customHttp.yml 파일에 설정되고 앱의 루트 디렉터리에 배포된 사용자 지정 헤더는 AWS Management Console의 사용자 지정 헤더 섹션에 정의된 사용자 지정 헤더를 재정의합니다.

사용자 지정 헤더 마이그레이션

이전에는 AWS Management Console에서 buildspec을 편집하거나 amplify.yml 파일을 다운로드하고 업데이트한 다음, 프로젝트의 루트 디렉터리에 저장하여 앱에 대한 사용자 지정 HTTP 헤더를 지정했습니다. 사용자 지정 헤더를 buildspec 및 amplify.yml 파일 외부로 마이그레이션하는 것이 좋습니다.

AWS Management Console의 사용자 지정 헤더 섹션에서 또는 customHttp.yml 파일을 다운로드하고 편집하여 사용자 지정 헤더를 지정합니다.

Amplify 콘솔에 저장된 사용자 지정 헤더를 마이그레이션하려면
  1. AWS Management Console에 로그인하고 Amplify 콘솔을 엽니다.

  2. 사용자 지정 헤더 마이그레이션을 수행할 앱을 선택합니다.

  3. 탐색 창에서 앱 설정, 빌드 설정을 선택합니다. 앱 빌드 사양 섹션에서 앱의 buildspec을 검토할 수 있습니다.

  4. 다운로드를 선택하여 현재 buildspec의 사본을 저장합니다. 설정을 복구해야 하는 경우, 나중에 이 사본을 참조할 수 있습니다.

  5. 다운로드가 완료되면 편집을 선택합니다.

  6. 나중에 9단계에서 사용할 수 있으므로 파일의 사용자 지정 헤더 정보를 기록해 둡니다. 편집 창에서 파일의 사용자 지정 헤더를 삭제하고 저장을 선택합니다.

  7. 탐색 창에서 앱 설정, 사용자 지정 헤더를 선택합니다.

  8. 사용자 지정 헤더 사양 섹션에서 편집을 선택합니다.

  9. 6단계에서 삭제한 사용자 지정 헤더의 정보를 편집 창에 입력합니다.

  10. 저장을 선택합니다.

  11. 새 사용자 지정 헤더를 적용할 브랜치를 재배포합니다.

사용자 지정 헤더를 amplify.yml에서 customHttp.yml로 마이그레이션하려면
  1. 앱의 루트 디렉터리에 현재 배포된 amplify.yml 파일로 이동합니다.

  2. 원하는 코드 편집기에서 amplify.yml 파일을 엽니다.

  3. 나중에 8단계에서 사용하게 되므로 파일의 사용자 지정 헤더 정보를 기록해 둡니다. 파일의 사용자 지정 헤더를 삭제합니다. 파일을 저장하고 닫습니다.

  4. AWS Management Console에 로그인하고 Amplify 콘솔을 엽니다.

  5. 사용자 지정 헤더를 설정할 앱을 선택합니다.

  6. 탐색 창에서 앱 설정, 사용자 지정 헤더를 선택합니다.

  7. 사용자 지정 헤더 사양 섹션에서 다운로드를 선택합니다.

  8. 다운로드한 customHttp.yml 파일을 원하는 코드 편집기에서 열고 3단계의 amplify.yml에서 삭제한 사용자 지정 헤더의 정보를 입력합니다.

  9. 편집된 customHttp.yml 파일을 프로젝트의 루트 디렉터리에 저장합니다. 모노레포로 작업하는 경우, 리포지토리의 루트에 파일을 저장합니다.

  10. 앱을 재배포하여 새 사용자 지정 헤더를 적용합니다.

    • CI/CD 앱의 경우, 새 customHttp.yml 파일이 포함된 Git 리포지토리에서 새 빌드를 수행합니다.

    • 수동 배포 앱의 경우, Amplify 콘솔에서 앱을 다시 배포하고 업로드하는 아티팩트와 함께 새 customHttp.yml 파일을 포함합니다.

참고

customHttp.yml 파일에 설정되고 앱의 루트 디렉터리에 배포된 사용자 지정 헤더는 AWS Management Console의 사용자 지정 헤더 섹션에 정의된 사용자 지정 헤더를 재정의합니다.

모노레포 사용자 지정 헤더

모노레포 앱에 대한 사용자 지정 헤더를 지정할 때는 다음 설정 요구 사항에 유의합니다.

  • 모노레포에는 특정 YAML 형식이 있습니다. 사용자 지정 헤더 YAML 형식 섹션에서 올바른 구문을 참조하세요.

  • AWS Management Console의 사용자 지정 헤더 섹션을 사용하여 모노레포 애플리케이션에 대한 사용자 지정 헤더를 지정할 수 있습니다. 단, 새 사용자 지정 헤더를 적용하려면 애플리케이션을 재배포해야 합니다.

  • 콘솔을 사용하는 대신 모노레포 앱에 대한 사용자 지정 헤더를 customHttp.yml 파일에 지정할 수 있습니다. customHttp.yml 파일을 리포지토리의 루트에 저장한 다음, 애플리케이션을 재배포하여 새 사용자 지정 헤더를 적용해야 합니다. customHttp.yml 파일에 지정된 사용자 지정 헤더는 AWS Management Console의 사용자 지정 헤더 섹션을 사용하여 지정된 모든 사용자 지정 헤더를 재정의합니다.

보안 헤더 예제

사용자 지정 보안 헤더는 HTTPS 실행, XSS 공격 예방 및 클릭재킹으로부터 브라우저 보호를 활성화합니다. 다음 YAML 구문을 사용하여 앱에 사용자 지정 보안 헤더를 적용할 수 있습니다.

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'"

캐시 제어 헤더 예제

앱의 성능 및 배포 가용성을 더 잘 제어하도록 s-maxage 디렉티브를 수동으로 조정할 수 있습니다. 예를 들어 콘텐츠가 엣지에 캐시되는 시간을 늘리려면 s-maxage을(를) 기본값인 600초(10분)보다 긴 값으로 업데이트하여 TTL(Time to Live)을 수동으로 늘릴 수 있습니다.

s-maxage에 사용자 지정 값을 지정하려면 다음 YAML 형식을 사용합니다. 이 예제에서는 관련 콘텐츠를 3,600초(1시간) 동안 엣지에 캐시된 상태로 유지합니다.

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

헤더로 애플리케이션 성능을 제어하는 방법에 대한 자세한 내용은 헤더를 사용하여 캐시 기간 제어 섹션을 참조하세요.