ajax 기술은 비동기적으로 서버에서 데이터를 클라이언트 화면에
리로드없이 보이는 기술
예제 ) 클릭시 DB에 있는 내용 뽑아오기
html
let xhr = new XMLHttpRequest();
xhr.onreadystatechange = () => {
if (xhr.readyState == xhr.DONE) {
if (xhr.status == 200) {
console.log(xhr.response);
setContent(xhr.response);
} else {
console.error(xhr.response);
}
}
}
xhr.open('GET', `/board/ajax/${id}`);
xhr.send();
server.js
router.get('/ajax/:id', (req, res) => {
let id = req.params.id;
DB.query(`select * from post where id=${id}`, (err,rows)=>{
let row = rows[0];
res.send(row.content);
});
})
xhr.open에서 인자로 넣는 url(리소스)로 브라우저에서 이동하는게 아니라
서버에서 url을 참조한다. 즉, 이런 방식으로 클라이언트는 화면 깜빡임 없이 데이터를 받아올 수 있는 것