초코레

Spring 톰캣과 Vue.js dev 서버를 따로 띄워놓고 개발하다가 주소B(Vue.js 포트)로부터 주소A(Spring 포트)에 요청시 발생 Same Origin / Cross Origin Policy 때문에 보안상 다른 Origin에 요청한 것들은 기본적으로 차단된다. 그렇기 때문에 CORS(Cross Origin Resource Sharing)라는 것이 있으며, 다른 Origin의 데이터를 읽고 싶다면 CORS 표준을 지켜서 응답에 허용해달라고 알려줘야 한다. 응답하는 서버 쪽에 허용할 Origin을 Access-Control-Allow-Origin 응답 헤더에 넣어주면 되나 Spring의 경우 설정 파일에 추가 설정을 해주면 된다. "Access-Control-Allow-Origin": 사이트명..

앞단에서 리스트와 다른 파라미터를 함께 넘기면 1 2 3 4 5 6 7 8 9 10 var list = [{name: '홍길동', number: 1}, {name: '김철수', number: 2}]; $.ajax({ type: 'POST', url: '/url', data: {list: JSON.stringify(list), flag: 'Y'}, success: function(res){ } }); Colored by Color Scripter cs 이 경우 컨트롤러에서 파라미터 타입을 Map으로 받고 String 형태의 json을 List로 변환한다. 1 2 3 4 5 6 7 8 9 import com.fasterxml.jackson.databind.ObjectMapper; import com.fast..

백단에서 StringBuffer로 만든 html의 한글이 view 단으로 넘어올 때 한글이 깨져서 나온다. 컨트롤러의 매핑 정보에 produces를 다음과 같이 추가해주면 된다. 1 @PostMapping(value = "/url", produces = "application/text;charset=utf8") cs

MySQL에서 where 절에서 pk가 아닌 다른 컬럼 값을 기준으로 update나 delete를 수행할 때 나타나는 오류 이를 막지않도록 설정을 변경해주면 된다 쿼리 구문에서 다음 문장을 실행한다 1 SET SQL_SAFE_UPDATES = 0; cs MySQL의 Workbench에서 메뉴 Edit > Preferences 를 실행 후, SQL Editor 탭에서 Safe Updates 항목의 체크를 해제한다

Spring Security를 이용 중 Ajax의 POST 호출 시 403 Forbidden 에러가 발생 아마 설정 중 csrf 관련 문제인 것 같았다 그렇다면 csrf가 enabled 상태에서 403 Forbidden 에러나지 않으려면? 구글링 결과 아래와 같이 html의 head 태그 내에 csrf meta tag를 추가해준다 1 2 cs 그리고 ajax 호출 시 xhr에 header와 token을 설정해주면 된다 1 2 3 4 5 6 7 8 9 10 11 12 var header = $("meta[name='_csrf_header']").attr('content'); var token = $("meta[name='_csrf']").attr('content'); $.ajax({ url: url, be..

로그가 두 번씩 올라오는 게 영 신경쓰여...생각해보니 요청을 두 번 거치는 문제일까 싶어 검색했다 스택오버플로에 비슷한 글이 있어 설정 문젠가 싶어 과 태그를 둘 다 등록한 상태라 따로 사용해보기도 했지만 아닌 것 같아 실패! 결국 원인은 생각지도 못한 view에서 찾았다 okky에서도 비슷한 문제로 href나 src의 값이 없으면 컨트롤러를 두 번 탄다는 문제였었지만 내 원인은 view의 layout에 있는 태그에 빈 값이 걸려있으면 두 번 돌아가는 것이었다... 대충 UI 템플릿을 따와서 하다보니 이런 문제가...

파일업로드 Ajax 방식은 브라우저에서 지원하는 클래스인 FormData를 이용하는 것 FormData는 처럼 key/value가 저장되어 데이터를 처리할 수 있다. 1 2 3 4 5 6 7 8 9 10 11 12 13 var data = new FormData(); data.append('file', file); $.ajax({ data: data, type: 'post', url: '/url', dataType: 'text', contentType: false, processData: false, success: function(res) { } }); cs ForData에 파일 정보를 append()를 통해 key/value 형식으로 넣는다. dataType : 보내는 데이터 타입이 아니라 서버가 응..

$(document).ready(function(){ }); $(function(){ }); 둘은 같은 구문 jQuery에서 많이 사용되기 때문에 축양형인 두번째 구문을 제공한다. 페이지 로딩이 끝났을 때 실행될 함수를 등록하는 곳을 의미 (function(){ })(); 퓨어 자바스크립트에서 항상 사용하는 것 즉시 실행 함수 표현(IIFE, Immediately Invoked Function Expression) 이 안의 코드를 하나의 스코프에 담고 바로 실행한다 참고 (function() { })() 의 의미는? 자바스크립트에서 이런 구문을 보신 적이 있으신가요? (function() { // 코드 })(); 제가 처음 이런 구문을 봤을 적엔 의아스러웠습니다. 괄호가 여기저기 겹쳐 붙어 있는 걸로 보..

스프링으로 DB 연동 설정 및 MyBatis 연동 설정 후 JUnit4로 연동 테스트 시 발생한 내용이다. com.mysql.jdbc.exceptions.jdbc4.MySQLNonTransientConnectionException: Could not create connection to database server. 해결 결과 DB에 붙지 못하는 문제로 원인은 mysql 버전과 Spring이 붙지 못한 것 mysql은 8버전을 사용했으며 이 최신 버전은 스크립트 방식으로 처음 만든 방식이기 때문에 드라이버를 확인해야 함 pom.xml에서 mysql-connector-java 버전을 로컬에 설치한 mysql 서버 버전과 동일한지 확인 mysql 5.7 버전까지는 driverClassName을 com.mys..

Maven 프로젝트 생성 packaging은 war로 설정 생성된 프로젝트에서 다음의 디렉토리를 확인할 수 있다. 기본적으로 생성되지 않으면 직접 생성해주면 된다. /src/main/java : 자바 소스 코드 /src/main/resources : 프로퍼티나 MXL 등의 리소스 파일. 클래스패스에 포함됨. /src/main/webapp : 웹 어플리케이션 관련 파일 (WEB-INF 디렉로리, jsp 파일 등) /src/test/java : 테스트 자바 소스 파일 /src/test/resources : 테스트 과정에서 사용되는 리소스 파일 루트 디렉토리에 pom.xml 파일을 생성하여 다음의 기본적인 메이븐 설정을 한다. javax.servlet.jsp jsp-api 2.2 provided javax.s..