node 정리{sql, ejs, session}

BABY CAT·2022년 10월 22일
node.js
0

node.js

목록 보기
9/18

터미널

npm i node?
npm i express
npm i ejs
npm install express-mysql-session --save
npm install express-session --save

(npx) pm2 start app.js --watch
서버실행: --watch는 무한실행

pm2 kill
전체 서버파일 중지

pm2 list
실행되고 있는 서버파일 확인

pm2 monit
실행되고있는 서버파일 모니터링

pm2 log
로그만 위로 쭉 볼 수 있게 (monit는 짧게 보이니까)

0. app.js 기본 코드

ejs, session 포함
//[기본]app변수로 express구동 [기본]
const express = require('express');
const app = express();
//[기본]라우터경로
const router=require('./router/router.js');
//[기본]바디파서
const bodyparser = require('body-parser');
// (ejs) ejs
let ejs = require('ejs'); // 이 코드에서는 이 ejs변수는 쓰지 않는다 아래 "ejs"는 문자가 아니라 set의 기능이다
// (ejs) ejs 파일을 view폴더에  // app.use는우리가만들어서스는 것 set은 이미 잇는 속성/기능
app.set('view engine', "ejs"); 
// {session}
let conn = {  
    host: '127.0.0.1',
    user: 'cshuser',
    password: 'cshpass',
    port: '3306',
    database: 'nodejs_db'}
const mysql_session = require('express-mysql-session')
let conn_session = new mysql_session(conn);
const session = require('express-session')
app.use(session({ //미들웨어로 세션기능 (저장위치:mysql)등록?
    secret : 'smart', 
    resave : false,  // 매번서버에저장을할건지
    saveUninitialized : true, //서버를시작할때세션을초기화를할건지
    store : conn_session}))
//[기본]바디파서를 포스트로 쓰겠다
app.use(bodyparser.urlencoded({extended:false})) // app use router 위에와야함
//[기본]라우터구동
app.use(router);  //미들웨어로 라우터를 등록해주기
//[기본]포트설정 127.0.0.1.3001
app.listen(3001);  // 현재 서버파일의 port번호설정

//?
//app.use(express.static('./public'))

ㄱ. config폴더

A. DBConfig.js

const mysql = require('mysql');
//특정데이터베이스지정 // sql아이디비번
let conn = mysql.createConnection({
    host: '127.0.0.1',
    user: 'cshuser',
    password: 'cshpass',
    port: '3306',
    database: 'nodejs_db'
})
module.exports=conn

ㄱ. router폴더

A. router.js

const express = require('express');
const router = express.Router();

const conn = require('../config/DBConfig.js')

// 0 메인페이지   http://127.0.0.1:3001/Main
router.get('/main', (request, response) => {
    response.redirect('http://127.0.0.1:5500/public/00.Main.html')
});

//1 넘버 2개 더하기
router.get('/plus', function (request, response) {       //  /plus라우터 기능정의및등록
    /* /plus객체가가진 req res
    c 가보낸정보 req에잇다
    res > html 을 c 에게 응답 */
    console.log(request.query.num1);
    console.log(request.query.num2);

    //200은정상응답이란뜻                    html로응답
    response.writeHead(200, { 'Content-Type': 'text/html;charset=utf-8' });
    response.write('<html>')
    response.write('<body>')
    response.write('<h1>응답성공</h1>')
    response.write('결과값' + (parseInt(request.query.num1) + parseInt(request.query.num2)))
    response.write('</body>')
    response.write('</html>')
    response.end();
});

// 2 넘버2개 사칙연산
router.get('/cal', function (request, response) {       //  /plus라우터 기능정의및등록
    let num1 = request.query.num1;
    let cal = request.query.cal;
    let num2 = request.query.num2;
    console.log(num1, cal, num2);
    /* /plus객체가가진 req res
    c 가보낸정보 req에잇다
    res > html 을 c 에게 응답 */
    //200은정상응답이란뜻                    html로응답
    response.writeHead(200, { 'Content-Type': 'text/html;charset=utf-8' });
    response.write('<html>')
    response.write('<body>')
    response.write('<h1>응답성공</h1>')
    /*   긴 if else if 코드 
    if (cal == '+') {
            response.write('결과값' + (parseInt(num1) + parseInt(num2)))
        } else if (cal == '-') {
            response.write('결과값' + (parseInt(num1) - parseInt(num2)))
        } else if (cal == '*') {
            response.write('결과값' + (parseInt(num1) * parseInt(num2)))
        } else if (cal == '/') {
            response.write('결과값' + (parseInt(num1) / parseInt(num2)))
        } */
    //eval 함수로 cal을 연산 기호로 바꿔서 코드를 줄임
    response.write('결과값' + eval(parseInt(num1) + cal + parseInt(num2)))
    response.write('</body>')
    response.write('</html>')
    response.end();
});

// 3 시험성적 입력 받고 그레이드와 평균 출력
router.post('/grade', function (request, response) {

    response.writeHead(200, { 'Content-Type': 'text/html;charset=utf-8' });
    response.write('<html>')
    response.write('<body>')
    response.write('<h1>응답성공</h1>')
    let name = request.body.name
    let java = request.body.java
    let web = request.body.web
    let iot = request.body.iot
    let android = request.body.android
    let avg = (parseInt(java) + parseInt(web) + parseInt(iot) + parseInt(android)) / 4
    //리스폰스라이트안에서는 하나의 값만 써야하기 때문에 , 대신 +를 써야 한다.
    response.write(name + '님의' + ' avg는 ' + avg + '이고 ')
    if (avg <= 75 && avg >= 0) {
        response.write('grade는 F')
    } else if (avg <= 79) {
        response.write('grade는 c')
    } else if (avg <= 84) {
        response.write('grade는 b')
    } else if (avg <= 89) {
        response.write('grade는 b+')
    } else if (avg <= 94) {
        response.write('grade는 a')
    } else if (avg <= 100) {
        response.write('grade는 a+')
    }
    response.write('입니다')
    response.write('</body>')
    response.write('</html>')
    response.end();
});

//4 회원가입페이지 정보 받고 데이터만 출력
router.post('/join', (request, response) => {

    response.writeHead(200, { 'Content-Type': 'text/html;charset=utf-8' });
    response.write('<html>')
    response.write('<body>')
    response.write('<h1>응답성공1</h1>')
    response.write('id: ' + request.body.id + '<br>')
    response.write('name: ' + request.body.name + '<br>')
    response.write('email: ' + request.body.email + '<br>')
    response.write('tel: ' + request.body.tel + '<br>')
    response.write('gender: ' + request.body.gender + '<br>')
    response.write('country: ' + request.body.country + '<br>')
    response.write('birth: ' + request.body.birth + '<br>')
    response.write('color: ' + request.body.color + '<br>')
    response.write('hobby: ' + request.body.hobby + '<br>')
    response.write('talk: ' + request.body.talk + '<br>')
    response.write('<h1>응답성공4</h1>')
    response.write('</body>')
    response.write('</html>')
    response.end();
});

// 5 특정아이디비번 로긴 성공 실패
router.post('/login', (request, response) => {

    let id = request.body.id
    let pw = request.body.pw

    if (id == 'a' && pw == 'a') {
        response.redirect('http://127.0.0.1:5500/public/05.2.LoginS.html')
        //html파일에서 우클릭 오픈위드라이브서버 로 페스확인
    } else {
        response.redirect('http://127.0.0.1:5500/public/05.3.LoginF.html')
    }
});

// 6 db 회원삭제   //아래부터는DB활용
router.get('/deleteDB', (request, response) => {

    let id = request.query.id
    let sql = "DELETE FROM member WHERE id=?";
    //      어떤sql? + 실패햇을떄와성공했을떄함수
    conn.query(sql, [id], (err, row) => {  //[id,pw,nick]는물음표순서대로그대로

        if (err) {
            console.log('에러,삭제실패' + err)
        }
        else if (row.affectedRows > 0) {//에러가없으면 //어펙티드로우스는 명령 성공 횟수
            console.log('명령에성공한수:' + row.affectedRows);
            console.log('삭제성공' + row)
            console.log(row)
            console.log(row.affectedRows)
            console.log(row.length)
            response.redirect('http://127.0.0.1:5500/public/06.2.DeleteS.html');
        } else if (row.affectedRows == 0) {
            console.log('삭제된값없음')
            response.redirect('http://127.0.0.1:5500/public/06.3.DeleteF.html');
        }
    })
});

//7 db 회원가입 (가입성공하면 메인페이지로 이동)
router.post('/joinDB', (request, response) => {

    let id = request.body.id
    let pw = request.body.pw
    let nick = request.body.nick;

    //let sql="insert into member values('1','1','1')";
    //유저가보낸걸넣기 []을추가
    let sql = "insert into member values(?,?,?)";
    //      어떤sql? + 실패햇을떄와성공했을떄함수
    conn.query(sql, [id, pw, nick], (err, row) => {  //[id,pw,nick]는물음표순서대로그대로
        if (!err) {//에러가없으면
            console.log('입력성공' + row)
            response.redirect('http://127.0.0.1:5500/public/07.2.JoinDBS.html');
        } else {
            console.log('입력실패' + err)
            response.redirect('http://127.0.0.1:5500/public/07.3.JoinDBF.html');
        }
    })


});

// 8. db 회원수정 
router.post('/updateDB', (request, response) => {

    let select = request.body.select
    let sql = `
    UPDATE member 
    SET ${select}=?
    WHERE id=?;
    `;
    let change = request.body.change
    let id = request.body.id

    conn.query(sql, [change, id], (err, row) => {  //[id,pw,nick]는물음표순서대로그대로
        if (!err) {//에러가없으면
            console.log('수정성공' + row)
            response.redirect('http://127.0.0.1:5500/public/08.2.UpdateDBS.html');
        } else {
            console.log('수정실패' + err)
            console.log(select, change, id)
            response.redirect('http://127.0.0.1:5500/public/08.3.UpdateDBF.html');
        }
    })
});

// 9. db ejs 특정 회원 1명 찾기 (09.2.SearchOneDBS는 ejs로)
router.get('/searchOneDB', (request, response) => {

    let id = request.query.id
    let sql = `
    select * 
    from member 
    WHERE id=?
    `;
    conn.query(sql, [id], (err, row) => {  //[id,pw,nick]는물음표순서대로그대로
        console.log(row)
        if (err) {
            console.log('검색실패에러' + err)
            response.redirect('http://127.0.0.1:5500/public/09.3.SearchOneDBF.html')
        }
        else if (row.length > 0) {//에러가없고 검색값이 있으면
            //selectOne.ejs 부르고 ejs가 출력 그리고 검색값을 row_name변수로 넘겨줌
            console.log('검색성공 검색값 있음')
            response.render('SearchOneDBS', {
                row_name: row
            })
        } else if (row.length == 0) {
            console.log('검색값없음')
            response.redirect('http://127.0.0.1:5500/public/09.4.SearchOneDBN.html')
        }
    })
});

// 10. db 로그인 db에아이디패스워드있는지확인
router.post('/loginDB', (request, response) => {

    let id = request.body.id
    let pw = request.body.pw

    console.log(id, pw)

    let sql = `
    select * 
    from member 
    WHERE id=? and pw=?
    `;

    conn.query(sql, [id, pw], (err, row) => {  //[id,pw,nick]는물음표순서대로그대로

        if (err) {
            console.log('검색실페에러' + err)
        } else if (row.length > 0) {
            console.log('로긴성공')
            response.redirect('http://127.0.0.1:5500/public/05.2.LoginS.html')
            /*  request.session.user = id; //로긴에성공한사람의아이디
            console.log('session영역에아이디저장성공' + request.session.user);
            response.render('LoginS', {
                row_name: row
             }) */
        } else if (row.length == 0) {
            console.log('로긴실패')
            response.redirect('http://127.0.0.1:5500/public/05.3.LoginF.html')
        }
    })
});

// 11. db 전체검색 검색되는지확인, html에서 포스트로 보낸다는 표현이 없으면 무조건 get으로 받는다 post는 post로 보낸다는 코드가 잇어야 사용 가능
router.get('/searchAllDB', (request, response) => {
    let sql = `
    select * from member
    `;
    console.log(sql)
    conn.query(sql, (err, row) => {  //[id,pw,nick]는물음표순서대로그대로
        //row에 셀렉트로 불러온 값
        //row[0]이면 첫행 한 줄      row[0].id면 아이디 하나
        if (err) {
            console.log('에러' + err)
        } else if (row.length >= 1) {
            console.log('검색성공 :' + row.length + ' 명')
            console.log(row)
            response.redirect('http://127.0.0.1:5500/public/11.2.searchAllDBS.html')
        } else {
            console.log('검색햇으나 회원이 0명 row.length는 : ' + row.length)
            response.redirect('http://127.0.0.1:5500/public/11.3.searchAllDBF.html')
        }
    })
});

// 12. db ejs 로그인
router.post('/loginDBejs', (request, response) => {

    let id = request.body.id
    let pw = request.body.pw
    //console.log(id,pw)
    request.session.user = id //로긴에성공한사람의아이디를 세션에 저장,conn.문안에적어도괜찮

    let sql = `
    select * 
    from member 
    WHERE id=? and pw=?
    `;

    conn.query(sql, [id, pw], (err, row) => {  //[id,pw,nick]는물음표순서대로그대로
        if (err) {
            console.log('검색실페에러' + err)
        } else if (row.length > 0) {
            console.log('로긴성공')
            //response.redirect('http://127.0.0.1:5500/public/05.2.LoginS.html')
            console.log('session영역에아이디저장성공 저장아이디는: ' + request.session.user);
            console.log(row)
            console.log('row[0].id: ' + row[0].id)
            response.render('loginDBejs', {
                row_name: row
            })
        } else if (row.length == 0) {
            console.log('로긴실패')
            response.redirect('http://127.0.0.1:5500/public/05.3.LoginF.html')
        }
    })
});

// 13. db ejs 전체검색 전체회원리스트까지 출력, html에서 포스트로 보낸다는 표현이 없으면 무조건 get으로 받는다 post는 post로 보낸다는 코드가 잇어야 사용 가능
router.get('/searchAllDBejs', (request, response) => {
    let sql = `
    select * from member
    `;
    conn.query(sql, (err, row) => {  //[id,pw,nick]는물음표순서대로그대로
        //row에 셀렉트로 불러온 값, row[0]이면 첫행 한 줄, row[0].id면 아이디 하나
        if (err) {
            console.log('에러' + err)
            response.redirect('http://127.0.0.1:5500/public/11.3.searchAllDBF.html')
        } else if (row.length >= 1) {
            console.log('검색성공 :' + row.length + ' 명')
            console.log(row)
            //selectOne.ejs 부르고 ejs가 출력
            response.render('searchAllDBejs', {
                row_names: row
            })
        } else {
            console.log('검색햇으나 회원이 0명 ' + row.length)
            response.redirect('http://127.0.0.1:5500/public/11.4.searchAllDBN.html')
        }
    })
});

// 13-2. db 13번 전체검색에서 테이블에서 바로 삭제를 하기 위한 라우터
router.get('/SelectDelete', (request, response) => {
    let id = request.query.id
    let sql = "DELETE FROM member WHERE id=?";
    //      어떤sql? + 실패햇을떄와성공했을떄함수
    conn.query(sql, [id], (err, row) => {  //[id,pw,nick]는물음표순서대로그대로
        if (err) {
            console.log('삭제실패' + err)
        }
        else if (row.affectedRows > 0) {//에러가없으면
            console.log('명령에성공한수:' + row.affectedRows);
            console.log('삭제성공' + row)
            response.redirect('http://127.0.0.1:3001/searchAllDBejs');
        } else if (row.affectedRows == 0) {
            console.log('삭제된값없음')
            response.redirect('http://127.0.0.1:3001/main');
        }
    })
});

//session
//// id: request.session.user 로 이 라우터로 들어올때 id값을 받는다 이 값으로 MainEJS.ejs에서 사용
// 14 db ejs session 메인EJS 페이지
router.get('/MainEJS', (request, response) => {
    response.render('MainEJS',{
        id: request.session.user
    })
});

//session
// 14-2  MainEJS페이지에서 로그아웃 버튼을 누르면 이 라우터로 오고
// delete 리퀘스트로세션으로 id 값을 지우고 다시 메인ejs페이지로 보냄
router.get('/Logout', (request, response) => {
    delete request.session.user;
    response.render('MainEJS', {
        id: request.session.user
    })
});

module.exports = router; //라우터를외부에서사용할수있게

//ejs에서
/* router.get('/Message', (request,response)=>{
    response.render('message',{});
}) */

1. html 에서 라우터로 보내기(get)

form 태그로  /plus 라우터로 겟 방식으로 보낸다 
(숫자1 숫자2 보냄)

html의 form태그: 보내는 방향과 방법을 지정  
<form action="http://127.0.01:3001/plus" method="get">
	<input type="text" name="num1">
	<input type="text" name="num2">
	<input type="submit" value="더하기" >
</form>
    겟은 url로 보내고 쿼리로 받고
    포스트는 패킷으로 보내고 바디로 받는다
/plus 라우터에서 마찬가지로 겟으로 받고 겟 > url > 쿼리로 
네임의 밸류 값으로 받는다

문자인 인풋 값을 팔스인트로 숫자로 바꾸고 플러스 값을
http://127.0.01:3001/plus 에서 그대로 출력한다 

router.get('/plus', function (request, response) {       //  /plus라우터 기능정의및등록
   /* /plus객체가가진 req res
   c 가보낸정보 req에잇다
   res > html 을 c 에게 응답 */
   console.log(request.query.num1);
   console.log(request.query.num2);

   //200은정상응답이란뜻                    html로응답
   response.writeHead(200, { 'Content-Type': 'text/html;charset=utf-8' });
   response.write('<html>')
   response.write('<body>')
   response.write('<h1>응답성공</h1>')
   response.write('결과값' + (parseInt(request.query.num1) + parseInt(request.query.num2)))
   response.write('</body>')
   response.write('</html>')
   response.end();
});

2. 사칙연산 값 라우터로 보내기(get)

    <form action="http://127.0.01:3001/cal" method="get">

        <input type="text" name="num1">

        <select name="cal">
            <option>+</option>
            <option>-</option>
            <option>*</option>
            <option>/</option>
        </select>

        <input type="text" name="num2">
        <input type="submit" value="더하기">
        <!-- html에서 서버로 값을 보내기 위한 세가지 조건
    1. form 태그 action속성(보내는방향지정)
    2. 사용자가입력하는 태그에 name속성 (이름표)
    3. input 태그의 tpye=submit 버튼 속성 -->
    </form>
router.get('/cal', function (request, response) {       //  /plus라우터 기능정의및등록
   /* /plus객체가가진 req res
   c 가보낸정보 req에잇다
   res > html 을 c 에게 응답 */
   let num1 = request.query.num1;
   let cal = request.query.cal;
   let num2 = request.query.num2;
   console.log(num1, cal, num2);
   //200은정상응답이란뜻                    html로응답
   response.writeHead(200, { 'Content-Type': 'text/html;charset=utf-8' });
   response.write('<html>')
   response.write('<body>')
   response.write('<h1>응답성공</h1>')
   /*   긴 if else if 코드 
   if (cal == '+') {
           response.write('결과값' + (parseInt(num1) + parseInt(num2)))
       } else if (cal == '-') {
           response.write('결과값' + (parseInt(num1) - parseInt(num2)))
       } else if (cal == '*') {
           response.write('결과값' + (parseInt(num1) * parseInt(num2)))
       } else if (cal == '/') {
           response.write('결과값' + (parseInt(num1) / parseInt(num2)))
       } */
   //eval 함수로 cal을 연산 기호로 바꿔서 코드를 줄임
   response.write('결과값' + eval(parseInt(num1) + cal + parseInt(num2)))
   response.write('</body>')
   response.write('</html>')
   response.end();
});

3. 라우터로 시험성적 보내서 평균 출력(post)

<form action="http://127.0.0.1:3001/grade" method="post">
		<fieldset>
			<legend>성적확인프로그램</legend>
			<table width="500">	
				<tr>
					<td>이름</td>
					<td><input type="text" name="name"></td>
				</tr>
				<tr>
					<td>JAVA점수</td>
					<td><input type="text" name="java"></td>
				</tr>
				<tr>
					<td>WEB점수</td>
					<td><input type="text" name="web"></td>
				</tr>
					<tr>
					<td>IOT점수</td>
					<td><input type="text" name="iot"></td>
				</tr>		
				<tr>
					<td>ANDROID점수</td>
					<td><input type="text" name="android"></td>
				</tr>		
				<tr>
					<td colspan="2"><input type="submit" value="확인하기!"></td>
				</tr>																																			
			</table>
		</fieldset>
	</form>
router.post('/grade', function (request, response) {  
    
    response.writeHead(200, { 'Content-Type': 'text/html;charset=utf-8' });
    response.write('<html>')
    response.write('<body>')
    response.write('<h1>응답성공</h1>')
    let name    = request.body.name
    let java    = request.body.java
    let web     = request.body.web
    let iot     = request.body.iot
    let android = request.body.android
    let avg = (parseInt(java) + parseInt(web) + parseInt(iot) + parseInt(android))/4
    //리스폰스라이트안에서는 하나의 값만 써야하기 때문에 , 대신 +를 써야 한다.
    response.write(name + '님의' + ' avg는 ' + avg + '이고 ')
    if (avg <= 75 && avg >= 0) {
        response.write('grade는 F')
    } else if (avg <= 79) {
        response.write('grade는 c')
    } else if (avg <= 84) {
        response.write('grade는 b')
    } else if (avg <= 89) {
        response.write('grade는 b+')
    } else if (avg <= 94) {
        response.write('grade는 a')
    } else if (avg <= 100) {
        response.write('grade는 a+')
    }
    response.write('입니다')
    response.write('</body>')
    response.write('</html>')
    response.end();
});

4. 회원가입 화면

	<form action="http://127.0.0.1:3001/join" method="post">
		<fieldset>
			<legend>Join Page</legend>		
			<table align="center">
				<tr>
					<td><label for="id">ID</label></td>
					<td><input type="text" name="id" id="id"></td>
				</tr>
				<tr>
					<td><label for="pw">PW</label></td>
					<td><input type="password" name="pw" id='pw'></td>
				</tr>			
				<tr>
					<td><label for="name">NAME</label></td>
					<td><input type="text" name="name" id="name"></td>
				</tr>				
				<tr>
					<td><label for="email">EMAIL</label></td>
					<td><input type="email" name="email" id="email"></td>
				</tr>				
				<tr>
					<td><label for="tel">TEL</label></td>
					<td><input type="tel" name="tel" id="tel"></td>
				</tr>					
				<tr>
					<td><label for="gender">GENDER</label></td>
					<td>MAN<input type="radio" name="gender" value="Man" id="gender">
						WOMEN<input type="radio" name="gender" value="Women" id="gender"></td>
				</tr>
				<tr>
					<td><label for="hobby">HOBBY</label></td>
					<td>SPORT<input type="checkbox" name='hoppy'  id="hoppy" value="sport">
						STUDY<input type="checkbox" name='hoppy' id="hobby" value="study">
						EATING<input type="checkbox" name='hoppy' id="hobby" value="eating"></td>
				</tr>
				<tr>
					<td><label for="birth">BIRTHDAY</label></td>
					<td><input type="date" name="birth" id="birth"></td>
				</tr>
				<tr>
					<td><label for="color">COLOR</label></td>
					<td><input type="color" name="color" id="color"></td>
				</tr>
				<tr>
					<td><label for="country">COUNTRY</label></td>
					<td><select name="country" >
					<option>choice..</option>
					<option>KOREA</option>
					<option>USA</option>
					</select>
					</td>
				</tr>	
				<tr>
					<td><label for="talk">TALK</label></td>
					<td><textarea id='talk' name="talk" rows="10" cols="30"></textarea>
					</td>
				</tr>
				<tr align="center">
					<td colspan="2"></td>
				</tr>			
				<tr>
					<td colspan="2"><input type="submit" value="확인하기!"></td>
				</tr>																			
			</table>
		</fieldset>
	</form>

5. request.body.name과 request.query.name의 위치

get
	은 url로 보내고
    url?key:value&key:value&key:valu  // ?쿼리스트링
    request.query.name 으로 받는다
    
post
	는 패킷으로 보내고
    request.body.name 으로 받는다

ㄱ. get은 url로 받고

response.write('<html') 가 있으면 그 밖에서 request.query.name 
으로 받아야만 한다

ㄴ. post는 body로 받고,

a. response.write('<body') 가 있는 경우 이 html문 
안에서 request.body.name 바디로 받아야만 한다. 

b. 최상단에
request.body.name를 위치시킬 경우 아래 
response.write
가 있으면 에러가 나고 

c. 아래  response.write 없으면 계속 기다린다

d. 최상단 request.body.name 아래
response.redirect( 가 아래 있는 경우 정상적으로 값을 
받으면서 리다이렉트 주소로 넘어간다.

6. [DB] 회원삭제

06.Delete.html 파일에서 아이디 인풋 후 회원 삭제를 누르면
/delete 라우트로 보낸다

<!-- 06 부터는 db 활용 -->

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

    <h1>[DB] 회원삭제페이지</h1>

    <form action="http://127.0.0.1:3001/delete" method="get">
    
        <input type="text" name="id">
        <input type="submit" value="회원삭제">
    
    </form>
</body>
</html>
/delete 라우트에서 삭제에 성공하면 리다이렉트로 이동하여
<body>
    삭제성공
</body>
을 띄운다

router.get('/delete', (request, response) => {

    let id = request.query.id
    let sql = "DELETE FROM member WHERE id=?";
    //      어떤sql? + 실패햇을떄와성공했을떄함수
    conn.query(sql, [id], (err, row) => {  //[id,pw,nick]는물음표순서대로그대로

        if (err) {
            console.log('에러,삭제실패' + err)
        }
        else if (row.affectedRows > 0) {//에러가없으면 //어펙티드로우스는 명령 성공 횟수
            console.log('명령에성공한수:' + row.affectedRows);
            console.log('삭제성공' + row)
            response.redirect('http://127.0.0.1:5500/public/06.2.DeleteS.html');
        } else if (row.affectedRows == 0) {
            console.log('삭제된값없음')
            response.redirect('http://127.0.0.1:5500/public/06.3.DeleteF.html');
        }
    })
});

ㄱ. row

console.log(row) 의 모양을 보고 코드를 작성한다
(console.log('str'+row) 면 row가 오브젝트로만 나옴)

row.length
row[i].id

딜리트의 경우 row 오브젝트에 affectedRows 를 키로하는 값등 여러 
값이이 담긴다. affectedRows는 명령이 성공한 횟수
row.affectedRows로 사용

7. [DB] 회원가입

07.JoinDB.html 에서 인풋을 받고 회원가입 버튼을 누르면
/JoinDB 라우터로 인풋값과 함께 보낸다

<form action="http://127.0.0.1:3001/JoinDB" method="post">

        <table>
            <tr>
                <td>id</td>
                <td><input type="text" name="id"></td>
            </tr>
            <tr>
                <td>pw</td>
                <td><input type="password" name="pw"></td>
            </tr>
            <tr>
                <td>nick</td>
                <td><input type="text" name="nick"></td>
            </tr>
        </table>

        <br>

        <input type="submit" value="회원가입"><br>


    </form>
/joinDB 라우터에서는
받은 인풋값으로 sql db 테이블에 추가를 하고
성공하면 리다이렉트로 url을 이동하여 
<body>
  가입성공
</body>
을 띄운다
07.2.JoinDBS.html 파일의 open with live server 주소값
response.redirect('http://127.0.0.1:5500/public/07.2.JoinDBS.html');




router.post('/joinDB', (request, response) => {

  let id = request.body.id
  let pw = request.body.pw
  let nick = request.body.nick;

  //let sql="insert into member values('1','1','1')";
  //유저가보낸걸넣기 []을추가
  let sql = "insert into member values(?,?,?)";
  //      어떤sql? + 실패햇을떄와성공했을떄함수
  conn.query(sql, [id, pw, nick], (err, row) => {  //[id,pw,nick]는물음표순서대로그대로
      if (!err) {//에러가없으면
          console.log('입력성공' + row)
          response.redirect('http://127.0.0.1:5500/public/07.2.JoinDBS.html');
      } else {
          console.log('입력실패' + err)
          response.redirect('http://127.0.0.1:5500/public/07.3.JoinDBF.html');
      }
  })


});

8. [DB] 회원정보수정

08.UpdateDB.html에서 수정을 누르면
/updateDB 라우터로 보낸다

  <form action="http://127.0.0.1:3001/updateDB" method="post">

        <table>
            <tr>
                <td>
                    id 의
                </td>
                <td>
                    <input type="text" name="id">
                </td>
            </tr>
            <tr>
                <td>
                    pw/nick 을
                </td>
                <td>
                    <select name="select">
                        <option>pw</option>
                        <option>nick</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>
                    value 로
                </td>
                <td>
                    <input type="text" name="change">
                </td>
            </tr>
        </table>

        <br>
        <input type="submit" value="수정">

    </form>
/updateDB라우터에서는 sql로 수정을 하고 리다이렉트로
<body>
  수정성공
</body>
띄운다





router.post('/updateDB', (request, response) => {

  let select = request.body.select
  let sql = `
  UPDATE member 
  SET ${select}=?
  WHERE id=?;
  `;
  let change = request.body.change
  let id = request.body.id

  conn.query(sql, [change, id], (err, row) => {  //[id,pw,nick]는물음표순서대로그대로
      if (!err) {//에러가없으면
          console.log('수정성공' + row)
          response.redirect('http://127.0.0.1:5500/public/08.2.UpdateDBS.html');
      } else {
          console.log('수정실패' + err)
          console.log(select, change, id)
          response.redirect('http://127.0.0.1:5500/public/08.3.UpdateDBF.html');
      }
  })
});

9. [DB] 회원 1명 서치

09.SearchOneDB.html 에서 아이디를 인풋 받고 /SearchOneDB 라우터로
보낸다



    <form action="http://127.0.0.1:3001/SearchOneDB" method="get">
        <input type="text" name="id"> 
        <input type="submit" value="회원id로 검색">
    </form>
/SearchOneDB라우터에서는 sql로 아이디를 select하고 검색값이
있다면 라우터를 유지하고 렌더로 SearchOneDBS.ejs 파일을 렌더링한다




router.get('/searchOneDB', (request, response) => {

    let id = request.query.id
    let sql = `
    select * 
    from member 
    WHERE id=?
    `;
    conn.query(sql, [id], (err, row) => {  //[id,pw,nick]는물음표순서대로그대로
        console.log(row)
        if (err) {
            console.log('검색실패에러' + err)
            response.redirect('http://127.0.0.1:5500/public/09.3.SearchOneDBF.html')
        }
        else if (row.length > 0) {//에러가없고 검색값이 있으면
            //selectOne.ejs 부르고 ejs가 출력 그리고 검색값을 row_name변수로 넘겨줌
            console.log('검색성공 검색값 있음')
            response.render('SearchOneDBS', {
                row_name: row
            })
        } else if (row.length == 0) {
            console.log('검색값없음')
            response.redirect('http://127.0.0.1:5500/public/09.4.SearchOneDBN.html')
        }
    })
});
SearchOneDBS.ejs파일
1명 검색이니까 0인덱으로 키가 id인 것의 value 즉 ~아이디
~비번
~닉 도 출력한다



    <table border="3px;">
        <tr>
            <th>id</th>
            <th>pw</th>
            <th>nick</th>
        </tr>
        <tr>
            <td>
                <%=row_name[0].id%>
            </td>
            <td>
                <%=row_name[0].pw%>
            </td>
            <td>
                <%=row_name[0].nick%>
            </td>
        </tr>
    </table>

9-2. ejs 쓸 때 필수 코드, 유의점

ㄱ. app.js 기본 필수 코드

//app변수로 express구동
const express = require('express');
const app = express();
//라우터경로
const router=require('./router/router.js');
//바디파서
const bodyparser = require('body-parser');
// ejs
let ejs = require('ejs');
// ejs 파일을 view폴더에  // app.use는우리가만들어서스는 것 set은 이미 잇는 속성/기능
app.set('view engine', "ejs"); 
//바디파서를 포스트로 쓰겠다
app.use(bodyparser.urlencoded({extended:false})) // app use router 위에와야함
//라우터구동
app.use(router);  //미들웨어로 라우터를 등록해주기
//포트설정 127.0.0.1.3001
app.listen(3001);  // 현재 서버파일의 port번호설정

ㄴ. 유의점

A. views 폴더에 ejs파일을 넣는다

B. 파일이름은 영문대소문자만

C. 파일경로는 파일이름만

SearchOneDBS.ejs지정

			response.render('SearchOneDBS', {
                row_name: row
            })

여기서
렌더SearchOneDBS 여기랑    SearchOneDBS.ejs 대소문자는 구분 안함

10. [DB] 모든회원검색

ㄱ.겟/포스트를 지정하지 않고 보낼 때

main.html에서


<a href='http://127.0.0.1:3001/searchAllDBejs'>
	<button> 13. [DB][ejs] 모든회원검색 </button>
</a>

폼태그 없이 겟/포스트 방식을 지정하지 않고 버튼으로 searhAllDBejs
라우터로 보낸다

라우터.js에서는
router.get('/searchAllDBejs', (request, response) => {
로 받는다

방식을 지정하지 않고 받을 땐 무조건 get으로 받는다
post는 post라고 지정해줘야 받을 수 있다
/searchAllDBejs 라우트에서는 라우트는 유지하고
searchAllDBejs.ejs 로 렌더링을 한다

row_names: row 로 row에 담긴 것을 row_names로
searchAllDBejs.ejs 로 보낸다

router.get('/searchAllDBejs', (request, response) => {
    let sql = `
    select * from member
    `;
    conn.query(sql, (err, row) => {  //[id,pw,nick]는물음표순서대로그대로
        //row에 셀렉트로 불러온 값, row[0]이면 첫행 한 줄, row[0].id면 아이디 하나
        if (err) {
            console.log('에러' + err)
        } else if (row.length >= 1) {
            console.log('검색성공 :' + row.length + ' 명')
            console.log(row)
            //selectOne.ejs 부르고 ejs가 출력
            response.render('searchAllDBejs', {
                row_names: row
            })
        } else {
            console.log('검색햇으나 회원이 0명 ' + row.length)
        }
    })
});
searchAllDBejs.ejs 파일

받은 row_names로 ejs문법 포문으로 회원리스트를 출력하고
삭제버튼을 누르면 /SelectDelete 라우트로 쿼리로 아이디를 보낸다

<table border="3px;">
        <tr>
            <th>id</th>
            <th>pw</th>
            <th>nick</th>
        </tr>              <!-- i 0부터시작하니까 렝스보다 작다로 -->
        <% for (let i=0; i < row_names.length; i++){%>
        <tr>
            <td>
                <%= row_names[i].id %>
            </td>
            <td>
                <%= row_names[i].pw %>
            </td>
            <td>
                <%= row_names[i].nick %>
            </td>
            <td>
                <a href="http://127.0.0.1:3001/SelectDelete?id=<%= row_names[i].id %>">삭제</a>
            </td>
        </tr>
        <%}%>
    </table>

회원출력리스트에서 바로 삭제

/SelectDelete 라우트에서 쿼리로 아이디를 받고 sql문으로
아이디가 존재하면 삭제한다

삭제에 성공하면 /searchAllDBejs 라우트로 보낸다

router.get('/SelectDelete', (request, response) => {
    let id = request.query.id
    let sql = "DELETE FROM member WHERE id=?";
    //      어떤sql? + 실패햇을떄와성공했을떄함수
    conn.query(sql, [id], (err, row) => {  //[id,pw,nick]는물음표순서대로그대로
        if (err) {
            console.log('삭제실패' + err)
        }
        else if (row.affectedRows > 0) {//에러가없으면
            console.log('명령에성공한수:' + row.affectedRows);
            console.log('삭제성공' + row)
            response.redirect('http://127.0.0.1:3001/searchAllDBejs');
        } else if (row.affectedRows == 0) {
            console.log('삭제된값없음')
            response.redirect('http://127.0.0.1:3001/main');
        }
    })
});
/searchAllDBejs에서
회원검색이 성공하면 라우트를 유지하고
searchAllDBejs.ejs를 렌더링한다

router.get('/searchAllDBejs', (request, response) => {
    let sql = `
    select * from member
    `;
    conn.query(sql, (err, row) => {  //[id,pw,nick]는물음표순서대로그대로
        //row에 셀렉트로 불러온 값, row[0]이면 첫행 한 줄, row[0].id면 아이디 하나
        if (err) {
            console.log('에러' + err)
            response.redirect('http://127.0.0.1:5500/public/11.3.searchAllDBF.html')
        } else if (row.length >= 1) {
            console.log('검색성공 :' + row.length + ' 명')
            console.log(row)
            //selectOne.ejs 부르고 ejs가 출력
            response.render('searchAllDBejs', {
                row_names: row
            })
        } else {
            console.log('검색햇으나 회원이 0명 ' + row.length)
            response.redirect('http://127.0.0.1:5500/public/11.4.searchAllDBN.html')
        }
    })
});
searchAllDBejs.ejs 에서 다시 회원리스트를 출력하여
처음 삭제 버튼을 누를 때 삭제한 회원만 삭제되고 바로 리스트는 유지되는
것처럼 보이게 한다

    <table border="3px;">
        <tr>
            <th>id</th>
            <th>pw</th>
            <th>nick</th>
        </tr>              <!-- i 0부터시작하니까 렝스보다 작다로 -->
        <% for (let i=0; i < row_names.length; i++){%>
        <tr>
            <td>
                <%= row_names[i].id %>
            </td>
            <td>
                <%= row_names[i].pw %>
            </td>
            <td>
                <%= row_names[i].nick %>
            </td>
            <td>
                <a href="http://127.0.0.1:3001/SelectDelete?id=<%= row_names[i].id %>">삭제</a>
            </td>
        </tr>
        <%}%>
    </table>

11. [DB] 로그인

12.loginDBejs.html파일에서 로그인을 하면
/loginDBejs 라우트로 보낸다

    <form action="http://127.0.0.1:3001/loginDBejs" method="post">
        <!-- password 포스트방식보안 -->
        <input type="text" name="id"><br>
        <input type="password" name="pw"><br><br>
        <input type="submit" value="로그인"><br>
    </form>
/loginDBejs 라우트에서 로그인에 성공하면 라우트를 유지하고
loginDBejs.ejs를 렌더링한다

router.post('/loginDBejs', (request, response) => {

    let id = request.body.id
    let pw = request.body.pw
    //console.log(id,pw)
    request.session.user = id //로긴에성공한사람의아이디를 세션에 저장,conn.문안에적어도괜찮

    let sql = `
    select * 
    from member 
    WHERE id=? and pw=?
    `;

    conn.query(sql, [id, pw], (err, row) => {  //[id,pw,nick]는물음표순서대로그대로
        if (err) {
            console.log('검색실페에러' + err)
        } else if (row.length > 0) {
            console.log('로긴성공')
            //response.redirect('http://127.0.0.1:5500/public/05.2.LoginS.html')
            console.log('session영역에아이디저장성공 저장아이디는: ' + request.session.user);
            console.log(row)
            console.log('row[0].id: ' + row[0].id)
            response.render('loginDBejs', {
                row_name: row
            })
        } else if (row.length == 0) {
            console.log('로긴실패')
            response.redirect('http://127.0.0.1:5500/public/05.3.LoginF.html')
        }
    })
});
loginDBejs.ejs 파일

    <%=row_name[0].id%>님 로그인 하셨습니다<br><br>
    <a href="http://127.0.0.1:3001/MainEJS">메인ejs로 이동</a>
    <br><br>
    <button>게시판</button><br>
    <button>메일</button><br>
    <button>카페</button><br>
    <button>블로그</button><br>

12. [DB] EJS Main + 로그인/로그아웃 페이지

ㄱ. 12.loginDBejs.html

A. 여기서 로그인을 하면 /loginDBejs 라우트로 보낸다

    <form action="http://127.0.0.1:3001/loginDBejs" method="post">
        <!-- password 포스트방식보안 -->
        <input type="text" name="id"><br>
        <input type="password" name="pw"><br><br>
        <input type="submit" value="로그인"><br>
    </form>

ㄴ. /loginDBejs 라우트

B. html파일에서 로그인 정보인 id, pw를 받아서 멤버 테이블에 있는지 검색하고 
C. id를 세션.user에 저장한다
D. 로긴에 성공하면 loginDBejs.ejs 파일을 /loginDBejs 라우터
에서 그대로 렌더링한다.
E. loginDBejs.ejs 에 row_name: row 으로 id, pw가 일치하는 
sql열의 모든 정보가 담긴 row를  row_name 으로 loginDBejs.ejs 에
같이 보낸다

* request.session.user = request.body.id
에서 로그인할 때 받은 id 값을 세션이라는 공간의 user 란에
따로 저장한다



router.post('/loginDBejs', (request, response) => {

    let id = request.body.id
    let pw = request.body.pw
    //console.log(id,pw)
    request.session.user = id //로긴에성공한사람의아이디를 세션에 저장,conn.문안에적어도괜찮

    let sql = `
    select * 
    from member 
    WHERE id=? and pw=?
    `;

    conn.query(sql, [id, pw], (err, row) => {  //[id,pw,nick]는물음표순서대로그대로
        if (err) {
            console.log('검색실페에러' + err)
        } else if (row.length > 0) {
            console.log('로긴성공')
            //response.redirect('http://127.0.0.1:5500/public/05.2.LoginS.html')
            console.log('session영역에아이디저장성공 저장아이디는: ' + request.session.user);
            console.log(row)
            console.log('row[0].id: ' + row[0].id)
            response.render('loginDBejs', {
                row_name: row
            })
        } else if (row.length == 0) {
            console.log('로긴실패')
            response.redirect('http://127.0.0.1:5500/public/05.3.LoginF.html')
        }
    })
});

ㄷ. loginDBejs.ejs

F. row_name값을 받아서 0인덱의 key:id로 value: 를 뽑는다
	ejs문으로 id 님 로그인 하셨습니다
G. 메인ejs링크버튼을 누르면 /MainEJS 라우트로 보낸다

   <%=row_name[0].id%>님 로그인 하셨습니다<br><br>
    <a href="http://127.0.0.1:3001/MainEJS">메인ejs로 이동</a>
    <br><br>
    <button>게시판</button><br>
    <button>메일</button><br>
    <button>카페</button><br>
    <button>블로그</button><br>

ㄹ. /MainEJS 라우트

/MainEJS 라우트로 가면 라우트를 유지하고 MainEJS.ejs 파일을 렌더링한다

router.get('/MainEJS', (request, response) => {
    response.render('MainEJS',{
        id: request.session.user
    })
});

ㅁ. MainEJS.ejs

MainEJS.ejs 로 오면 위에서
    let id = request.body.id
    request.session.user = id 
로 session.user에 저장한 id가 null인지 아닌지 확인한다

null이면 로그인하지 않고 온 것이기 때문에 로그인 페이지를
a태그로 로그인 버튼을 달아서 출력하고

id가 null이 아니라 값이 존재하면
로그인을 해서 들어온 것이기 때문에 로그아웃 버튼을 출력한다

로그아웃 버튼을 누르면 /Logout 라우트로 보낸다
    
<body>
    <h1>EJS Main Page 로그인하면 들어오는 메인페이지</h1>
    <a href='01.Plus.html'><button> 1. 더하기 </button></a> <br>
    <a href='02.Cal.html'><button> 2. 사칙연산 </button></a> <br>
    <a href='03.Grade.html'><button> 3. 시험성적 </button></a> <br>
    <a href='04.Join.html'><button> 4. 회원데이터입출력 </button></a> <br>
    <a href='05.Login.html'><button> 5. 특정아이디와맞는지 </button></a> <br>
    <br>
    <a href='10.LoginDB.html'><button> 10. [DB] 회원아이디비번있는지확인 </button></a> <br>
    <a href='http://127.0.0.1:3001/searchAllDB'><button> 11. [DB] 모든회원검색되는지확인 </button></a> <br>
    <br>
    <a href='07.JoinDB.html'><button> 7. [DB] 회원가입 </button></a> <br>
    <a href='12.loginDBejs.html'><button> 12. [DB][ejs] 로그인 </button></a> <br>
    <a href='08.UpdateDB.html'><button> 8. [DB] 회원수정 </button></a> <br>
    <a href='06.Delete.html'><button> 6. [DB] 회원삭제 </button></a> <br>
    <a href='09.SearchOneDB.html'><button> 9. [DB][ejs] 회원한명찾기 </button></a> <br>
    <a href='http://127.0.0.1:3001/searchAllDBejs'><button> 13. [DB][ejs] 모든회원검색 </button></a> <br>
    <br>
    <a href='http://127.0.0.1:3001/MainEJS'><button> 14. [DB][ejs] ejs 메인 page </button></a> <br>
    <br>
    <!-- id값이 null이면 로그인하지 않았다는 뜻이니 로그인 버튼을 넣는다 -->
    <% if (id==null){%>
        <a href='http://127.0.0.1:5500/public/12.loginDBejs.html'><button>로그인</button></a>
        <%}else{%>
            <a href='http://127.0.0.1:3001/Logout'><button>로그아웃</button></a>
            <%}%>
</body>

ㅂ. /Logout 라우트

로그아웃 라우트로 들어오면 세션.유저를 딜리트하고 
라우트를 유지하고 MainEJS.ejs를 렌더링하며
id: request.session.user 로 비어있지만 id값을 보낸다

router.get('/Logout', (request, response) => {
    delete request.session.user;
    response.render('MainEJS', {
        id: request.session.user
    })
});

ㅅ. MainEJS.ejs

이번엔 딜리트를 하고 왔기 때문에 id==null을 만족하여
로그인 버튼을 출력한다

즉 MainEJS.ejs 메인화면에서 로그아웃을 누르면 이 과정이 
빠르게 진행되고 라우트를 유지하고 진행하였기 때문에 로그아웃 버튼을 
누르면 바로 로그인 버튼으로 바뀐다


<body>
    <h1>EJS Main Page 로그인하면 들어오는 메인페이지</h1>
    <a href='01.Plus.html'><button> 1. 더하기 </button></a> <br>
    <a href='02.Cal.html'><button> 2. 사칙연산 </button></a> <br>
    <a href='03.Grade.html'><button> 3. 시험성적 </button></a> <br>
    <a href='04.Join.html'><button> 4. 회원데이터입출력 </button></a> <br>
    <a href='05.Login.html'><button> 5. 특정아이디와맞는지 </button></a> <br>
    <br>
    <a href='10.LoginDB.html'><button> 10. [DB] 회원아이디비번있는지확인 </button></a> <br>
    <a href='http://127.0.0.1:3001/searchAllDB'><button> 11. [DB] 모든회원검색되는지확인 </button></a> <br>
    <br>
    <a href='07.JoinDB.html'><button> 7. [DB] 회원가입 </button></a> <br>
    <a href='12.loginDBejs.html'><button> 12. [DB][ejs] 로그인 </button></a> <br>
    <a href='08.UpdateDB.html'><button> 8. [DB] 회원수정 </button></a> <br>
    <a href='06.Delete.html'><button> 6. [DB] 회원삭제 </button></a> <br>
    <a href='09.SearchOneDB.html'><button> 9. [DB][ejs] 회원한명찾기 </button></a> <br>
    <a href='http://127.0.0.1:3001/searchAllDBejs'><button> 13. [DB][ejs] 모든회원검색 </button></a> <br>
    <br>
    <a href='http://127.0.0.1:3001/MainEJS'><button> 14. [DB][ejs] ejs 메인 page </button></a> <br>
    <br>
    <!-- id값이 null이면 로그인하지 않았다는 뜻이니 로그인 버튼을 넣는다 -->
    <% if (id==null){%>
        <a href='http://127.0.0.1:5500/public/12.loginDBejs.html'><button>로그인</button></a>
        <%}else{%>
            <a href='http://127.0.0.1:3001/Logout'><button>로그아웃</button></a>
            <%}%>
</body>

13. 00.Main.html 과 MainEJS.ejs 의 차이

ㄱ. 00.Main.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <h1>Main Page</h1>
    <a href='01.Plus.html'><button> 1. 더하기 </button></a> <br>
    <a href='02.Cal.html'><button> 2. 사칙연산 </button></a> <br>
    <a href='03.Grade.html'><button> 3. 시험성적 </button></a> <br>
    <a href='04.Join.html'><button> 4. 회원데이터입출력 </button></a> <br>
    <a href='05.Login.html'><button> 5. 특정아이디와맞는지 </button></a> <br>
    <br>
    <a href='10.LoginDB.html'><button> 10. [DB] 회원아이디비번있는지확인 </button></a> <br>
    <a href='http://127.0.0.1:3001/searchAllDB'><button> 11. [DB] 모든회원검색되는지확인 </button></a> <br>
    <br>
    <a href='07.JoinDB.html'><button> 7. [DB] 회원가입 </button></a> <br>
    <a href='12.loginDBejs.html'><button> 12. [DB][ejs] 로그인 </button></a> <br>
    <a href='08.UpdateDB.html'><button> 8. [DB] 회원수정 </button></a> <br>
    <a href='06.Delete.html'><button> 6. [DB] 회원삭제 </button></a> <br>
    <a href='09.SearchOneDB.html'><button> 9. [DB][ejs] 회원한명찾기 </button></a> <br>
    <a href='http://127.0.0.1:3001/searchAllDBejs'><button> 13. [DB][ejs] 모든회원검색 </button></a> <br>
    <br>
    <a href='http://127.0.0.1:3001/MainEJS'><button> 14. [DB][ejs] ejs 메인 page </button></a> <br>
    <a href='http://127.0.0.1:3001/Main'><button> 15. 메인 page </button></a> <br>

</body>

</html>

ㄴ. MainEJS.ejs

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <h1>EJS Main Page 로그인하면 들어오는 메인페이지</h1>
    <a href='http://127.0.0.1:5500/public/01.Plus.html'><button> 1. 더하기 </button></a> <br>
    <a href='http://127.0.0.1:5500/public/02.Cal.html'><button> 2. 사칙연산 </button></a> <br>
    <a href='http://127.0.0.1:5500/public/03.Grade.html'><button> 3. 시험성적 </button></a> <br>
    <a href='http://127.0.0.1:5500/public/04.Join.html'><button> 4. 회원데이터입출력 </button></a> <br>
    <a href='http://127.0.0.1:5500/public/05.Login.html'><button> 5. 특정아이디와맞는지 </button></a> <br>
    <br>
    <a href='http://127.0.0.1:5500/public/10.LoginDB.html'><button> 10. [DB] 회원아이디비번있는지확인 </button></a> <br>
    <a href='http://127.0.0.1:3001/searchAllDB'><button> 11. [DB] 모든회원검색되는지확인 </button></a> <br>
    <br>
    <a href='http://127.0.0.1:5500/public/07.JoinDB.html'><button> 7. [DB] 회원가입 </button></a> <br>
    <a href='http://127.0.0.1:5500/public/12.loginDBejs.html'><button> 12. [DB][ejs] 로그인 </button></a> <br>
    <a href='http://127.0.0.1:5500/public/08.UpdateDB.html'><button> 8. [DB] 회원수정 </button></a> <br>
    <a href='http://127.0.0.1:5500/public/06.Delete.html'><button> 6. [DB] 회원삭제 </button></a> <br>
    <a href='http://127.0.0.1:5500/public/09.SearchOneDB.html'><button> 9. [DB][ejs] 회원한명찾기 </button></a> <br>
    <a href='http://127.0.0.1:3001/searchAllDBejs'><button> 13. [DB][ejs] 모든회원검색 </button></a> <br>
    <br>
    <a href='http://127.0.0.1:3001/MainEJS'><button> 14. [DB][ejs] ejs 메인 page </button></a> <br>
    <a href='http://127.0.0.1:3001/Main'><button> 15. 메인 page </button></a> <br>
    <br>
    <!-- id값이 null이면 로그인하지 않았다는 뜻이니 로그인 버튼을 넣는다 -->
    <% if (id==null){%>
        <a href='http://127.0.0.1:5500/public/12.loginDBejs.html'><button>로그인</button></a>
        <%}else{%>
            <a href='http://127.0.0.1:3001/Logout'><button>로그아웃</button></a>
            <%}%>
</body>

</html>

ㄷ. 차이

00.Main.html 은 open with live server로 열면
http://127.0.0.1:5500/public/00.Main.html 경로다

MainEJS.ejs 를 라우트로 열면
http://127.0.0.1:3001/MainEJS 경로다

그래서

00.Main.html 에서는 href 에서 http://127.0.0.1:5500/public/
를 생략할 수 있다
MainEJS.ejs 에서는 href 에서 http://127.0.0.1:3001
를 생략할 수 있다

end

end

end

end

end

end

end

end

end

end

end

end

end

end

profile
BABY CAT
BABY
이전 포스트

오후새선생님 node js

다음 포스트

node/ get, post

0개의 댓글