TIL 3일차 - Node.js와 MySQL연동해보기(1)

node.js에 MySQL을 연동하기 위해선 아래와 같은 모듈들을 다운받아야합니다.

 

• npm install mysql

  - MySQL데이터 베이스에 연결하고 상호 작용하는 데 사용되는 Node.js드라이버입니다.

  - MySQL과의 통신을 처리하고 데이터베이스 쿼리를 수행하는데 필요합니다.

 

• npm install express

  - express는 Node.js 웹 애플리케이션을 빠르고 간단하게 작성할 수 있도록 도아주는 웹 프레임 워크입니다.

  - 웹 서버를 만들고 라우팅 및 미들웨어를 통해 HTTP요청과 응답을 처리하는 데 사용됩니다. 

 

• npm install ejs

  -Node.js 프로젝트에 ejs(Embedded JavaScript)를 설치하는 명령어입니다.

  - EJS는 JavaScript 코드를 HTML파일에 내장하여 동적인 웹 페이지를 생성하는 데 사용되는 템플릿 엔진입니다.

 

• npm install body-parser

  - Express 애플리케이션에서 HTTP요청의 본문을 파싱하는 데 사용되는 미들웨어 입니다.

  - 클라이언트에서 전송된 POST 요청의 데이터를 서버에서 사용할 수 있도록 변환해주는 역할을 합니다.

 

SQL

그리고 MySQL을 연동하기 위해 MySQL을 설치해 주었습니다.

mysql 다운로드는 여기 를 참고했습니다.

 

기억해야 할것은 데이터베이스를 생성할 때

host, port번호, password, database이름, username을 적어야 하는데 그때의 정보들을 따로 저장해두거나 기억하고 있어야합니다.

 

why?

node.js와 연결하기 위해서는 해당 데이터베이스의 정보를 알아야 연결 할수 있기 때문입니다.

 

그런뒤 해당 데이터베이스에 memberinfo라는 이름으로 만들었고 해당 데이터 베이스에 테이블을 만들어 줬습니다.

CREATE TABLE memberinfo (
    id varchar(50) NOT NULL,
    name varchar(50) NOT NULL,
    email varchar(50) NOT NULL,
    password varchar(50) NOT NULL,
    PRIMARY KEY (id)
);

 

테이블을 만들고 연결하기 위한 정보도 저장해 뒀으니 이제 데이터베이스에서 준비할것은 끝났습니다.

 

 

 

Node.js

시작하기 전에 require함수를 통해  install한 모듈들을 로드하여 모듈화 시킵니다.

포트 번호는 url에서 요청을 할 때의  서버 접속 번호입니다.

const express = require('express') //모듈 로드시키기
const ejs = require('ejs');
const app = express();
const port = 3000 //서버 접속 번호
var bodyParser = require('body-parser')

 

그 뒤 동작방식을 조절하는 기능을 설정합니다.

app.set('view engine', 'ejs');
app.set('views', './views')
app.use(bodyParser.urlencoded({ extended: false }))

• app.set('view engine', 'ejs');

  - 이렇게 설정을 하게 되면 res.render메서드를 사용하여 ejs템플릿을 렌더링 할 때 파일 확장자를 명시하지 않아도 됩니다.

• app.set('views', './views')

  - ejs템플릿 파일이 위치한 디렉토리를 지정하는 부분입니다. 해당 경로가 기본 경로이기 때문에 해당 경로에 파일들이 위치해 있어야합니다.
• app.use(bodyParser.urlencoded({ extended: false }))

  - express 애플리케이션에 미들웨어를 추가하여 http요청의 본문을 해석(parse)하는 역할을 합니다.

  - extended: false 옵션으로 설정된 이유는 단순한 폼데이터 처리를 합니다. true로 설정된다면 복잡한 객체를 파싱할 수 있게           됩니다.

  - req.body객체를 통해 폼 데이터에 접근을 할수가 있습니다.

 

 

Express 애플리케이션에서 각각의 경로에 대해 특정 EJS 템플릿을 렌더링하는 라우팅을 설정합니다.

각각의 루트(/)경로, /login경로, /signin경로에 대한 라우터로 설정하나 페이지로 렌더링합니다.

app.get('/', (req, res) => {
    res.render('index') // 경로 : ./views/index.ejs
})

//로그인페이지 이동(렌더링)
app.get('/login', (req, res) => {
    res.render('login') // 경로 : ./views/login.ejs
})

//회원가입페이지 이동(렌더링)
app.get('/signin', (req, res) => {
    res.render('sign_in') // 경로 : ./views/sign_in.ejs
})

 

 

데이터 베이스 연동 및 라우팅 설정

위에서 저장해 뒀던 sql 데이터베이스의 정보를 적어서 연결해 줍니다.

require로 mysql을 모듈화 시켜주고 모듈화 시킨 mysql을 createPool메서드를 사용하여 연결하기 위한 정보를 pool에 저장합니다.

var mysql = require('mysql');
var pool = mysql.createPool({
    connectionLimit: 10,
    host: 'localhost',
    user: 'coriny',
    password: '1234',
    database: 'memberinfo'
});

 

 

데이터 베이스가 연결되었는지 확인하기

//데이터베이스 정보 보기
app.get('/db', (req, res) => {
    pool.getConnection(function (err, connection) {
        if (err) throw err; // not connected!
        
        connection.query('SELECT * FROM memberinfo', function (error, results, fields) {
            res.send(JSON.stringify(results));
            connection.release();
            if (error) throw error;
        });
    });
})

req(request) - 클라이언트의 요청이 들어가는 매개변수입니다.
res(response) - 응답을 위한 매개변수입니다.

database의 정보가 들어간 pool에 getconnection메소드를 써서 데이터 베이스에 연결합니다. 

getconnection메소드는 mysql에서 제공하는 데이터베이스 연결 메소드 입니다.

그 다음 쿼리문을 작성하기 위한 .query를 사용하고 쿼리 문을 작성한뒤 results라는 변수에 담아 화면에 띄워 줍니다.

그 이후 release() 메서드를 호출하여 연결을 반환합니다.이렇게 하면 연결을 풀에 유지하면서 효율적으로 사용을 할수가 있습니다.

 

 

데이터 추가하기

// 데이터 추가하기(회원가입)
app.post('/addmember', (req, res) => {
    const id = req.body.id;
    const name = req.body.name;
    const email = req.body.email;
    const password = req.body.password;

    const memberinfo_insert = {
        id: `${id}`,
        name: `${name}`,
        email: `${email}`,
        password: `${password}`
    }

    console.log(memberinfo_insert);

    pool.getConnection((err, connection) => {
        if (err) throw err;

        connection.query('INSERT INTO memberinfo SET ?', memberinfo_insert, (error, results, fields) => {
            connection.release();

            if (error) {
                console.error(error);
                res.status(500).json({ error: '데이터 삽입 실패' });
                return;
            }
            // 데이터 삽입 성공 시 클라이언트 측에서 리디렉션을 수행
            res.json({ success: true, insertedId: results.insertId });
        });
    });
});

데이터 베이스의 연결과 비교해봤을 때 다른부분은 post로 받는다는 점과 post로 요청한 정보들을 받아 오는 과정입니다.

body-parser를 모듈화한 이유는 여기서 post로 보내진 값들을 받아오기 위한 것이였습니다.

/addmember로 라우팅된 정보들을 req.body로 받아와서 변수에 넣어주었으며 키-값의 형태로 쿼리문을 진행하였습니다.

여기서 알아야 할것은 id : start , name : coriny라고 가정했을 때 쿼리문에 들어갈 때는 id=start, name=coriny로 들어간다는 것입니다.

따로 변환 할 필요없이 들어가기 때문에 키와 값을 매치만 잘 시킨다면 문제없이 데이터가 들어가는걸 확인할수 있었습니다.

 

그리고 만약에 데이터 삽입이 실패 했다면 클라이언트에게 500이라는 http상태코드와 json형태의 오류 메시지를 응답합니다.

에러가 없다면 데이터 삽입이 성공했음을 알리는 json응답을 보냅니다. http상태 코드는200이며 삽입된 데이터의 id도 함께 응답합니다.

 

 

들어간 데이터 확인

// 들어간 데이터 확인( 로그인)
app.post('/login', (req, res) => {
    const id = req.body.id;
    const password = req.body.password;

    pool.getConnection(function (err, connection) {
        if (err) throw err; // not connected!

        const sql = 'SELECT * FROM memberinfo WHERE id = ? AND password = ?';
        connection.query(sql, [id, password], function (error, results, fields) {
            if (error) {
                console.error('Error executing query:', error);
                res.status(500).json({ error: 'Internal Server Error' });
                return;
            }

            // 결과 처리
            res.send(JSON.stringify(results));
            console.log('results', results);

            connection.release();
        });
    });
});

마찬가지로 post형태로 라우팅을 합니다.

데이터 베이스가 연결되었는지 확인하기와 다른점은 모든 데이터를 가져 오는것이 아닌 해당하는 정보를 가지고 판별해서 원하는 정보를 가져오는 것입니다.

요청 받은 데이터를 가져온뒤 넣어야할 데이터가 2가지라면 쿼리문에 값이 들어갈 자리에 ?를 넣어주면 됩니다.

그렇게 연결을 해주면 정보를 가져올수가 있습니다. 

 

이렇게 node.js에서 mysql을 연동을 해봤는데 아직까지는 어떤식으로 돌아가는지 그리고 값을 가져오는것까진 했지만 json형태로밖에 가져오지 못해 활용하는 방식이 어렵습니다. 

다음엔 가져온 방식으로 활용 하는 방법까지 해보겠습니다.

 

 

 

 

 

배워나가는 코린이 입니다!!

부족한게 있다면 댓글로 지적해주세요!! 감사합니다!😊