[web] 쿼리스트링, 패스파라미터(시멘틱 URL)

 

 

쿼리스트링)

 

url 끝에 데이터 값을 전달.

쓰는이유 : 같은 path에 다른 데이터값을 줘서 페이지가 동적으로 작동할 수 있게, 상황에따라 다른 정보를 보여줄수 있게 하기 위함이다

 

사용방법)
path뒤에 ?data1="값1"&data2="값2" 와 같은 방 식으로 전해준다 

 

http://index.html/idx=9

밑줄친 부분이 쿼리스트링

api 에서 그 전달 받은 값을 받아서 쓰는법)
http://index.html/article?articleIdx=10 를 전달받았다면)

app.get("/article", (req, res) => {

    const articleIdx = req.query.articleIdx;   //  변수에 10 할당

})

ㄴ쿼리스트링(articleIdx=10)을 프로퍼티로 갖는다. 그래서 바로 쓸 수 있다

    req.query.articleIdx;

ㄴ쿼리스트링으로 전달받은 여러개의 <키-밸류> 들을 변수들에 동시에 할당하기)

http://index.html/article?articleIdx=10&title="제목"&content="내용" 를 전달받았다면)

 

app.get("/article", (req, res) => {

    const {articleIdx,title,content} = req.query;  // articleIdx = 10, title="제목", content="내용" 할당

})

ㄴ쿼리스트링으로 전달받은 여러개의 <키-밸류> 들을 변수들을 "다른 변수명"으로 값을 할당하기

app. get("/article", (req, res) => {

    const {articleIdx: idx, title: myTitle, content: myContent} = req.query;  //idx = 10, myTitle = "제목", myContent = "내용" 

})

패스파라미터(시멘틱 URL)

ㄴ쿼리스트링과 유사하지만, 보다더 깔끔한 URL로 보일 수 있는 방법


ㄴ쿼리스트링(기존)URL = http://index.html/idx=9
ㄴ패스파라미터(시멘틱 URL) = http://index.html/9

ㄴapi 내에서 전달받은 파라미터값을 쓰는법

http:index.html/article/10 을 전달받았다면)

    app.get('/article/:idx', (req, res) => {

        const idx = req.params.idx  // idx = 10 할당

    })

 

 

 

 

 

 

 

 

 

 

body VS query string VS path parameter를 각각 언제 쓰는가)

 

 

-req.body : 오브젝트(JSON,XML...), 일반적인 데이터,매우많은수의 인수

 

-req.query : 정렬, 필터링

 

-req.params: 리소스식별(idx류), 하나의데이터