나눔코딩
-
01. 시큐리티 - HTTP Only 와 Secure Cookie
01. 시큐리티 - HTTP Only 와 Secure Cookie
2021.09.27개념 브라우저(크롬, 사파리)에서 request(요청) GET 또는 POST 하게 되는 경우 모든 쿠키들이 서버에 넘어가 사용자를 체크합니다 오래전 부터 쿠키를 사용하고 있어 많은 사이트 대부분이 쿠키를 통해 사용자 식별정보를 쿠키에 저장하며, 쿠키에 저장된 정보를 통해 각 사용자를 구별사용자 인증을 진행합니다 인증을 계속 체크하는 이유는 HTTP 프로토콜이 Stateless (무상태성) 이기에 요청한 사람의 상태정보를 계속 갖고 있지 않고 연결이 끊어지기 때문에 다음 요청 시, 누구인지, 이전에 요청한 같은 사람인지, 해커인지 알 수 없습니다 이렇게 쿠키를 통해 인증을 하기 때문에 민감한 정보들이 쿠키에 담겨져 있는 데, 해커들은 다양한 방법으로 이 쿠키를 탈취하고자 합니다. 이러한 쿠키에 대한 보안 .. -
17. 인텔리제이 (IntelliJ IDEA) - 모듈 추가하기 (=멀티 프로젝트)
17. 인텔리제이 (IntelliJ IDEA) - 모듈 추가하기 (=멀티 프로젝트)
2021.03.05OS Windows 10 Home 64bit 버전 2004 (OS 빌드 19041.630) IntelliJ IDEA 2020.1.3 ctrl+alt+shift+s 를 눌러 Modules 로 간 뒤 + 버튼을 눌러 'New Module'=새모듈추가, 'Import Module'=기존모듈추가 중 택하여 모듈을 추가한다 모듈을 여러개 추가할 수 있으며, 파이썬, 스프링, vue 등 여러개 모듈을 한 프로젝트 안에서 관리할 수 있을 수 있다 왼쪽 메뉴를 보면 작은 파란색 직사각형 표시가 모듈이라는 의미이다 -
Spring Mybatis SQL Injection
Spring Mybatis SQL Injection
2021.10.16MyBatis 바인딩 기법 MyBatis 에서는 #{} 바인딩과 ${} 바인딩이 있다 #{} 바인딩은 바인딩 값을 "" 로 감싸주어 바인딩을 해준다 [GET] http://localhost:8080/members?name=root@gmail.com [SQL] select * from email = "root@gmail.com" ${} 바인딩은 "" 없이 바로 바인딩을 해준다 [GET] http://localhost:8080/members?name=root@gmail.com [SQL] select * from email = root@gmail.com 위와 같이하면 "" 로 감싸지않아 쿼리문이 날라가게 되어 오류가 발생한다 따라서 ${} 이용해서 요청하려면 아래와 같이 해야 한다 [GET] http://lo.. -
09. Vue 2 - vuedraggable 2.24
09. Vue 2 - vuedraggable 2.24
2020.09.24OS Windows 10 Home 64bit 버전 1903 (OS 빌드 18362.836) Vue 2.5.13 # 공식 깃 허브 SortableJS/Vue.Draggable Vue drag-and-drop component based on Sortable.js. Contribute to SortableJS/Vue.Draggable development by creating an account on GitHub. github.com -- web demo vuedraggable sortablejs.github.io -- full demo David-Desmaisons/draggable-example vue.draggable example. Contribute to David-Desmaisons/draggab..
최근 올라온 글
-
스프링 부트 MVC - Handler Interceptor
스프링 부트 MVC - Handler Interceptor
2022.04.14OS Windows 10 PRO 64bit 버전 20H2 (OS 빌드 19042.867) Framework Spring Boot 2.6.6 EditTool Inellij IDEA 2020.1.3 BuildTool Maven 구조 HanlderInterceptor preHandle 컨트롤러 실행 전 수행한다. 반환 값이 true일 경우 컨트롤러로 진입하고 false일 경우 진입하지 않는다. Object handler는 진입하려는 컨트롤러의 클래스 객체가 담겨있다 postHandle 컨트롤러 실행 후 View가 랜더링 되기 전에 수행한다. afterCompletion 컨트롤러 실행되고 view가 랜더링 된 후에 실행된다. afterConcurrentHandlingStarted 비동기 요청 시 PostHand.. -
36. 인텔리제이 (IntelliJ IDEA) - 현재 라인 깃허브로 열기
36. 인텔리제이 (IntelliJ IDEA) - 현재 라인 깃허브로 열기
2022.01.11OS Windows 10 PRO 64bit 버전 20H2 (OS 빌드 19042.867) IntelliJ IDEA 2020.3.1 깃 허브에서 원하는 코드부분을 링크로 달고 싶을 때, 이 방법을 이용하면 빠르게 할 수 있다 (깃 허브 주소 복사하면 해당 라인으로 커서가 옮겨져있다) -
20. Vue2 - 유효성 검사 모듈 Vee Validation ^3.4.11
20. Vue2 - 유효성 검사 모듈 Vee Validation ^3.4.11
2021.11.16OS Windows 10 PRO 64bit 버전 20H2 (OS 빌드 19042.867) Vue 2.5.13 Vee Validation ^3.4.11 공식 홈 https://vee-validate.logaretm.com/v4/v4/guide/global-validators#defining-global-validators 모듈 설치 npm install vee-validate@3.4.11 Vue 전역 컴포넌트로 등록 + extend 활용 vee-validation.js import Vue from 'vue'; import { extend, ValidationObserver, ValidationProvider } from 'vee-validate'; import { required, digits, numer.. -
vue 정리 하기
vue 정리 하기
2021.11.12AuthorizePage router.beforeEach((to, from, next) => { const auth = to.meta?.auth || false const email = store.state.me?.email || '' if (auth && email !== 'admin@gmail.com') return next({ path: '/402', params: { id: 3 }, // query: { message: '402 접근이 제한된 페이지 입니다' }, }) next() }) -
01. 기술면접 - 스프링 - 스프링 프레임워크
01. 기술면접 - 스프링 - 스프링 프레임워크
2021.10.25공부목적으로 다른 블로그의 글을 그대로 따라치면서 작성되었습니다. 저작권 문제 시, 비공개 처리하겠습니다 스프링 프레임워크란 - 자바 엔터프라이즈 개발을 편하게 해주는 경량급 오픈소스 애플리케이션 프레임워크 - Lightweight Java Application Framework - 목표: POJO 기반의 Enterprise Application 개발을 쉽고 편하게 할 수 있도록 한다 - Java Application 을 개발하는 데 필요한 하부구조(Infrastructure)를 포괄적으로 제공한다 - Spring 이 하부구조를 처리하기 때문에 개발자는 Application 개발에 집중 할 수 있다 - 간단히 스프링 (Spring) 이라고도 불린다 - 동적인 웹 사이트를 개발하기 위한 여러가지 서비스를 .. -
11. 기술면접 - 자바스크립트 - this
11. 기술면접 - 자바스크립트 - this
2021.10.25공부목적으로 다른 블로그의 글을 그대로 따라치면서 작성되었습니다. 저작권 문제 시, 비공개 처리하겠습니다 실행 컨텍스트(Execution Context) 실행컨텍스는 scope, hosting, this, function, closure 등의 동작원리를 담고 있는 자바스크립트의 핵심원리이다 ECMAScript 스펙에 따르면 실행 컨텍스트를 실행 가능한 코드를 형상화하고 구분하는 추상적인 개념이라고 정의한다 좀 더 쉽게 말하자면 실행 컨텍스트는 실행 가능한 코드가 실행되기 이해 필요한 환경이라고 말할 수 있다 여기서 말하는 실행 가능한 코드는 아래와 같다 - 전역 코드 : 전역 영역에 존재하는 코드 - Eval 코드 : eval 함수로 실행되는 코드 - 함수 코드 : 함수 내에 존재하는 코드 일반적으로 실.. -
10. 기술면접 - 자바스크립트 - 클로저 (Closure)
10. 기술면접 - 자바스크립트 - 클로저 (Closure)
2021.10.22본 내용은 공부목적으로 MDN 문서를 보며 따라친 내용입니다 들어가기 앞 서 클로저는 함수와 함수가 선언된 어휘적 환경의 조합이다. 클로저를 이해하려면 자바스크립트가 어떻게 변수의 유효범위를 지정하는 지 렉시컬 스코프(Lexical Scoping) 을 이해 해야 한다 렉시컬 스코프 (Lexical Scoping) function init() { var name = "Mozilia"; // name은 init 에 의해 생성된 지역 변수 이다 function displayName() { // displayName() 은 내부 함수 이며, 클로저이다 alert(name); // 부모함수에서 선언된 변수를 사용한다 } displayName(); } init(); - init() 은 지역변수 name 과 함수 d.. -
09. 기술면접 - 자바스크립트 - 호이스팅 (Hoisting)
09. 기술면접 - 자바스크립트 - 호이스팅 (Hoisting)
2021.10.22공부목적으로 다른 블로그의 글을 그대로 따라치면서 작성되었습니다. 저작권 문제 시, 비공개 처리하겠습니다 호이스팅 (Hosting) - Hosting(끌어 올리다) 이란 선언한 함수와 변수를 해석기가 가장 상단에 있는 것 처럼 인식한다 - JS 해석기는 코드의 라인 순서와 관계 없이 함수 선언식(함수 표현식 X)과 변수를 위한 메모리 공간을 먼저 확보 - 따라서, function a() 와 var 는 코드의 최상단으로 끌어 올려진 것 (hostied) 처럼 보인다 function a() { return 10; } a(); // 5 function a() { return 5; } 순서대로 동작했다면 a 는 10이 출력되어야 하는 데, 해석기가 함수실행보다 선언을 먼저 인식하기 때문에 a는 재정의 되어서 5.. -
07. 기술면접 - 자바스크립트 - 구조 분해 할당 (Destructuring)
07. 기술면접 - 자바스크립트 - 구조 분해 할당 (Destructuring)
2021.10.22공부목적으로 다른 블로그의 글을 그대로 따라치면서 작성되었습니다. 저작권 문제 시, 비공개 처리하겠습니다 개념 속성을 분해하여 원하는 속성만 변수로 담을 수 있다 객체 구조분해 (Object Destructuring) const A = { a: 1, b: 2 } const {a,b} = A console.log(a) // 1 console.log(b) // 2 const A = { a: 1, b: 2 } const {b, a} = A console.log(a) // 1 console.log(b) // 2 const A = { a: 1, b: 2 } const {c,d} = A console.log(c) // undefined console.log(d) // undefined 배열 구조분해 (Object .. -
05. 기술면접 - 자바스크립트 - 향상된 객체 리터럴 (Enhanced Object Literals)
05. 기술면접 - 자바스크립트 - 향상된 객체 리터럴 (Enhanced Object Literals)
2021.10.22공부목적으로 다른 블로그의 글을 그대로 따라치면서 작성되었습니다. 저작권 문제 시, 비공개 처리하겠습니다 향상된 객체 리터럴 (Enhanced Object Literals) = 축약기능 1. 객체의 속성을 메소드로 사용할 때 function 예약어를 생략하고 생성이 가능해졌다 // 객체 var dictionary = { words: 100, lookup: function() { // ES5 console.log("find words"); }, lookup() { // ES6 - ': funtion' 생략 console.log("find words"); } }; 2. 객체의 속성명과 값 명이 동일할 때 아래와 같이 축약 가능 var figures = 10; var dictionary = { // figur.. -
02. 기술면접 - 자바스크립트 - 함수 선언식과 함수 표현식
02. 기술면접 - 자바스크립트 - 함수 선언식과 함수 표현식
2021.10.22공부목적으로 다른 블로그의 글을 그대로 따라치면서 작성되었습니다. 저작권 문제 시, 비공개 처리하겠습니다 함수 선언식 (Function Statement) function Animal() { // ... } 함수 표현식 (Function Expression) var animal = function() { // ... }; 끝에 세미콜론을 써주어야 하는 데, 이것도 최근에는 생략해도 작성된다 -
15. 기술면접 - 자바 - == 와 eqauls 의 차이
15. 기술면접 - 자바 - == 와 eqauls 의 차이
2021.10.22공부목적으로 다른 블로그의 글을 그대로 따라치면서 작성되었습니다. 저작권 문제 시, 비공개 처리하겠습니다 "==" 항등 연산자(Operator) 이다. != - 참조 비교(Reference Comparison) ; (주소 비교, Address Comparison) - 두 객체가 같은 메모리 공간을 가리키는지 확인한다. - 반환 형태: boolean type - 같은 주소면 return true, 다른 주소면 return false - 모든 기본 유형(Primitive Types)에 대해 적용할 수 있다. - byte, short, char, int, float, double, boolean "equals()" 객체 비교 메서드(Method) 이다. !(s1.equals(s2)); - 내용 비교(Conte..