본문 바로가기

웹개발67

Edge 브라우저 IE호환모드에서 디버깅(개발자도구) 사용하기 Edge 브라우저에서 (자동으로 또는 일부로) IE호환모드로 열린 경우 개발자도구를 열면 활성화 되지 않은 상태로 열린다.=> 호환모드로 열리는 경우 주소창 앞에 옛날 IE 아이콘이 표시되고 아이콘 눌러 보면 호환모드 버전을 알려준다. Edge IE 모드에서 ctrl + shift + i 를 눌렀을 경우, 다음 사진과 같이 디버깅 모드가 제대로 활성화 되지 않음 해결 방법 1.window + r 누름 2.%systemroot%\system32\f12\IEChooser.exe 입력 3.확인 버튼 누름 4.다음과 같이 디버그할 대상을 선택하는 창이 열리고 여기서 원하는 페이지를 선택하면 됨 결과 다음과 같은 IE의 개발자 도구 창이 새로 뜸 원본사이트Edge IE 모드에서 디버깅 방.. 2024. 8. 28.

mybatis 동적 쿼리 만들기 - trim 문법 속성prefix : 실행될 쿼리의 문 안에 쿼리 가장 앞에 붙여준다.UPDATE board username=#{username},password=#{password} prefixOverrides : 실행될 쿼리의 문 안에 쿼리 가장 앞에 해당하는 문자들이 있으면 자동으로 지워준다.SELECT * FROM board WHERE id = #{id} OR TT LIKE '%' || #{searchContent} || '%' suffix : 실행 될 쿼리의 문 안에 쿼리 가장 뒤에 붙여준다. suffixOverrides : 실행될 쿼리의 문 안에 쿼리 가장 뒤에 해당하는 문자들이 있으면 자동으로 지워준다. 문법SELECT * FROM user WHERE id = #{id} .. 2024. 8. 2.

mybatis Foreach & List변수로 동적으로 쿼리 생성하기 1. List 형태의 데이터를 사용해서 만들기. 밑에 inputList ,inputList2가 List 형태 변수다. SELECT '${map2.키값}' AS COL_${idx2} FROM table WHERE ROWNUM = 1 UNION ALL 2. 또한 포문을 사용하지 않고 직접적으로 #{inputList[0].키값} 이런식으로 직접 접근도 가능하다. 2023. 7. 7.

Mybatis selectKey 컬럼 여러 개 사용 1. selectKey 컬럼 여러 개 사용 Mybatis 3.2.6 버전부터는 selectKey에 여러 개 컬럼의 데이터를 조회할 수 있다. 여러 개의 컬럼을 가져오기 위해서는 keyColumn이라는 속성을 설정해주어야 한다. INSERT INTO user(user_id, user_name, column1, column2) VALUES (#{userId}, #{userName}, #{column1}, #{column2}) SELECT user_id, user_name FROM user WHERE column1 = #{column1} AND column2 = #{column2} 데이터가 삽입된 이후에 특정한 조건에 맞는 컬럼들의 데이터를 조회한다. 주의할 점은 selectKey를 통해서 나오는 데이터의 r.. 2023. 7. 7.

IE실행시 자동으로 무조건 EDGE가 열린다면.. IE를 꼭 써야하는 상황이 있는데 EDGE로 무조건 넘어갈때가 있다. 그럴때는 밑에 코드를 bat 파일로 만들어 관리자 권한으로 실행시키면 된다. 자동으로 레지스트리를 수정해준다. (테스트는 윈도우 10에서만 했습니다. 11사용자는 주의필요.) Copyright (C) 2023 NPIX Studio. 김루노 레지스트리 관련 기술지원. 2CPU 커뮤니티의 dateno1님 감사합니다. -------------------------------------------------------------------------------------------- @echo off TITLE IE 브라우저 실행 시 엣지브라우저로 리디렉션 방지 REM 개새닷컴(https://gaesae.com) REM Copyright (C.. 2023. 5. 9.

mybatis 한번에 여러개 쿼리 작성하기. MS-SQL 은 별도에 선언문 없이 이어서 쿼리를 여러개 작성 가능하다. 하지만 ORACLE같은 경우는 밑에와 같은 구조로 선언해야한다. PL/SQL의 블록 구조 -- 전체가 하나의 블록이고 구성요소는 아래와 같다 DECLARE -- 선언부(옵션, 생략가능) -- 변수나 상수를 정의 BEGIN -- 실행부 (필수, BEGEN-END) -- 로직 수행 (일반 SQL문, 조건문, 반복문 등) EXCEPTION -- 예외 처리부(옵션, 생략 가능) - 보통생략한다. END; 2023. 3. 29.

웹 소스 브라우저에 디버깅하기 - 디비깅 기초부터 총괄 https://youtu.be/L52UucF_y0U?list=PL8fa6cNjxD5vvtB7SjKy3ShYhzHXJLbMG - 디버깅시 console 활용법 https://www.youtube.com/watch?v=LEcExA5TGZg&list=PL8fa6cNjxD5vvtB7SjKy3ShYhzHXJLbMG&index=6 - HTML 특정요소에 이벤트 유무 및 자동으로 중단점 추가하기 https://youtu.be/ZdBv8h5Jteo?list=PL8fa6cNjxD5vvtB7SjKy3ShYhzHXJLbMG - HTML 특정요소에 속성(setValue등에 구문에서 멈춤),하위트리수정,노드삭제시 중단점 추가하기 - XHR(비동기 통신) 중단점 추가하기 https://youtu.be/P.. 2023. 3. 18.

spring security CSRF 웹 취약 대응하기 ( CSRF 토큰 생성 및 체크 ) 1. 개요 CSRF의 정의 Spring Boot에서의 CSRF Filter 처리 방식 2. CSRF란? 사이트 간 요청 위조(Cross-site request forgery, CSRF)는 웹사이트 취약점 공격의 하나로, 사용자가 자신의 의지와는 무관하게 공격자가 의도한 행위(수정, 삭제, 등록 등)를 특정 웹사이트에 요청하게 하는 공격을 말한다. - 위키백과 특정사이트에 로그인 된 상태에서 메일이나 게신판들을 열람했을 때 자신의 의지와는 상관없이 수정,삭제,등록 등이 일어나는 행위를 말한다.(같은 브라우저상에서는 탭이 다르더라도 세션이 (JSESSIONID등의)쿠키로 공유 되기 때문이다.) 밑에 설명은 같은 사이트내에서 발생한 예제이지만, 이름에서 알수 있듯이 보통은 타 사이트에서에 요청을 차단하는 것이.. 2022. 12. 12.

jquery 셀렉터 정리. Jquery 셀렉터로 특정 단어로 시작해서 특정 단어로 끝나는 (ex: a-xxxx-b) 값을 지정할수있다 예제 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 .siblings * { display: block; border: 2px solid lightgrey; color: lightgrey; padding: 5px; margin: 15px; } $(document)... 2022. 11. 24.

웹 scroll, offset, client Height 의 차이 웹페이지, 또는 요소의 높이값 정보를 얻는 속성은 대표적으로 clientHeight와 offsetHeight, scrollHeight가 있습니다. 세 속성은 어떤 경우에는 값은 높이값을 표시하지만, 어떤 경우에는 다른 높이값을 표시합니다. 각 속성이 표시하는 높이 값의 의미는 다음과 같습니다. clientHeight 는 요소의 내부 높이입니다. 패딩 값은 포함되며, 스크롤바, 테두리, 마진은 제외됩니다. offsetHeight 는 요소의 높이입니다. 패딩, 스크롤 바, 테두리(Border)가 포함됩니다. 마진은 제외됩니다. scrollHeight 는 요소에 들어있는 컨텐츠의 전체 높이입니다. 패딩과 테두리가 포함됩니다. 마진은 제외됩니다. 그림으로 표현하면 다음과 같습니다. 세속성 모두 정수값으로 표현되.. 2022. 11. 24.

spring modleAndView 404 OR tomcat 404 페이지를 못찾는 경우. 1. spring 에서 404가발생하는 경우는 DispatcherServlet에 정의 된 viewResolver의 prefix경로를 확인해봐야한다. 설정된 경로와 확장자가 이상없는지 확인해봐야한다. 자세한 내용 : https://hello-walnuty.tistory.com/16 1. spring 설정에 전혀 문제가 없다면 톰캣에 work 디렉토리를 살펴봐야한다. work 디렉토리는 그 이름에서 알 수 있듯이 runtime에 필요한 파일들, 예를들어 JSP로부터 변환된 서블릿코드(java파일), 또 그것을 compile하여 발생된 class파일 그리고 세션 파일들이 상주하는 공간이다. 이곳에 문제가 생겨 jsp파일을 읽지 못하는 경우도 있다. 이경우는 work디렉토리를 다른곳에 백업 후 삭제. 톰캣을 재.. 2022. 11. 24.

네이버 (웹에디터) 스마트 에디터 네이버 스마트에디터가 가장깔끔하고 오픈소스에 심플한 느낌.. 일단 네이버 Developers 경로 https://developers.naver.com/opensource/tools/editor/ 배포경로가 https://github.com/naver/smarteditor2로 바뀌었습니다. SmartEditor 3.0은 대외 공개하고 있지 않습니다. 라고 한다. GitHub에서 받을 수 있고 매우 친절하다? 유저 가이드 http://naver.github.io/smarteditor2/user_guide/ SmartEditor2는 JavaScript로 구현된 웹 기반의 WYSIWYG 편집기이다. 글꼴, 글자 크기, 줄 간격 등을 자유롭게 설정할 수 있으며, 단어 찾기/바꾸기와 같은 편리한 기능을 제공한다. .. 2022. 11. 23.

웹 캐시 저장 방지하기 밑에 설정들은 캐시 방지용이지 기존에 있던 캐시를 삭제하는 기능은 아니다. 기존에 있던 캐시를 무시하는건 쿼리스트링에 ver을 넣어 호출하는 방법이 있다. (이렇게 하면 스크립트 버전을 관리해야하기 때문에 불편해질수 있다.) => 참고 : https://domdom.tistory.com/m/entry/%EC%BA%90%EC%8B%9C%EB%B0%A9%EC%A7%80-%EC%9B%B9-%EA%B0%9C%EB%B0%9C-%EC%8B%9C-CSS-JS-Image-%EC%BA%90%EC%8B%9C-%EB%B0%A9%EC%A7%80%ED%95%98%EB%8A%94-%EB%B2%95 HTML 파일에 설정 : JSP 파일에 설정 : Spring MVC Controller methods 설정 : @Controller .. 2022. 10. 17.

script 웹페이지 잘리지 않게 PDF 파일로 만들기 먼저 준비물 bluebird는 익스플로러에서 작동하게 하려면 꼭 필요하다. jspdf는 pdf 생성해주는 라이브러리, html2canvas는 html 페이지를 이미지로 만들어주는 라이브러리이다. 주의사항 html2canvas는 html페이지와 같은 도메인에 올라가 있는 이미지만 불러올 수 있는 것 같다. 외부 cdn 이미지를 이용하면 출력되지 않는다. (https://stackoverflow.com/questions/31509227/html2canvas-not-rendering-cdn-images) pixabay에 있는 이미지 주소로 이미지를 넣고 실행하니까 전혀 나오지 않아서 찾아보니 이런 내용이 있다. 그래서 따로 호스팅을 파서 같이 올리니 실행이 됨. 데모 http://gyl13.dothome.co.. 2022. 10. 17.

Javascript 화면 캡쳐 [html2canvas] 브라우저에서 화면의 모습을 캡쳐하려면 html2canvas라는 오픈소스 라이브러리를 사용하면 구현하기 매우 간단합니다. https://html2canvas.hertzen.com/ 먼저 조금 철(?)지난 소스코드 사용방법 입니다. function click(){ html2canvas( document.querySelector('#대상') , { onrendered: function(canvas) { saveAs(canvas.toDataURL(), '이름.png'); } }); } function saveAs(uri, filename) { var link = document.createElement('a'); if (typeof link.download === 'string') { link.href = ur.. 2022. 10. 17.

이클립스에서 변경된 소스 자동으로 refresh 하기 로컬에서 web경로로 이미지 업로드 및 이클립스가 아닌 외부 프로그램(넥사크로등)에서 웹소스를 변경시이클립스에서 F5 refresh 를 하지 않는 이상은 로컬 서버(톰캣)에서 인식하지 못한다. window-preference -> general-workspace 에refresh using native hooks or polling 과 save automatically before build 이 두 항목을 체크해주면빌드 되기전에 리프레시를 먼저 하여 파일을 인식할 수 있게 된다. Preferences -> Run/Debug -> Launching -> "Save required dirty editors before launching"을 Always로... 2022. 10. 17.

Spring Java 수정 시 톰캣 재 실행 안하고 적용하기. 출처 : https://junghn.tistory.com/entry/eclipse-%ED%86%B0%EC%BA%A3-%EC%9E%AC%EC%8B%9C%EC%9E%91-%EC%97%86%EC%9D%B4-java-%ED%8C%8C%EC%9D%BC%EC%9D%84-%EC%88%98%EC%A0%95-%EC%A0%81%EC%9A%A9-%ED%95%98%EB%8A%94-%EB%B0%A9%EB%B2%95 오늘은 Spring Loaded를 이용해서 톰캣 재구동 없이 변경된 수정 내역을 반영하는 방법에 대해 정리에 보겠습니다. 스프링 로드란? Spring Loaded는 JVM이 실행되는 동안 클래스 파일이 변경되면 변경된 사항을 다시 로드하기 위한 JVM 에이전트입니다. 나중에 재로드 할 수 있도록 로드 시 클래스를 변.. 2022. 7. 26.

Spring + MyBatis 쿼리 수정 시 재 시작 없이 반영하기 출처 : https://shxrecord.tistory.com/196 Spring + MyBatis 환경에서 개발하다보면 xml 파일을 수정할 때마다 서버를 재실행해주어야하는 불편함을 느끼셨을 겁니다. 아마도 가장 큰 불편함은 특정 페이지를 개발하다가 서버를 재실행하면 세션이 끊겨 다시 그 페이지로 가는 과정(+또는 행동)을 거쳐야하는 게 아닐까 싶습니다. 본 포스팅에서는 xml 파일 수정시 서버의 재실행없이 반영되게 하는 방법을 정리해보았습니다. ※ 테스트 환경 jdk 1.8 Eclipse 2019-06 Spring Framework 4.3 MyBatis 3.4.6 MariaDB 설정을 하기 앞서 Class 파일이 필요하다. 아래 소스를 원하는 패키지 경로에 추가한다. RefreshableSqlSess.. 2022. 7. 26.

REST API 간단정리 ///////////////////////// ///// Rest API //// ///////////////////////// - REST API란 데이터 자원을 이름(자원의 표현)으로 구분하여 해당 자원의 상태(정보)를 주고 받는 모든 것을 의미한다. REST API라는게 크게 어렵게 생각할 필요 없이 그냥 보통 웹서비스 인데. 일반 웹처럼 view를 리턴해주는게 아니고 요청에 따른 정보를 Json이나 XML등으로 데이터값을 리턴해주거나 요청에 따라 데이터를 저장, 삭제해주는 서비스이다. 그리고 그역활을 @RestController을 사용한다(@Controller 와 @ResponseBody를 합쳐놓은 어노테이션이다) ( 일반 웹에서도 Ajax로 요청하고 데이터 받을때 @ResponseBody를쓰면 .. 2022. 7. 1.

Spring Boot 프로젝트 생성 출처: https://daslyee.tistory.com/80 [Daslyee:티스토리] 1. 다운로드 : https://spring.io/tools 2. 여기서는 윈도우용으로 다운로드 후 jar 파일을 설치(더블클릭) 그렇다면 해당 폴더가 보일 것이고, 들어가서 SpringToolSuite4 실행 (한글이 없는 경로에 압축을 풀고, 실행하길 권장) 3. 프로젝트 생성(file > New > Spring StarterProject) 4. name과 group, package 등 이름을 정하고 취향에 맞게 java, war 설정 후 Next 5. 대중적인 Spring Web 선택 후 Next. 이게 뭔지 확인해보는 것도 개발 이론에 도움이 될듯 (boot 버전에 따라 보이는 것이 다름. 당황하지 말고 Sp.. 2022. 7. 1.

쿠키의 보안 취약점 출처사이트 : https://uoonleen.tistory.com/m/65 쿠키의 보안 취약점 1) XSS(Cross-Site Scripting) 공격 XSS 공격은 자바스크립트가 사용자의 컴퓨터에서 실행된다는 점을 이용한 공격입니다. 자바스크립트에서 "document.cookie"라는 명령어는 사이트에서 쿠키 값을 활용할 수 있게 하는 역할을 하지만 공격자들은 쿠키 값을 탈취하기 위해서 사용하기도 합니다. 2) 스니핑(Sniffing) 공격 스니핑이란 단어의 사전적 의미는 '코를 훌쩍이는, 킁킁거리며 냄새를 맡는' 입니다. 사전적 의미와 같이 스니핑 공격은 네트워크의 중간에서 남의 패킷 정보를 도청하는 해킹 유형의 하나입니다. 수동적 공격에 해당하며, 도청할 수 있도록 설치되는 도구를 스니퍼(Sniff.. 2022. 2. 18.

이전 1 2 3 4 다음

티스토리툴바