IT_Study/Web

Back-End (5) : URL routing, Express & MySQL 연동, EC2 내 MySQL과 Node 연결하기

__Vivacé__ 2023. 3. 2. 23:56

URL routing

사용자가 접근한 경로에 따라서 그에 맞는 메소드를 호출해주는 기능

Target directory 내부에 info.js와 각각의 html file을 준비

--------------------------------------------------------

Method 설명

1. sendFile
res 에서, 파일 전송 시 사용하는 메서드. 여기선 html 을 보낼 용도
상대 경로가 아닌 절대 경로로만 동작한다.

2. __dirname
현재 기기에서 작동중인 서버의 경로를 의미하는 상수

왜? 각각의 기기마다 서버의 경로가 전부 다르다.(또한 sendFile은 절대 경로로만 동작)
따라서 현재 서버의 경로 + 파일의 위치 조합으로 절대경로를 만들어 조합.

__dirname 과, 각각의 html 파일 경로를 합쳐 사용
// info.js 내용

const express = require('express');
const app = express();
const PORT = 8080;

// index.html 보여주기
app.get("/", (req, res) =>{
    // __dirname : 현재 기기에서 작동 중인 서버의 경로
    return res.sendFile(__dirname + "/views/index.html")

})

// login.html 보여주기
// URL routing : [localhost:ㅁㅁㅁㅁ]/login 페이지에 들어가면, 다음 html을 반환
app.get("/login", (req, res) =>{
        return res.sendFile(__dirname + "/views/login.html")
})

// whoami.html 보여주기
app.get("/whoami", (req, res) =>{
    return res.sendFile(__dirname + "/views/whoami.html")
})

app.listen(PORT, ()=> console.log(`${PORT} 서버 기동 중`));

 

 


Express와 MySQL 연동하기

 

1. EC2에 MySQL 설치

# apt(ubuntu에서 사용하는 package 관리 모듈) upgrade
$ sudo apt update
# MySQL 설치
$ sudo apt install mysql-server
# MySQL 버전 확인
$ mysql --version

 

2. MySQL 로그인

$ sudo mysql

# 아이디 [id], 비밀번호 [password]로 계정 생성
$ create user 'id'@'%' IDENTIFIED BY 'password';

# 'id' 에 권한 부여. '%'은 모든 외부 IP를 의미
# 앞 * : DB 이름, 뒤 * : 권한 내용
$ grant all privileges on *.* to 'id'@'%' with grant option;

# mysql 나가기
$ exit

# 방금 만든 admin account로 로그인하기
$ sudo mysql -u [id] -p [password]

 

3. Database 생성하기

# database 생성
$ create database practice default CHARACTER SET UTF8;

# database 생성되었는 지 확인
$ show databases; / show schemas;

# database 접속
$ use practice;
# table 생성

CREATE TABLE menus (
    menu_id INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
    menu_name VARCHAR(20) NOT NULL,
    menu_description TEXT NOT NULL
    );

# table에 데이터 기입
INSERT INTO menus
    (menu_name, menu_description)
     VALUES
    ("아이스 아메리카노", "뭐라카노");

INSERT INTO menus
    (menu_name, menu_description)
     VALUES
    ("복숭아 아이스티", "내 입안 복숭아향 가득");

INSERT INTO menus
    (menu_name, menu_description)
     VALUES
    ("카페라떼", "Latte is horse");

# table 내용 확인
select * from menus;

# sql 나가기
exit

 

 

4. Listen IP 대역폭 변경

# 현재 mysql은 localhost에서만 접속 가능하므로,
# 모든 IP에서 원격접속할 수 있도록 수정할 예정

$ sudo nano /etc/mysql/mysql.conf.d/mysqld.cnf
# 127.0.0.1 ← aws의 localhost / 같은 IP인 경우에만 접근이 가능한 상황
# bind-address : local-host 수정

bind-address : 0.0.0.0

// 이후 sql 재시작
$ sudo service mysql restart

DB 외부 접속 세팅이 끝났기 때문에, SQL Workbench에서도 접속 가능

 

  • Connection Name : 내가 원하는 이름으로 설정
  • Hostname : AWS EC2의 public IPv4 주소를 기입
  • Username : 아까 mobaXterm에서 등록한 hostname으로 수정
  • Password : “Store in Vault …” 를 클릭해서, 아까 mobaXterm에서 등록한 password를 기입

 


 

Node 연결

# 3개의 라이브러리 download
# mysql2 설치 - 다른 버전은 async await 지원 x

$ cd [target directory]

$ npm i express cors mysql2 # 3개 라이브러리 다운로드

# target directory 내에 db folder 생성
$ mkdir db
// db folder 내에 index.js 파일 내용

const mysql = require("mysql2/promise");

const pool = mysql.createPool({
    //AWS EC2 IP
    host: "12.34.56.78",
    //Mysql 유저 이름
    user: "id",
    // 비밀번호
    password: "password",
    // DB 및 schema 이름
    database: "db_name",
    
    // Basic options
    waitForConnections: 10,
    connectionList: 10,
    queueLimit: 10
})

module.exports = pool;
// target directory 내에 index.js 파일 내용

const express = require('express');
const app = express();
const PORT = 8080;

// index.js는 기본이기 때문에, 생략이 가능
const pool = require('./db');

// client가 api/menus 에 오면
// DB에 있는 menus를 조회해서 가져오기
app.get("/api/menus", async(req, res) => {
    const data = await pool.query("SELECT * FROM menus");

    return res.json(data[0]);
})

app.listen(PORT, () => console.log(`${PORT} 서버 기동 중`));

이 과정 후, localhost:8080/api/menus 에 접속하면, MySQL 테이블에 저장된 data를 웹 페이지 상에서 json 형식으로 볼 수 있다.