본문 바로가기

개발(IT)

(16)
[개발/자바스크립트] window.open 서로 다른 브라우저 호출시 의미없는 팝업 생성 IE에서 Edge를 호출하는 로직을 개발하는 중 처음에 타겟(target) 옵션을 `_blank`로 테스트를 진행했습니다.결과는 IE에 빈 팝업창이 하나 뜨고 그 후에 제가 호출한 url을 띄우는 Edge 팝업창이 호출되었습니다.사용자 입장에서 의미없는 팝업창이 하나 더 뜬 거라 이 현상을 해결해야 했습니다. 우선 해결 방법은 타겟 옵션을 `_self`로 변경하면 됩니다.IE에서 `window.open`의 타겟을 `_blank`로 설정했을 때와 `_self`로 설정했을 때 동작 방식이다른 이유는 IE에서의 새 창 생성 프로세스와 현재 창을 재사용하는 방식 때문입니다.1. _blank의 동작: 새 창 또는 탭 생성`_blank`는 항상 새 창(또는 탭)을 생성하려고 시도합니다.IE에서 새 창을 열면 IE ..
[개발/자바스크립트] window.open target 옵션 종류별 동작 설명 JavaScript의 `window.open()`메서드는 새 브라우저 창 또는 탭을 열 때 사용되며, 두 번째 인자는 새로 열리는 창의 이름이나 타겟(target)을 지정하는 데 사용됩니다.이 인자는 문자열로 전달되며, 다음과 같은 주요 옵션과 차이를 가지고 있습니다.차이점 요약 값동작설명_blank항상 새 창(탭) 열기기존 창에 영향을 주지 않음_self현재 창에서 열기현재 창의 콘텐츠 대체_parent부모 창에서 열기iframe 내부일 때 부모 창을 대체_top최상위 창에서 열기iframe 계층을 무시하고 최상위 창 대체사용자 지정 이름지정된 이름으로 새 창을 열거나 기존 창 재사용창 간 데이터 공유 가능옵션별 상세 설명1. _blankwindow.open('https://example.com', '..
[개발/자바스크립트] 끔찍한 IE(인터넷 익스플로러)에서 Edge 브라우저 호출 방법 아직도 IE를 쓰고 있는 곳에서 잠시 일을 하게 됐습니다.OCX를 사용하기 때문이죠.....{{{(>_ 끔찍한 IE에서 타 서비스 URL을 호출해야 하는데, 타 서비스는 IE를 지원하지 않는다고 합니다.어쩔 수 없이 IE에서 Edge를 호출하는 방법을 찾아보게 됐습니다. 방법은 간단하게도 호출한 URL 앞에  `'microsoft-edge:'`를 붙여주면 됩니다.현재 브라우저가 IE인지 판단하고 IE인 경우 `'microsoft-edge:'` 프로토콜을 붙여 `window.open()`명령어를 사용하면 끝입니다.var url = “https://www.naver.com”;if(navigator.userAgent.indexOf(“Trident”) > 0) { url = “microsoft-edge:” + ..
[개발/자바스크립트] void 연산자 토스트(TOAST) UI 오픈소스를 보는 중에 void 0을 사용하는 로직을 보게되었습니다. 순간 이게 어떤 비교를 하고 싶은거지? 어떤 값을 변수에 넣는다는거지? 의문이 들어 찾아보게 되었습니다. //CASE 1 placeholder = _ref$placeholder === void 0 ? '' : _ref$placeholder //CASE 2 _exports["default"] = void 0; void 연산자의 기본 개념 void 연산자는 단항 연산자로서, 주어진 표현식을 실행하고 결과는 무시한 채 undefined를 반환합니다. void의 사용 사례 일반적으로 void 연산자를 모르더라도 a태그를 클릭할 때 페이지 이동을 막기 위해 사용되는 경우로 많이들 접하지 않았을까 생각합니다. 저 역시 저 ..
[개발/DBeaver] 빈 라인(개행) 무시하고 쿼리 실행 / Blank line is statement delimiter 옵션 어쩌다 보니 프로젝트를 진행하는데 DB Tool로 DBeaver를 자주 사용하게 됐습니다.쿼리 분석을 위해 서버 로그(Log)에 남은 쿼리문을 복사 후, DBeaver로 실행해 보는 경우가 많은데요, 그러다 보니 쿼리문 사이사이에 빈 라인(개행)이 들어가 있고는 합니다.그런데 DBeaver에서는 빈 라인을 쿼리의 끝으로 인식해서 올바르지 않은 쿼리문으로 오류가 발생하여 매번 빈 라인을 모두 제거하거나 쿼리문 전체를 블록 지정해서 쿼리를 실행하고는 했습니다.이 과정이 반복되고 쿼리가 길어지면 빈 라인을 지우는데 쓸데없이 시간 낭비가 생겨 구글링을 해보니 이런 옵션이 있더라구요!  실제 개발하는 곳은 폐쇄망이라 스크린샷에 퀄리티가 떨어지는 건 감안해 주세요...ㅎㅎ 1. 윈도우 > 설정 메뉴 클릭 > 환경 ..
[개발/Eclipse] 소스 비교시 개행 무시 / Ignore White Space 프로젝트 도중 XPlatform(UIㆍUX툴)으로도 개발하고 Eclipse에서도 개발하는 과정에서 서로 다른 개행이 들어가 형상관리를 하는 과정에서 실제 로직 변경으로 인한 수정 여부를 판단하기가 어려워져 이것저것 찾다가 소스를 비교하는 과정에서 화이트 스페이스(white space)를 무시할 수 있는 기능을 발견하여 공유합니다. 실제 개발하는 곳은 폐쇄망이라 스크린샷에 퀄리티가 떨어지는 건 감안해 주세요...ㅎㅎ 변경된 내용은 없으나 개행의 차이로 인해 SVN Sychronize 과정에서 변경되었다고 알려주고 있습니다. *white space 표시는 [General > Editors > Text Editors] 메뉴에서 show whitespace characters 체크 필요! 개행 차이로 인한 변경..
[개발/XPLATFORM] 엑스플랫폼에서 Chrome 브라우저 호출(오픈) / ExtCommon() 사용 현재 진행 중인 프로젝트에서 XPLATFORM(엑스플랫폼)을 사용하고 있는데, 다른 시스템과 연계되는 부분이 추가되어 특정 URL을 호출(오픈)해야 하는 업무가 추가되었습니다.그러나 타 시스템은 IE를 지원하지 않아 엑스플랫폼에서 Chrome(크롬) 브라우저로 열어야 한다는 요구가 있었습니다. XPLATFORM 고객지원센터에 프로젝트명과 상황 설명을 하니 잠시 후에 아래와 같은 가이드를 받아서 해결했습니다. var objExtCommon = new ExtCommon();objExtCommon.executeProcess("C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe", "https://www.naver.com"); 부연설명ExtCommon API..
[개발/자바스크립트] 폴리필(polyfill)과 바벨(Babel)이란(정의 및 구분/차이점) SI 개발을 하다보면 아직까지도 IE(Internet Explorer/22.6.14 서비스 종료)를 지원해야하는 프로젝트를 하기도 합니다.이런 경우, 제공받은 프레임워크에 자바스크립트 일부 문법을 지원하지 않아 큰 이슈가 되기도 합니다.이슈를 해결하기 위해 위해 폴리필(polyfill))과 바벨(Babel)을 적용하는데요. 막연하게 폴리필과 바벨을 구분하지 못한 채, 자바스크립트 버전 이슈를 해결하기 위해 사용하는구나 정도만 알고 있습니다. 오늘은 폴리필과 바벨이 무엇이고 어떻게 다르고 왜 필요한지에 대해 공부하는 글을 적어보도록 하겠습니다.우선 폴리필과 바벨의 단어 정의는 아래와 같습니다. 폴리필브라우저에서 지원하지 않는 코드에 대해 사용 가능하게 구현하는 코드(일반적으로 웹의 JavaScript)입니..