본문 바로가기

Backend

 (57)
ajax 기초 개념 및 사용법 jQuery의 ajax : 파라미터들을 오브젝트 형식으로 받음 type : http method (get/post) url : 데이터를 받아올 페이지 (입력한 url 경로의 파일(url 매핑 이름)로부터 요청한 데이터를 불러옴) data : 요청 시에 함께 보낼 파라미터들 {"id": $('#user_id').val(), "pw": $('#user_pw').val()} /* 컨트롤러에서 받을 때 : id, pw로 받음*/) dataType : 받아올 데이터의 형식 (생략 가능) (html, json, xml, text 등 가능) success : 성공 시에 수행할 핸들러 errer : 실패 시에 수행할 핸들러 serialize() 폼에 입력된 값을 쿼리 스트링 방식의 데이터로 변환하여 액션 페이지에 전송..
백엔드 샘플 프로젝트 보호되어 있는 글입니다.
@RestController 이용한 REST 기능 구현 @Controller vs @RestController @Controller : 결과를 뷰 페이지(.jsp) 이름 반환 @RestController 별도의 뷰를 제공하지 않은 채 데이터 반환 @ResponseBody와 기능 동일 (메소드에서 처리) 클래스에 붙임 @RestController 예제 : 상품 검색 기능 index.jsp 내용 추가 @RestController 연습 상품 검색 3 productSearchForm3.jsp 상품 검색 검색 조건 선택 상품명 제조회사 productSearch3.js /** * productSearch3.js 상품 검색 */ $(document).ready(function(){ $('#prdSearchFrm3').on('submit', function(){ event..
Spring Boot 파일 업로드 및 다운로드 파일 업로드 MultipartFile 클래스 사용 의존성 필요 없음 application.properties 파일에서 파일 최대 크기만 설정 자동으로 MultipartConfigElement 클래스를 빈으로 등록 파일명 중복되지 않도록 UUID 사용 소프트웨어 구축에 사용되는 식별자 표준 16 옥텟(128바이트)의 수 표준 형식에서 UUID는 32개의 16진수로 표현되며 총36개 문자(32개 문자와 4개의 하이픈)로 된 8-4-4-4-12라는 5개의 그룹을 하이픈으로 구분 ex) 8e1a2153-edf-344d-dddd-... 자바 UUID 클래스의 randomUUID() 메소드를 사용하여 유일한 식별자 생성 파일 업로드 / 다운로드 예제 index.jsp 추가 파일 업로드 파일 다운로드 파일 업로드 예..
스프링 부트 (Spring Boot) 스프링 부트 (Spring Boot) 스프링 프레임워크를 사용하는 프로젝트를 아주 간편하게 설정할 수 있는 스프링 프레임워크의 서브프로젝트 스프링 프레임워크 -> 톰캣 설치 등 여러 가지 복잡한 설정 필요 스프링 부트 특징 XML 기반 설정 과정 없이 간단히 프로젝트 시작 가능 메이블의 pom.xml 파일에 의존성 라이브러리의 버전을 일일이 지정하지 않아도 됨 (스프링 부트가 권장 버전 관리) 단독 실행되는 스프링 애플리케이션 구현 가능 프로젝트 환경 구축에 필요한 서버 외적인 툴 내장되어 있어서 별도 설치 필요 없음 (톰캣 내장 되어 있음) STS4 설치 스프링 부트 전용 다른 프로젝트 생성 시 추가 설치 필요 스프링 부트 프로젝트 생성 시 자동 생성되는 파일 프로젝트명Application.java @..
[예제] 상품번호 중복 체크 | 상품 검색 | 도서 관리 프로젝트 예제 1 : 상품 등록 시 상품번호 중복 체크 newProductForm.jsp : 상품등록 화면에 상품번호 입력란 옆에 [중복확인] 버튼 추가 상품 등록 상품 번호중복확인 상품명 가격 제조회사 재고 prdNocheck.js : result 결과(no_use)에 따라 alert() 출력 /** * prdNocheck.js */ $(document).ready(function(){ $('#prdNoCheckBtn').on('click', function(){ event.preventDefault(); $.ajax({ type:"post", url:"prdNoCheck", data:{"prdNo":$('#prdNo').val()}, success:function(result){ if(result=="no_u..
Ajax (Asynchronous JavaScript and XML) Ajax (Asynchronous JavaScript and XML) 클라이언트에서 비동기 방식으로 자바스크립트를 이용하여 화면 전환 없이 서버 측에 데이터를 요청하고 응답 받을 때 사용 HTML, XML, JSON, 텍스트 등의 데이터 처리 가능 웹서버 환경에서 실행 Ajax 주요 메소드 $.ajax() 데이터를 서버에 HTTP POST, GET 방식으로 전송 가능 HTML, XML, JSON, 텍스트 유형의 데이터를 요청할 수 있는 통합적인 메소드 $.get(), $.post(), $.getJSON() 메소드의 기능을 하나로 합쳐 놓은 기능 지정한 url 경로에 있는 파일(url 매핑 이름)의 데이터 전송 & 입력한 url 경로의 파일(url 매핑 이름)로부터 요청한 데이터를 불러옴 serialize..
Synchronous(동기식) / Asynchronous(비동기식) 통신 Synchronous(동기식) 통신 Request 보낸 후 Request에 대한 Response를 받아서 두 두 통신 간의 트랜잭션을 맞추는 통신 방식 Request를 보낸 Thread는 Response가 도착하기 전까지는 다른 일 처리하지 못하고 Block 상태로 Response 요청과 응답 값의 순서를 보장하고, 보낸 Request에 대한 처리 결과 값을 보장 받을 수 있기 때문에 Response에 대한 처리 결과를 보장받고 처리해야 되는 서비스에 적합 신뢰성 보장 Asynchronous(비동기식) 통신 Request를 보내고 Request에 대한 Response를 받지 않고도 다른 일 처리가 가능한 통신 방식 따라서 처리 속도가 빠름 Response에 대한 처리 결과를 보장받고 처리해야 되는 서비스..
REST 브라우저에서 페이지 요청 시 PC : 페이지 전체를 다시 전송해서 표시해도 문제 없음 모바일 기기 (스마트폰 등) : 기존 화면은 그대로 유지하면서 필요한 내용만 추가해서 화면에 표시 모바일 기기가 유선 기기보다 네트워크 전송량 떨어짐 -> 현재 화면은 그대로 유지하면서 필요한 데이터만 전송 받아 빠르게 표시하기 위해 사용 ex) Ajax 데이터만 전송하는 기능의 표준화 필요성이 대두 -> REST 방식이 대안으로 사용됨 REST (Representational State Transfer) URI가 고유한 리소스를 처리하는 공통 방식 ex) /board/112로 요청할 경우 -> 게시글 112번째 글만 응답 처리 REST 방식으로 제공되는 API를 REST API(또는 RESTful API)라고 함 트위..

티스토리툴바