[Dev Log] 20210918 / 유다희

## NEW THING!

1. **로그인 및 회원가입시 비밀번호 암호화는 client - cypto.js / backend-byrypt사용할 수 있다**

[간단한 flow]

client에서 비밀번호를 cypto.js로 인크립트 >

server에서 비밀번호 cypto.js 로 디크립트 >

sever에서 bycrypt로 다시 암호화 > 디비 저장 .

[설치 및 사용]

- 설치

```jsx
npm install crypto-js
```

- 적용

```jsx
//client적용시키기

const CryptoJS = require("crypto-js");

const secretKey = "Klassiker"; // 시크릿키 지정하기 : 서버와 공유

const encryptedPassword = CryptoJS.AES.encrypt(
JSON.stringify(password),
secretKey
).toString();

//server 적용시키기
const cryptoJS = require("crypto-js");
const bcrypt = require("bcrypt");
const saltRounds = 10;

// password 암호화 작업
// cryptojs 복호화
let byte = cryptoJS.AES.decrypt(password, process.env.CRYPTOJS_SECRETKEY);
console.log("byte:", byte);
password = JSON.parse(byte.toString(cryptoJS.enc.Utf8)).password;
console.log("password:", password);

// bcrypt 재암호화
const salt = bcrypt.genSalt(saltRounds);
password = bcrypt.hash(password, salt);
```

2. **로컬환경 https 만들기 client**

구글링하면 별의 별 방벙이 다 제시되어있는데 server설정하듯 ssl사용하면 아주 간단!

배포와 같은 환경으로 테스트하기 위해서 mkcert를 통해 ssl인증서 사용

- 우분투의 경우, 설치

```jsx
#우분투
$ sudo apt install libnss3-tools
$ wget -O mkcert https://github.com/FiloSottile/mkcert/releases/download/v1.4.3/mkcert-v1.4.3-linux-amd64
$ chmod +x mkcert
$ sudo cp mkcert /usr/local/bin/

#맥
$ brew install mkcert

# firefox를 사용할 경우 필요에 따라 설치해주세요.
$ brew install nss
```

- 인증서 생성(아래 명령어를 통해 .pem파일 두개를 client부분에 생성됨)

```jsx
$ mkcert -install
# localhost에 대한 인증서 (다른 사이트를 넣고 싶으면 해당부분을 수정해주면 된다)
$ mkcert -key-file key.pem -cert-file cert.pem localhost 127.0.0.1 ::1
```

- package.json 스크립트 부분에 명령어 넣어줘서 npm으로 바로바로 실행할 수 있게 하기

"scripts": {
"https": "HTTPS=true SSL_CRT_FILE=cert.pem SSL_KEY_FILE=key.pem react-scripts start",
},

```jsx
"https": "HTTPS=true SSL_CRT_FILE=cert.pem SSL_KEY_FILE=key.pem react-scripts start",
```