반응형

Programming/Javascript 15

Javascript Cookie 쿠키 저장, 가져오기, 삭제 함수

쿠키(Cookie) 개념, 본격적으로 코드를 보기 전에 쿠키(Cookie)의 개념부터 간단하게 살펴보면, HTTP 쿠키는 웹 브라우저(web browser)에 저장되는 4KB 크기를 가진 문자열입니다. 기본적으로 HTTP 프로토콜은 각각의 요청을 독립적인 트랜잭션으로 취급하는 통신 프로토콜로 '무상태(Stateless) 프로토콜' 이라고도 불리는데요. 이때 쿠키는 제한적이긴 하지만 브라우저와 서버 간에 지속적으로 유지할 수 있는 데이터를 제공하는데, 이것이 HTTP 프로토콜에서 상태 관리의 개념으로 볼 수 있습니다. 하나의 예로, 쿠키는 서버에서 받은 로그인 토큰 정보를 웹 브라우저에 저장하고, 다시 서버에 요청을 할 때, 그 정보를 서버에 보냄으로써 사용자를 식별할 수 있게 하는 역할을 합니다. 쿠키를..

구글맵 google map API 사용법 및 marker 추가, 변경하는 법 (JavaScript)

구글맵 google map API를 사용하는 방법 및 marker를 추가하고 변경하는 작업을 알아보겠습니다. (사용할 API는 'Maps JavaScript API'입니다.) 진행 과정은 먼저 Google Cloud Platform에서 'Maps JavaScript API' 라이브러리 사용 설정 및 API 키 발급받는 과정 이후 실제 html에 구글맵 API를 사용하는 코드를 적용해보겠습니다. 'Google Cloud Platform 설정' (Google Cloud Platform에 Project가 등록되어있다는 가정하에 진행됩니다.) Google Cloud Platform -> API 및 서비스 -> 라이브러리 -> Maps JavaScript API => 'Maps JavaScript API' 사용 ..

비동기 통신 Ajax 개념 (Asynchronous Javascript And Xml)

비동기 통신 Ajax 개념 (Asynchronus Javascript And Xml) ajax는 javascript의 라이브러리로, 클라이언트와 서버 간에 XML 데이터를 주고받는 비동기 통신입니다. (reload 없이 데이터를 불러오는 방식) HTTP 프로토콜은 클라이언트와 서버 사이에서 Request를 보내고, Response를 받으면 연결이 끊어지는 무상태성(stateless)를 가지고 있습니다. 그래서 화면의 내용을 갱신하기 위해서는 다시 request를 보내고 response를 받아 전체 페이지를 갱신해야 합니다. 그렇기 때문에 페이지에서 작은 부분을 갱신하기 위해 전체 페이지를 다시 리로드 하는 자원과 시간이 낭비되는 상황이 생깁니다. 이때 ajax를 사용하면 XMLHttpRequest 객체를..

TransactionRequiredException: Executing an update/delete query 오류의 해결 방법은 @Transaction

Executing an update/delete query Error Springboot, JPA 를 사용한 프로젝트 개발 중 발생한 에러입니다. FAQ 카테고리를 삭제하면 해당 카테고리에 속하는 FAQ들을 모두 삭제시키는 경우에서 발생했습니다. (삭제라고는 하지만 실제로는 useAt 필드 값을 통해 삭제 여부를 변경 즉, update 하는 로직입니다.) 정상적으로 FAQ Category 삭제 요청이 들어왔을 때 해당 FAQ Category의 useAt 값을 바꾸고, categoryIdx를 통해 해당 카테고리에 속하는 모든 faq의 상태값을 삭제 된 것으로 바꾸는 과정에서 아래와 같이 JPA를 사용한 void method로 update를 실행했습니다. @Override public void deleteA..

input type=datetime-local 최솟값 min, 현재값 value 적용하는 방법

프로젝트 중 input을 통해 날짜 외 시간도 함께 받아 오는 것이 필요하여 input type="datetime-loacl"을 사용하였습니다. 그 과정에서 사용한 최솟값 min 설정, 현재값 value 설정 방법에 대해서 알아보겠습니다. min, value를 설정하기 위해서는 YYYY-MM-DDTHH:mm:ss 형식의 시간이 필요합니다. Javascript의 날짜와 시간은 Date 객체로 표현할 수 있는데요. let nowDate = new Date(); console.log('nowDate : ' + nowDate); // nowDate : Sun Aug 08 2021 11:22:13 GMT+0900 (한국 표준시) let toISOStringDate = new Date().toISOString();..

반응형