GET 과 POST 네트워크 전송 방식이다.
GET 방식은 어떠한 데이터를 전달 해주는 방식이라면 POST 방식은 데이터의 값을 변경하는 방식, 암호화 형태로 전송
GET 방식
const express = require('express')
const app = express()
app.get('/',function(req, res){
res.send('Hello home page')
})//get 방식에 홈으로 들어온 사람들
app.get('/login',function(req,res){
res.send('<h1>Login please</h1>') //정적 웹페이지 표현
})
app.get('/dynamic', function(req, res){ //동적 표현
var lis = '';
for(var i=0; i<5; i++){
lis = lis + '<li>coding</li>';
}
var time = Date();
var output = `
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
Hello, Dynamic!
<ul>
${lis}
</ul>
${time}
</body>
</html>`;
res.send(output);
});
app.listen(3000,function(){
console.log('Conneted 3000port ');
});
쿼리 스트링
req : 사용자 요청 정보
res : ->브라우저로
app.get('/topic', function(req, res){
res.send(req.query.id) //쿼리 스트링의 id 값을 알아낸다.
})
app.get('/topic2', function(req, res){
const topics = [
'javascript',
'node js',
'express'
] //반복문이나 db로 의미있게 사용가능
let href= `
<a href="/topic2?id=0">JavaScript</a><br>
<a href="/topic2?id=1">JavaScript</a><br>
<a href="/topic2?id=2">JavaScript</a><br>
${topics[req.query.id]}
`
res.send(href)
})
function 표현 생략 가능
app.get('/topic', (req, res)=>{
res.send(req.query.id) //쿼리 스트링의 id 값을 알아낸다.
})
시멘틱 URL
app.get('/topic/:id/:mode', (req, res)=>{
res.send(req.params.id) //쿼리 스트링의 id 값을 알아낸다.
})
POST 방식
const bodyParser = require('body-parser')
app.use(bodyParser.urlencoded({extended:false})) //모듈을 먼저 거쳐간다.
//req 로 값을 확인하기 위해서는 미들웨어 설치 body-parser, multer
//npm install body-parser --save
app.post('/form',(req,res)=>{
const title = req.body.title
})
html 렌더링이 안돼서
ejs 템플릿 사용 : html 파일 만들지 않아도 됨
node.js html템플릿 ejs
먼저 템플릿 사용이유를 알아봅시다.첫 번째 사진과 두 번째 사진을 보시면 공통적인 부분이 있는데요. 바...
blog.naver.com
npm install ejs --save
EJS는 템플릿이 되는 HTML 코드에 특수 태그를 사용하여 필요한 정보를 포함할 수 있다. 준비되어 있는 태그는 다음 두 가지이다.
<%= 값 %>
작성한 값을 그 자리에 써 낸다. 스크립트 측에서 준비한 변수 등을 표시하는데 사용한다. HTML 태그 등이 포함되어 있는 경우, 그들은 이스케이프 처리된다.
<%- 값 %>
마찬가지로 값을 그 자리에 써 낸다. 다만, 이곳은 HTML 관련 태그는 이스케이프 처리되지 않고 그대로 쓰여진다.
<% 스크립트 %>
출처: https://araikuma.tistory.com/454 [프로그램 개발 지식 공유]
jsp랑 비슷
'Back-end > 웹(web)' 카테고리의 다른 글
| AMP : Accelerated Mobile Pages (0) | 2021.02.21 |
|---|---|
| express multer 파일 업로드 (0) | 2020.09.23 |
| nodejs 프레임워크 express 로 서버 설치, 설정 (0) | 2020.09.22 |
| 부트스트랩 활용할 수 있는 템플릿 (0) | 2020.07.29 |
| API을 이용한 책 검색 ,ajax, kakao api (0) | 2020.07.27 |
댓글