반응형 개발220 [NodeJS] AJAX 처리 AJAX 처리 전체 페이지가 아닌 부분적인 영역에 대한 새로고침을 위해 AJAX가 사용된다.이 때문에 최신 웹페이지에는 AJAX에 대한 중요성이 점점 증가 하고 있다. AJAX에 대한 기능 구현을 예제로 살펴보도록 하자 1ajaxsend cs 먼저 앞서 만들어 두었던 form.html 파일에 button을 추가해준다. 12345document.querySelector('.ajaxsend').addEventListener("click",function(){ var inputdata = document.forms[0].elements[0].value; sendAjax('http://127.0.0.1:3000/ajax_send_email', inputdata); }) Colored by Color Script.. 2017. 4. 18. [NodeJS] 템플릿 템플릿 res.send만으로 html 응답을 주려면 너무 많은 값들이 들어간다.따라서 템플릿 엔진을 이용하여 보다 복잡한 html 응답을 한다. 템플릿에는 jade, ejs 등 다양한 종류가 있는데우선 ejs의 사용법에 대해 알아보자 우선 ejs 템플릿 엔진을 사용하기 위해서 npm에서 ejs를 설치해준다. 1app.set('view engine', 'ejs'); cs 따로 변수에 저장할 필요없이 app.set으로 ejs를 사용한다고 명시해준다 다른 템플릿을 사용한다면 ejs 위치에 해당 템플릿의 이름을 입력한다. 12345678910111213141516 MY APP h1{ text-align: center; margin-top: 10rem; } welcome Colored by Color Script.. 2017. 4. 18. [NodeJS] POST 요청 받기/응답 POST 요청 받기/응답 1234 email: 보내기:Colored by Color Scriptercs get은 데이터를 보낼때 길이에 제한이 있고, 보안에 취약하다는 단점이있다따라서 public/form.html의 코드 중 method를 post로 변경해보자. post 방식은 get과 다르게 url에 데이터가 전송되지않으므로req.param으로 데이터를 가져올 수 없다.따라서 body-parser를 사용해야하는데, express 와 마찬가지로 npm에서 제공하는 모듈이므로 install --save하여 설치해준다. 123var bodyParser = require('body-parser'); app.use(bodyParser.json());app.use(bodyParser.urlencoded({exte.. 2017. 4. 18. [NodeJS] GET 요청 받기/응답 Get 요청 받기/응답 123456789101112131415 this is form html email: 보내기: Colored by Color Scriptercs 우선 get 요청하는 form을 만들어 보자public 폴더 안에 다음과 같은 form.html을 만들어 준다. 잘 생성이 되었는지 localhost:3000/form.html에 접근하여 확인한다. 1234app.get('/send_email', function(req,res){ console.log("email :", req.param('email')); }); Colored by Color Scriptercs html에서 action을 /send_email로 설정했으므로 Path도 동일하게 설정한다.이때 get방식은 url과 함께 데이터.. 2017. 4. 18. 이전 1 ··· 42 43 44 45 46 47 48 ··· 55 다음 반응형
