●GSON
JSON구조의 데이터를 Java의 객체로 변환해주는 자바 라이브러리
○실습
WebtoonDTO.java
public class WebtoonDTO {
// 작가
String writer;
// 제목
String title;
// 연재요일
String day;
public WebtoonDTO(String writer, String title, String day) {
this.writer = writer;
this.title = title;
this.day = day;
}
}
WebDB.java
import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.google.gson.Gson;
@WebServlet("/WebDB")
public class WebDB extends HttpServlet {
protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// 네이버 웹툰 서버 데이터베이스
System.out.println("왔따");
// 임의의 네이버 웹툰 정보 DB를 생성
// 작가, 제목, 연재요일 --> 네이버 웹툰 정보
// 웹툰 3개의 객체 만들어 주기
WebtoonDTO w1 = new WebtoonDTO("전선욱","프리드로우","토요일");
WebtoonDTO w2 = new WebtoonDTO("박용제","갓오브하이스쿨","금요일");
WebtoonDTO w3 = new WebtoonDTO("영파카","평범한 8반","월요일");
ArrayList<WebtoonDTO> webList = new ArrayList<WebtoonDTO>();
webList.add(w1);
webList.add(w2);
webList.add(w3);
// 데이터가 현재 주소값을 가지고 있으니 -> json 형태로 만들어서 응답해주겠습니다
// Gson --> 데이터를 json 타입으로 바꿔주는 역할을 하는 객체(Google에서 지원해주는 라이브러리)
// Json --> key와 value로 이루어진 데이터 형식
Gson gson = new Gson();
// webList에 있는 데이터들이 자동으로 json형식으로 변환
// gson 라이브러리를 통해서 json 형태로 만들면 key값은 자동으로 클래스의 필드명으로 정해진다.
Object json = gson.toJson(webList);
// 응답하는 객체가 만들어지기 전ㅇ 인코딩을 해줘야한다.
response.setContentType("text/plain; charset = utf-8");
PrintWriter out = response.getWriter();
out.print(json);
}
}
웹툰정보출력.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="jquery-3.6.0.min.js"></script>
</head>
<body>
<h1>웹툰 정보 출력</h1>
<table id="start" border="1">
<tr>
<td>제목</td>
<td>작가</td>
<td>연재일</td>
</tr>
</table>
<button>웹툰정보가져오기</button>
<script type="text/javascript">
// 버튼클릭시
$("button").on(
"click",
function() {
$.ajax({
url : "WebDB",
// ajax는 데이터를 넘겨 받을 때 넘겨받는 데이터 타입을 명시해주지 않는다면
// ---> 문자열 타입으로 인식한다.
// 넘겨 받는 데이터는 무조건! json 형식으로 인식할거에요!
// 넘겨 받는 데이터는 json타입 이어야만 합니다.
dataType : "json",
success : function(result) {
alert("성공");
console.log(result);
console.log(result[0].title);
// 받아온 데이터를 테이블에 추가 시켜주세요
for (let i = 0; i < result.length; i++) {
let writer = result[i].writer;
let title = result[i].title;
let day = result[i].day;
$("#start").append(
"<tr>" + "<td>" + title + "</td>"
+ "<td>" + writer + "</td>"
+ "<td>" + day + "</td>"
+ "</tr>");
}
},
error : function() {
alert("실패");
}
})
});
// 네이버 웹툰 서버 데이터베이스와 ajax를 이용해서 통신해주세요!
</script>
</body>
</html>
코딩공부