express - middleware 사용해보기

앞에꺼는 차후에 정리,,

 

에러 미들웨어는 next 구문을 반드시 포함해줘야 한다.

app.use((err, req, res, next) => {
    
})

javascript는 아래 두 구문을 다른 함수로 친다. 

app.use((err, req, res, next) => {
    
})



app.use((err, req, res) => {
    
})

 

 

아래 구문을 찍어보면 다른함수인지 파악을 할 수 있다.

const a = (err, req, res, next) => {
    console.error(err);
}
a.length b.length

const b = (err, req, res) => {
    console.error(err);
}

 

아래와 같이 error middleware를 간단하게 만들어 보았다.

 

const express = require('express');
const path = require('path');

const app = express();

app.set('port', process.env.PORT || 3000);

app.use((req, res, next) => {
    console.log('1 모든 요청에 실행하고싶어요');
    next();
}, (req, res, next) => {
    throw new Error('에러가 났어요');
})


app.get('/', (req, res) => {
    res.sendFile(path.join(__dirname, 'index.html'));
});

app.post('/', (req, res) => {
    res.send('hello express!');
});

app.get('/category/Javascript', (req, res) => {
    res.send(`hello Javascript`);
}); 

app.get('/category/:name', (req, res) => {
    res.send(`hello wildcard`);
})

app.get('/about', (req, res) => {
    res.send('hello express');
});

app.get('*', (req, res) => {
    res.send(`hello everybody`);
});

app.use((err, req, res, next) => {
    console.error(err);
    res.send('에러났다이. 근데 안알려줄끼다');
})


app.listen(app.get('port'), () => {
    console.log('익스프레스 서버 실행');
});

 

 

404처리 middleware도 만들어보자. 라우터들 모두 검색을 해보았는데 뜨지 않았으면 404에러인 것이다.

(너의 요청이 어디로 갔는지 모르겠다라고 표시)

app.use((req, res, next) => {
    res.send('404입니다');
});

app.use((err, req, res, next) => {
    console.error(err);
    res.send('에러났다이. 근데 안알려줄끼다');
})

app.listen(app.get('port'), () => {
    console.log('익스프레스 서버 실행');
});

 

400번대 에러 같은 경우는(401은 로그인 관련된 문제, 403은 forbidden 금지된, ) 404라고 할 때도 많다.

middleware 뒤에 404 처리하는 거랑 / 에러 처리 미들웨어를 작성해 보았다.

const express = require('express');
const path = require('path');

const app = express();

app.set('port', process.env.PORT || 3000);

app.use((req, res, next) => {
    console.log('1 모든 요청에 실행하고싶어요');
    next();
})


app.get('/', (req, res) => {
    res.sendFile(path.join(__dirname, 'index.html'));
});

app.post('/', (req, res) => {
    res.send('hello express!');
});

app.get('/category/Javascript', (req, res) => {
    res.send(`hello Javascript`);
}); 

app.get('/about', (req, res) => {
    res.send('hello express');
});

app.use((req, res, next) => {
    res.status(200).send('404입니다');
});

app.use((err, req, res, next) => {
    console.error(err);
    res.status(200).send('에러났다이. 근데 안알려줄끼다');
})

app.listen(app.get('port'), () => {
    console.log('익스프레스 서버 실행');
});

 

그리고 한 라우터에서 res.send를 두번 하는 경우가 있는데 아래와 같은 에러가 뜨는데,

요청 한번에 응답 3번이므로 에러가 뜨는 것이다.

node를 처음하는 나의 입장에서 매번 저지르는 실수이기 때문에 기억을 해두자.

const express = require('express');
const path = require('path');

const app = express();

app.set('port', process.env.PORT || 3000);

app.use((req, res, next) => {
    console.log('1 모든 요청에 실행하고싶어요');
    next();
})


app.get('/', (req, res) => {
    res.sendFile(path.join(__dirname, 'index.html'));
    res.send('안녕하세요.');
    res.json({hello : 'zerocho'});
});

Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client

 

WriteHead한 경우에도 에러가 나게 되는데

응답 보낸다음에 writeHead를 하게되면 에러가 나게된다.

app.get('/', (req, res) => {
    res.sendFile(path.join(__dirname, 'index.html'));
    res.send('안녕하세요.');
    res.json({hello : 'zerocho'});
    res.writeHead()
});

Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client

 

 

express에서 writeHead나 end를 써도되는데 req, res가 http의 req res랑 같지는 않지만 걔네들을 상속받은 것이다.

기본적으로 http의 req, res를 둘다 쓸수는 있는데 express에서는 쓰지말아야 한다.

express 전용을 쓰자.

app.get('/', (req, res) => {
    // res.sendFile(path.join(__dirname, 'index.html'));
    res.send('안녕하세요.');
});

기본 http꺼 쓰지말고 아래와 같이 express식으로 쓰자.

app.get('/', (req, res) => {
    // res.sendFile(path.join(__dirname, 'index.html'));
    res.setHeader('Content-Type', 'text/html'); 
    res.status(200).send('안녕하세요.');
});

 

 

 

 

<출처 조현영: Node.js 교과서 - 기본부터 프로젝트 실습까지 >

https://www.inflearn.com/course/%EB%85%B8%EB%93%9C-%EA%B5%90%EA%B3%BC%EC%84%9C/dashboard

[리뉴얼] Node.js 교과서 - 기본부터 프로젝트 실습까지 - 인프런 | 강의