API와 CreateServer
API = Application Programming Interface
pm2 보충학습
pm2 kill pm2의 모든 프로세스를 종료
pm2 start main.js --watch --no-daemon 로그까지도 잘 보임
pm2 start main.js --watch --ignore-watch="data/*" --no-daemon 파일변경시 재시작하지 않음
휴지통/Node.Js
공부(24)
2021. 8. 27. 16:27
공부(23)
2021. 8. 27. 11:50
입력정보에 대한 보안
폴더 내에 password.js 라는 파일을 만들고
module.exports = {
id:'specialist',
password:'quickwork'
}이런식으로 해주고 저장해준다
그리고 url에 localhost:3000/?id=../password.js 를 검색하면
위의 아이디와 패스워드가 그대로 노출되게 된다
../password.js이라는것은 data의 부모디렉토리의 password.js 를 가져와라 라는 뜻이 된다
... 이런식으로 부모디렉토리로 계속 올라가면 우리 컴퓨터를 탐색할 수 있게 된다
이렇기에 보안이 중요하다
var path = require('path');모듈을 불러와주고
var filteredId = path.parse(queryData.id).base;
fs.readFile(`data/${filteredId}`, 'utf8', function(err, description)filtereId 를 만들어주고 아래에도 경로부분에 queryData.id를 filteredId로 치환해준다
아래 나머지 readFile들도 다 수정해준다
출력정보에 대한 보안
localhost:3000으로 들어가서 create를 한다
제목은 XSS
내용은
<script>
alert('merong');
</script>이렇게 작성해준다
그렇게 하고 제출을 하면 경고창이 뜨며 merong하는것을 알 수 있다
XSS를 클릭할때마다 이제 경고창으로 merong이 뜨게된다
XSS 본문을 수정해보자
<script>
location.href = 'https://opentutorials.org/course/1';
</script>이렇게 하면 XSS를 누를때마다 생활코딩 홈페이지로 들어가짐을 알 수 있다
이것을 홈페이지로 안들어가고 그냥 출력은 어떻게 하냐면
data폴더 내의 XSS를 수정하면 된다 <> 이것을 <, >로 치환해주면 된다
npm sanitize를 이용해보자
cmd로
npm init을 쳐보자
그냥 엔터를 쭉 눌러준다
npm install -S sanitize-html 를 치고 엔터를 눌러준다
-g는 글로벌로 어디서나 쓸 수 있지만
-S는 해당 프로젝트만 사용할 수 있다
var sanitizeHtml = require('sanitize-html');main,js 에 모듈을 불러오고
fs.readdir('./data', function(error, filelist){
var filteredId = path.parse(queryData.id).base;
fs.readFile(`data/${filteredId}`, 'utf8', function(err, description){
var title = queryData.id;
var sanitizedTitle = sanitizeHtml(title);
var sanitizedDescription = sanitizeHtml(description);
var list = template.list(filelist);
var html = template.Html(sanitizedTitle, list,
`<h2>${sanitizedTitle}</h2>${sanitizedDescription}`,
`<a href="/create">create</a>
<a href="/update?id=${sanitizedTitle}">update</a>
<form action="delete_process" method="post">
<input type="hidden" name="id" value="${sanitizedTitle}">
<input type="submit" value="delete">
</form>`
);
response.writeHead(200);
response.end(html);
});
});sanitized를 이용해서 변수들을 clean하게 만들어주고 바뀐 변수들을 치환해준다
이제 웹에서 <script>를 이용하면 그것이 제외되고 나오는 것을 볼 수 있다
만약 h1태그를 허용하고 싶다면
var sanitizedDescription = sanitizeHtml(description, {
allowedTags:['h1']
});allowedTag 라는 옵션을 이용해서 허용하고싶은 태그들을 작성하면 된다
공부(22)
2021. 8. 26. 21:45
모듈의 활용
모듈은 module.exports를 이용해서 require로 불러오게 된다
lib 폴더를 만들어주고 그 안에 template.js 파일을 만들어서 main.js안에 있는 template을 옮겨준다
var template = {
Html:function(title, list, body, control){
return `
<!doctype html>
<html>
<head>
<title>WEB1 - ${title}</title>
<meta charset="utf-8">
</head>
<body>
<h1><a href="/">WEB</a></h1>
${list}
${control}
${body}
</body>
</html>
`;
}, list:function(filelist){
var list = '<ul>';
var i = 0;
while(i < filelist.length){
list = list + `<li><a href="/?id=${filelist[i]}">${filelist[i]}</a></li>`;
i = i + 1;
}
list = list+'</ul>';
return list;
}
}
module.exports = template;이것을 좀더 바꿀 수 있다
module.exports = {
Html:function(title, list, body, control){
return `
<!doctype html>
<html>
<head>
<title>WEB1 - ${title}</title>
<meta charset="utf-8">
</head>
<body>
<h1><a href="/">WEB</a></h1>
${list}
${control}
${body}
</body>
</html>
`;
}, list:function(filelist){
var list = '<ul>';
var i = 0;
while(i < filelist.length){
list = list + `<li><a href="/?id=${filelist[i]}">${filelist[i]}</a></li>`;
i = i + 1;
}
list = list+'</ul>';
return list;
}
}
module.exports = template;이제 main.js에서 require을 해주어야 한다
var template = require('./lib/template.js');
모듈을 이용해서 더 간결하게 코드를 작성할 수 있게 되었다
공부(21)
2021. 8. 26. 21:14
템플릿 기능 정리정돈하기
객체를 이용해서 정리정돈을 해보기로 했다
var template = {
html:function(title, list, body, control){
return `
<!doctype html>
<html>
<head>
<title>WEB1 - ${title}</title>
<meta charset="utf-8">
</head>
<body>
<h1><a href="/">WEB</a></h1>
${list}
${control}
${body}
</body>
</html>
`;
}, list:function(filelist){
var list = '<ul>';
var i = 0;
while(i < filelist.length){
list = list + `<li><a href="/?id=${filelist[i]}">${filelist[i]}</a></li>`;
i = i + 1;
}
list = list+'</ul>';
return list;
}
}html과 list를 객체화 해서 넣어주었다
이렇게 넣어주면 아래부분을 수정해줘야한다
var list = template.list(filelist);
var html = template.Html(title, list, `<h2>${title}</h2>${description}`, `<a href="/create">create</a>`);
response.writeHead(200);
response.end(html);함수들을 다 객체로 불러오는걸로 바꿔주었다
template가 위에 있으므로 이름을 html로 바꾸어주었다
아래도 동일하게 바꾸어준다
코드를 이렇게 간결하게 하는 것(중복을 최대한 줄이기) 즉 리펙토링은 중요하다