환경 변수를 사용하여 보호된 리소스에 액세스

Managed Runtime 환경 변수를 사용하면 코드를 변경하지 않고도 환경에서 실행 중인 애플리케이션 프로세스에 변수를 추가할 수 있습니다. 환경 변수는 안전하게 저장되므로 다음과 같은 활용 사례에 적합합니다.

  • API 키로 보호되는 타사 리소스 호출
  • 조건부로 React.js 렌더링 변경

자세한 내용은 환경 변수를 참조하십시오.

환경 변수를 사용하여 안전한 외부 리소스에 액세스하는 데 사용되는 API 키를 저장해 보겠습니다. 이 튜토리얼의 리소스는 가상의 타사 콘텐츠 관리 시스템(CMS)입니다. CMS에 요청하고 보호된 데이터로 응답하는 처리기를 Express.js 서버의 ssr.js에 추가합니다. 그런 다음 이 처리기를 호출하여 데이터에 액세스합니다.

보안상의 이유로, 이 API 키는 클라이언트 측 코드가 아닌 서버 측 코드에서 CMS를 호출합니다.

이 튜토리얼을 완료하려면 먼저 다음을 수행합니다.

  • Managed Runtime 및 Runtime Admin에 대한 액세스 권한을 부여 받습니다. Managed Runtime 관리를 참조하십시오.
  • Managed Runtime API를 사용하기 위한 API 키를 얻습니다. API 키를 찾으려면 Runtime Admin 도구에 로그인하여 계정 설정 페이지로 이동하십시오.
  • 환경 변수를 설정하는 프로젝트에 대한 개발자 또는 관리자 역할을 부여 받습니다. 액세스 권한이 없는 경우 Managed Runtime 관리자 역할의 다른 사람에게 도움을 요청하십시오.

이 튜토리얼의 명령을 실행하기 전에 Placeholder를 실제 값으로 바꿉니다. 자리 표시자는 $PLACEHOLDER와 같은 형식입니다.

  1. 현재 세션에서 환경 변수를 설정하려면 터미널을 열고 다음 명령을 실행합니다.

    • Windows: set CMS_API_KEY='my-cms-api-key'
    • macOS를 비롯한 대부분의 Unix 계열 운영 체제:export CMS_API_KEY='my-cms-api-key'

  2. 다음을 실행하여 환경 변수가 올바르게 설정되었는지 확인합니다.

    • Windows: echo %CMS_API_KEY%
    • macOS를 비롯한 대부분의 Unix 계열 운영 체제:echo $CMS_API_KEY

    이 명령은 my-cms-api-key를 출력으로 반환합니다.

  3. ssr.js에서 CMS를 호출하기 위해 이 JavaScript 코드를 추가합니다.

  1. 이 처리기를 Express.js 서버의 경로에 바인딩합니다. 그런 다음 npm start를 사용하여 개발 서버를 시작합니다. 마지막으로, 로컬에서 처리기로 이동하여 CMS 데이터가 반환되는지 확인합니다.

변경 사항을 프로덕션 환경에 배포하기 전에 비프로덕션 환경에서 이러한 단계를 테스트하는 것이 좋습니다.

이 튜토리얼의 명령을 실행하기 전에 Placeholder를 실제 값으로 바꿉니다. 자리 표시자는 $PLACEHOLDER와 같은 형식입니다.

  1. projects_target_env_var_partial_update 엔드포인트를 호출하여 환경 변수를 설정합니다. 그러면 번들이 배포됩니다. 코드에서 API 키를 사용하기 전에 환경이 다시 배포될 때까지 기다립니다. Runtime Admin을 사용하여 환경 변수를 관리할 수도 있습니다. 환경 변수를 참조하십시오.
  1. 선택한 환경에 로컬 시스템의 번들을 배포합니다.