프로그래밍 공부/Ajax (5) 썸네일형 리스트형 Ajax - GET, POST, PUT, DELETE 요청과 응답 데이터 주고 받기 이전에 GET, POST, PUT, DELETE 요청과 응답에 대해서 알아보았고, 이번에 알아볼 내용은 직접 데이터를 주고 받는 방법에 대한 내용이다. POST 요청으로 직접 데이터에 접근해 데이터 객체를 삽입하고 적용시키는 방법이기도 하다. 먼저 Node.js에 body-parser 미들웨어를 설치해야한다. 간단하게 터미널이나 명령 프롬프트에 npm install body-parer를 입력하면 설치 할 수 있다. 1 2 const bodyParser = require('body-parser') app.use(bodyParser.urlencoded({ extended: false })) cs 자바스크립트 코드에 위의 코드를 추가해 주어야 한다. 코드를 추가하면 HTML 파일로 넘어가 POST 요청과 아래.. Ajax - GET, POST, PUT, DELETE 요청과 응답 RESTful이라는 규약이 있다. 이것은 GET, POST, PUT, DELETE에 관련된 것이다. 1. GET - /data : 모든 데이터를 요청한다. 2. POST - /date : 데이터를 추가한다. 3. PUT - /data : 데이터를 모두 수정한다. 4. DELETE - /data : 데이터를 모두 제거한다. 그리고 데이터들은 아래와 같은 형태를 가지고 있다. 배열 안에 객체의 형태를 가지고 있다는 것을 알 수 있다. 따라서 아래와 같은 형태도 가능하다. 1. GET - /data/n : n번째 데이터를 요청한다. 2. POST - 불가능 3. PUT - /data/n : n번째 데이터를 수정한다. 4. DELETE - /data/n : n번째 데이터를 제거한다. 위의 PUT - /data와.. Ajax - jQuery로 GET 요청하기 jQuery 라이브러리가 제공하는 Ajax 관련 메서드를 활용하여 데이터를 가져오는 방법에 대한 내용이다. 먼저 jQuery가 제공하는 Ajax 관련 메서드는 아래와 같다. 메서드 이름 설명 $.ajax() 범용적인 Ajax 관련 메서드이다. $.get() get 방식으로 Ajax를 실행한다. $.post() post 방식으로 Ajax를 실행한다. $.getJSON() get 방식으로 Ajax를 실행해 JSON 데이터를 가져온다. $.getScript() get 방식으로 Ajax를 실행해 Script 데이터를 가져온다. $().load() Ajax를 수행하고 선택자로 선택한 문서 객체 안에 집어넣는다. $().serialize() 입력 양식의 내용을 요청 매개변수 문자열로 만든다. $().serializ.. Ajax - express로 GET 요청 서버 만들기 미들웨어 이전에 사용한 app.use() 메서드에 입력하는 콜백 함수는 request 이벤트 리스너이다. request 이벤트 리스너는 다음과 같은 형태로 사용자가 서버에 접속하면 자동으로 실행된다. app.use(function (request, response, next) { }); app.use() 메서드는 여러 번 사용할 수 있다. 이때 매개변수 next는 다음 콜백 함수를 의미한다. const express = require('express') const app = express(); app.use(function (request, response, next) { consele.log('First'); next(); }); app.use(function (request, response, nex.. Ajax - Ajax 개요 및 Node.js 기본 Ajax는 자바스크립트처럼 특정한 프로그래밍 언어를 말하는 것이 아니다, 또한 jQuery와 같은 특정한 프레임워크를 지칭하는 것도 아니다. Ajax는 구현하는 방식을 말한다. 예를 들어 포털 사이트에 로그인을할 때 아이디와 비밀번호를 입력을 하고 로그인 버튼을 누르면 데이터가 서버로 전송이 된다. 서버에서는 아이디와 비밀번호가 일치하는지 확인하고 일치한다면 로그인이 된 페이지를 출력하고 일치하지 않는다면 재입력을 요구하는 페이지를 출력한다. 모바일에서는 페이지가 전환되는 1~2초동안 페이지가 정지가 된다. Ajax를 사용하면 페이지를 전환하지 않고 서버에서 데이터를 받아와 사용자에게 보여줄 수 있다. SNS(트위터, 페이스북 등)에서도 사용을 한다. 개발자 입장에서는 Ajax를 사용하는 것은 귀찮은 일.. 이전 1 다음
