basic/Node.js

[Node.js] Ajax

ekgoddldi 2020. 10. 30. 18:26

//요청 보내기

document.querySelector('.ajaxsend').addEventListener('click',function(){

var inputdata = document.forms[0].elements[0].value;

sendAjax('http://127.0.0.1:3000/ajax_send_something', inputdata);

})

 

//요청 처리

app.post('/ajax_send_something',function(req,res){

var responseData = {'result':'ok','something':req.body.something};

res.json(responseData);

});

 

//요청 받기

function sendAjax(url,data){

var data = {'something' : data};

data = JSON.stringify(data);

 

var xhr = new XMLHttpRequest();

xhr.open ('POST', url);

xhr.setRequestHeader('Content-Type', "application/json"); //서버로 보낼때 json형태로 온다고 명시

xhr.send(data);

 

xhr.addEventListener('load',function(){  //로드 되면 출력하는 함수

var result = JSON.parse(xhr.responseText);

document.querySelector(".result").innerHTML = result.something

})

 

// parse 메소드는 string 객체를 json 객체로 변환시켜줍니다.

// stringify 메소드는 json 객체를 String 객체로 변환시켜 줍니다.

 

}

 

 

Same-orgin policy 로 Ajax안될 경우 Express해결법 ==> cors모듈 설치

 1. npm install --save cors

 

2. app.js에 const cors = require('cors');를 추가해준다.

 

3. app.js에서 아래부분에 app.use(cors());를 추가해준다.