AWS - cognito 이메일 찾기 / .env 파일 사용하여 환경변수 불러오기 / dotenv 라이브러리

 

import dotenv from "dotenv";

// 아이디와 핸드폰번호로 이메일 찾는 함수
const onFindEmail = async () => {
    try {
      dotenv.config();

      const AWS = require("aws-sdk");
      AWS.config.update({
        accessKeyId: process.env.REACT_APP_AWS_ACCESS_KEY_ID,
        secretAccessKey: process.env.REACT_APP_AWS_SECRET_ACCESS_KEY,
        region: process.env.REACT_APP_AWS_REGION,
      });

      const cognito = new AWS.CognitoIdentityServiceProvider();

      const params = {
        UserPoolId: process.env.REACT_APP_AWS_USER_POOL_ID,
        Filter: `name = "${name}" and phone_number = "${phone}"`,
        Limit: 1,
      };

      cognito.listUsers(params, function (err, data) {
        if (err) {
          console.log(err, err.stack);
        } else {
          setUserEmail(data.Users[0].Username);
        }
      });
    } catch (e) {
      console.log(e);
    }
  };

 

// .env

REACT_APP_AWS_ACCESS_KEY_ID = 'ACCESS_KEY_ID'
REACT_APP_AWS_SECRET_ACCESS_KEY = 'SECRET_ACCESS_KEY'
REACT_APP_AWS_REGION = 'REGION'
REACT_APP_AWS_USER_POOL_ID = 'USER_POOL_ID'

 

dotenv 라이브러리 사용 방법 

1. npm install dotenv 로 설치 / 이후에 .env 파일을 생성하고, 프로젝트에서 dotenv 라이브러리를 사용하여 .env 파일에 작성된 환경 변수를 로드할 수 있습니다.

2. - React 프로젝트의 루트 디렉토리에 .env 파일을 생성합니다. 

    - .env 파일에 변수를 설정합니다. 변수는 REACT_APP_로 시작해야 합니다. 예를 들어, REACT_APP_API_KEY=your_api_key와 같이 설정할 수 있습니다.

REACT_APP_API_KEY=your_api_key

 

3. - 파일에서 아래와 같이 dotenv 모듈을 import하여 .env 파일의 변수들을 로드할 수 있습니다.

import React from "react";
import ReactDOM from "react-dom";
import App from "./App";
import dotenv from "dotenv";

dotenv.config(); // .env 파일의 변수들을 로드합니다.

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById("root")
);

4. - 변수를 사용할 컴포넌트에서 process.env.REACT_APP_API_KEY와 같이 process.env 객체를 사용하여 변수를 호출합니다.

5. .env 파일은 .gitignore에 추가해야 합니다. 이는 보안상의 이유로 중요합니다.