Environment Variables

사용해야 하는것 중에 dotenv 라는게 있다.

https://www.npmjs.com/package/dotenv

dotenv는 매우 유명하다.

이 Package가 무슨 일을 하냐면 env파일을 읽고 각각의 변수들을 process.env안에 넣는거다.

그러면 process.env를 console.log해본다.

server.js에서

console.log(process.env);
import express from "express";

맨 위에다가 작성 했다. 에러가 날지도 모르겠다. 한번 확인해 본다.

콘솔을 확인해 보니 뭔가 이해할수 없는 많은 변수들이 있다.

이게 process.env이다. nodeJS process의 환경이다.

이제 COOKIE_SECRET을 console.log해 본다.

console.log(process.env.COOKIE_SECRET, process.env.DB_URL);
import express from "express";

그리고 DB_URL을 console.log해 본다. 현재로써는 둘다 undefined이다.

이제 dotenv를 설치해 본다. vsc콘솔에서 npm i dotenv입력해준다.

dotenv는 여러 언어로 구현되어 있다. dotenv는 파이썬,자바스크립트 외에

다른 언어로도 구현되어 있다. dotenv가 설치 되었다.어떻게 사용하면 될까??

require('dotenv').config()
console.log(process.env) // remove this after you've confirmed it working

이렇게만 하면 된다. 그리고 여기 나와 있다시피

As early as possible in your application, import and configure dotenv:

"당신의 앱 안에서 최대한 먼저 " 이게 무슨 말이냐면 예를 들어 이 부분에서

dotenv를 require하고

console.log(process.env.COOKIE_SECRET, process.env.DB_URL);
require("dotenv").config();
console.log(process.env.COOKIE_SECRET, process.env.DB_URL);

SECRET을 console.log하면 어떻게 되는지 보도록 한다.

확인해 보면

undefined undefined

보다시피 undefined 와 undefined가 나왔다.

그러고 require("dotenv")한 다음에 나오는 console.log를 본다.

asdlfjaslkdfj12345136356aljga mongodb://127.0.0.1:27017/wetube

여기 나온게 보인다. dotenv는 파일을 읽고 env에 추가를 해줄거다.

그리고 아까도 말했듯이 가능한한 가장 먼저 사용해야 한다.

예를 들어 여기에undefined 와 undefined가 나왔다.

첫번째 console.log이다. 그리고 require("dotenv")를 하면

COOKIE_SECRET와 DB_URL 값이 나온다. 그런데 에러가 있다.

에러가 말하길 db.js에 DB_URL이 없다고 한다. 그러면 여기에서 전부 console.log를 해본다.

그리고 작동하는걸 확인해 본다. 아직도 작동하지 않는다.

지금 require("dotenv")를 server.js 안에서 하고 있다.

그리고 COOKIE_SECRET와 DB_URL는 db.js에서 console.lgo하고 있다.

하지만 db.js에서 COOKIE_SECRET와 DB_URL이 undefined로 나오고 있다.

그 이유는 require("dotenv")를 가장 먼저 실행하지 않아서 그런거다.

어플리케이션이 어떻게 시작하는지 보면 package.json에서 확인하면 init.js로 시작한다.

  "scripts": {
    "dev": "nodemon --exec babel-node src/init.js"
  },

그리고 init.js를 보면

import "./db";
import "./models/Video";
import "./models/User";
import app from "./server";

const PORT = 4000;

const handleListening = () =>
  console.log(`✅ Server listening on port http://localhost:${PORT} 🚀`);

app.listen(PORT, handleListening);

현 시점에서는 COOKIE_SECRET와 DB_URL이 없다.

왜냐하면 require("dotenv")를 아직 안했기 때문이다.

그래서 이 require("dotenv")를 옮겨 보도록 한다.

server.js에 있는 require("dotenv")를 init.js에 옮겨준다.

require("dotenv").config();
import "./db";
import "./models/Video";
import "./models/User";
import app from "./server";

const PORT = 4000;

const handleListening = () =>
  console.log(`✅ Server listening on port http://localhost:${PORT} 🚀`);

app.listen(PORT, handleListening);

그러면 모든 문제를 해결할거다. 왜냐하면 require("dotenv") 한다는 것은

COOKIE_SECRET와 DB_URL를 접근 할수 있다는 거다.

db.js에서

console.log(process.env.COOKIE_SECRET, process.env.DB_URL);

그래서 이 부분에선 DB_URL가 정의 되는거다.

init.js에서

import app from "./server";

이리로 내려가다보면 server.js가 있고

server.js에서

app.use(
  session({
    secret: process.env.COOKIE_SECRET,
    resave: false,
    saveUninitialized: false,
    store: MongoStore.create({ mongoUrl: process.env.DB_URL }),
  })
);

그러면 COOKIE_SECRET도 정의가 되었고 이제 에러가 없을거다. 그러면 확인해 본다.

에러가 맞이한다. 아직도 작동하지 않고 있다. 문제가 무엇일까??

두가지 방법으로 import하는게 문제일거다.

하나는 require이고 다른 하나는 import이다.

이 방식을 사용하고 싶다면 dotenv를 사용하고 싶은 모든 파일에 require을 추가해 줘야한다.

init.js에서 사용하지 않을거면 지워준다. 하지만 필요한 모든 파일 윗 부분에는

require를 넣어줘야 한다. 이제 실행을 하면 작동을 잘 한다.

하지만 이건 번거롭다. 이제 process.env를 사용하는 모든 파일 위에 사용해야 한다는게 귀찮다.

그래서 이 대신에 require로 import 하는 부분을 import방식으로 수정한다.

init.js에서

import "dotenv/config";

이렇게 한줄만 추가해주면 된다. 서버를 확인해 보면 잘 작동한다.

이제 db.js에서 process.env를 console.log할수 있다.

import mongoose from "mongoose";

console.log(process.env.DB_URL);

mongoose.connect(process.env.DB_URL, {
  useNewUrlParser: true,
  useUnifiedTopology: true,
});

그리고 server.js에서도 똑같이 할수 있다.

console.log(process.env.COOKIE_SECRET);

app.use(
  session({
    secret: process.env.COOKIE_SECRET,
    resave: false,
    saveUninitialized: false,
    store: MongoStore.create({ mongoUrl: process.env.DB_URL }),
  })
);

여기서 COOKIE_SECRET를 console.log할수 있다. 모든게 정의 되어 있을거다.

mongodb://127.0.0.1:27017/wetube
asdlfjaslkdfj12345136356aljga
✅ Server listening on port http://localhost:4000 🚀
✅Connected to DB

COOKIE_SECRET와 DB_URL 잘 나오고 있다.

하지만 이 값들은 Version Control(git)에는 전송되지 않을거다.

코드에도 없을거고 파일 안에만 있을거다. 이 파일을 비밀로 유지 할수 있는거다.

다음 파트에서는 깃헙 로그인을 만들거다. 깃헙 로그인은 token하고 secret등을 필요로 한다.

그래서 이번에 설정한게 매우 좋은거다. 깃헙의 token과 secret등을 dotenv에 넣을거다.

파일의 값들을 접근하는 방법을 배웠으니까 말이다. process.env.{키값}만 기억하면 된다.

물론 키값은 같아야한다.

.env를 src폴더에서 빼는거 잊지 말고 .env파일을 package.json 옆에 두어야 한다.