자바스크립트로 텍스트 암호화 복호화 하는 방법 (JavaScript string encryption and decryption)

남양주개발자

·

2020. 9. 14. 09:00

728x90
반응형

자바스크립트로 개발을 하다보면 텍스트를 암호화해야되는 순간이 찾아올 경우가 생깁니다. 이번 포스팅에서는 자바스크립트로 텍스트를 암호화, 복호화하는 방법에 대해서 소개해드리도록 하겠습니다.

라이브러리 설치

암호화, 복호화 라이브러리 crypto-js를 설치합니다. 제가 개인적으로 텍스트를 암호화할 때 편하게 사용한 경험이 있어서 저는 crypto-js를 사용합니다.

npm install crypto-js
// or
yarn add crypto-js

암호화 복호화 헬퍼함수는 아래와 같습니다. encrypt, decrypt 헬퍼함수의 key는 process.env.PRIVATE_KEY처럼 환경변수로 처리하면 됩니다.

import CryptoJS from "crypto-js";

export const encrypt = (data, key) => {
  return CryptoJS.AES.encrypt(JSON.stringify(data), key).toString();
};

export const decrypt = (text, key) => {
  try {
    const bytes = CryptoJS.AES.decrypt(text, key);
    return JSON.parse(bytes.toString(CryptoJS.enc.Utf8));
  } catch (err) {
    console.error(err);
    return;
  }
};

encrypt 헬퍼함수를 활용해서 샘플 데이터를 암호화해보겠습니다. 샘플 데이터는 보안에 민감한 유저 데이터라고 가정하고 보시면 될 것 같습니다. encrypt 헬퍼함수의 return 값으로 암호화된 문자열을 반환합니다. 이 문자열은 우리가 암호화할 때 사용했던 private key로만 해독할 수 있습니다.

import { encrypt, decrypt } from "./helpers/crypto";

const data = {
  name: "박경두",
  age: 30,
  phone: "01012345678",
  id: "ruden91",
  company: "Google",
};

const text = encrypt(data, "secret-key-1");
// U2FsdGVkX1/btZ59SlJiGwrxyteNX/dNFJn4XTvcMCIKFo6fDsdSLtPdNqzVA6jzGTw57u0Ozd0gL/RRZuJngl81jnSp8YCkxGLiNjB1woKZ+CWz4p8qcvEREPOmL2E/p60YpmRYhrf9q3xgWvuWGg==

우리가 암호화한 샘플데이터를 복호화해보겠습니다. 우리가 사용했던 private key를 활용해서 decrypt 헬퍼함수를 실행하면 면 리턴값으로 우리가 처음 가지고 있던 샘플데이터를 반환해주는 것을 확인할 수 있습니다.

const text = encrypt(data, "secret-key-1"); // 암호화 
const decryptedData = decrypt(text, "secret-key-1"); // 복호화

복호화의 결과로 샘플데이터 양식 그대로 반환한 모습

만약 private key를 다르게 넣고 복호화한다면 어떻게 될까요?

    const text = encrypt(data, "secret-key-1");
    const decryptedData = decrypt(text, "hello"); // key를 다르게
    console.log(decryptedData);

당연히 복호화에 실패하는 모습

당연히 암호화한 키와 다르기 때문에 복호화에 실패하게 됩니다.

728x90
반응형
그리드형

💖 저자에게 암호화폐로 후원하기 💖

아이콘을 클릭하면 지갑 주소가자동으로 복사됩니다