자바스크립트
node js에서 stream pipe 사용시 에러 처리 방법
node js에서 데이터를 stream을 사용하여 처리하고 pipe를 사용해서 계속해서 stream을 가지고 작업을 이어나갈 수 있다. 그런데 pipe를 통해서 작업을 진행하다 보니까 중간에 오류가 발생했을 때 try / catch 로는 정상적으로 처리하지 못하는 경우가 발생했다. 나에 경우에는 에러가 발생했을 때 try / catch에서 잡히지 않아서 프로그램이 Unhandled Promise Rejections를 출력 하며 죽어버렸다. 그 예는 다음과 같이 request를 통해서 받은 이미지를 sharp 라이브러리를 통해서 이미지 크기를 변경하려고 할 때 발생했다.1try { await request('https://image.toast.com/aaaaab/ticketlink/TKL_3/ion_mai..
node.js express에서 request 사용자 아이피 찾기
요청한 사용자의 Ip를 찾아서 로그를 남기거나 Ip 지역정보를 활용해서 geoIp를 찾아내거나 할 때 request를 요청한 사용자의 IP 주소가 필요하다. Spring에서는 간단하게 HttpServletRequest에서 getHeader의 X-FORWARDED-FOR에 있는 정보를 가져오거나 getRemoteAddr()을 통해 가져올 수 있다.1234567891011121314/** * 주문요청. * * @param req the req * @return the response entity*/@PostMapping(value = "/order")public ResponseEntity order(@Valid @RequestBody OrderRequestDto req, HttpServletRequest r..
Javascript에서 epoch second 구하기
epoch second 는 유닉스 시간을 나타내고 Epoch 시간 이라고 한다. 이를 자바스크립트로 구하는 방법을 알아보자.1Math.floor(new Date('2018-03-11') / 1000)cs 다시 Date 값으로 돌리는 것도 어렵지 않다.1new Date(1520726400 * 1000)cs
nodejs 비동기 프로그래밍을 위한 deferred
node.js에서 비동기 프로그래밍을 위해서 사용할 수 있는 deferred 라이브러리를 정리해보자. 우선 deferred의 경우에는 이전글에 작성했던 Promise와 동일한 개념이다. (https://wedul.tistory.com/508) promise와 마찬가지로 deferred는 비동기로 작업을 진행하고 비동기 처리가 완료되고 resolve, reject 메소드를 실행해서 비동기 동작 이후에 결과를 전달 할 수 있다. 우선 필요한 라이브러리를 다운로드 받아보자. https://www.npmjs.com/package/deferred1npm i deferredcs 그리고 라이브러리 예제에 나와있는대로 deferred 라이브러리를 사용해서 비동기 프로그램을 실행시켜보면 간단하게 promise와 동일 한..
Javascript promise에 대해 알아보자.
기존에 ajax와 같은 비동기 요청이 종료가 되고 특정한 작업을 수행하고 싶을경우 콜백함수를 설정하여 진행했었다.1234567891011 Common.sendAjax({ url: Common.getFullPath('user/cert/check'), param: { 'otp' : $otpNum.val(), 'userId' : $joinEmail.val() }, type: 'POST', success: (e) => { // 성공 시 발생할 콜백함수 }, failed: () => { // 실패시 발생할 콜백함수 } });Colored by Color Scriptercs 이런 비동기 프로그래밍은 기존 동기식 프로그래밍 보다 작업을 요청하고 다른 작업을 할 수 있는 장점이 있다. 하지만 이는 그 유명한 콜백 지옥..
node.js 애플리케이션 프로세스 관리 도구 매니저
PM2는 built-in 되어있는 Load Balancer와 함께 node.js 애플리케이션의 runtime and process 관리 기능을 제공해 주는 라이브러리이다. PM2를 이용하여 application이 죽지 않고 돌아갈 수있게 watch 기능을 제공해주는 기능도 제공한다. 그리고 error.log, info.log, 자원 점유 등등 여러 기능을 제공해준다. 간단하게 설치부터 사용법에 대해 정리해보자. 설치 $ npm install pm2 -g 실행방법 $ pm2 start app.js 사용법은 아주 간단하다. 위와 같이 command로 프로그램을 실행할 때 여러 옵션도 줄 수 있다. 12// wedul_app.js 를 max_space_size를 500으로 지정하고 실행하라.pm2 start ..
Rest Operator와 Spread Operator
es6를 사용하면서 보게된 Rest Operator와 Spread Operator에 대해 정리를 해보자. Rest Operator기존에 리터널 문법을 사용하여 객체나 배열의 값을 변수로 바인딩하여 사용할 수 있었다. 근데 object라는 객체의 값이 많은경우에는 여기서 값을 모두 하나하나 뽑아내는건 어렵기 때문에 하나의 객체로 뽑아낼때 사용한다.123456789101112131415161718192021222324// 기존에 하나씩 속성을 뽑아서 사용하던 방식const object = {a : 'wedul', b : 'cjung', c : 'gglee', d : 'babo'};const {a, b} = object;console.log(a, b); #출력wedul, cjung // Rest Operato..
html의 화면을 캡쳐해서 이미지로 변경하는 html2canvas와 pdf로 저장하는 jsPDF 라이브러리 소개
회사에서 업무를 진행하면서 현재 화면을 pdf로 만들어야하는 일이 있었다. 기존에 html을 pdf로 스프링에서 만드는 업무는 진행을 했었다. 이때는 이전에 포스팅을 했었으니 참고 하시면 좋을 것 같다. (Spring에서 html2pdf를 사용해서 pdf파일 만들기) 우선 현재 화면을 딱 캡쳐해서 image로 만드는 작업이 필요했다. 그 작업을 제공해주는 라이브러리가 바로 html2canvas이다. html2canvas 우선 html2canvas를 사용하기 위해 파일을 받아보자. npm install --save html2canvas 캡처를 진행하기 위해서는 캡처하고자 하는 영역을 selector로 위치를 받아서 지정할 수 있다. 우선 캡처를 진행할 화면을 간단하게 만들어보자. Hello world! W..
JQuery함수의 append와 appendTo 차이
하나의 dom 객체를 다른 dom에 붙히려고 할때 JQuery에서 제공하는 append나 appendTo를 사용한다. 그런데 append와 appendTo가 헷갈리는 경우가 있는데 이 두개의 차이를 알아보자. 두 개 메서드의 결정적인 차이는 붙는 대상이 무엇이냐에 있다.아래 예제를 살펴보자123456 $('').appendTo($('#test'));$('#test').append($(''));cs 코드를 보면 두 개의 결과는 동일하다. 짐작하겠지만 appendTo는 뒤에있는 객체에 앞에있는 내용을 붙히겠다는 의미이고 append는 앞에있는 객체에 뒤라는 객체를 붙히겠다는 뜻이다. 영어 뜻을 잘 해석해서 진행하면 이해하기가 더 쉬울 것 같다.
div내에 overflow scroll 옵션에 따라 스크롤 생성 시 제일 밑으로 스크롤 내리기
채팅 프로그램을 요새 만들고 있는데 채팅의 경우 스크롤이 새로운 내용이 추가되면 맨 밑으로 이동되어야 한다. 그래서 jquery를 통해 좀 쉬게 이동하게 할 수 없나 싶어서 찾아보다가 있어서 정리해본다. const $messageTextBox = $('#messageTextBox'); $messageTextBox.scrollTop($messageTextBox[0].scrollHeight); div의 태그를 잡아서 해당 스크롤의 높이를 scrollTop 메서드로 잡아주면 자동으로 밑으로 내려가게된다. 어려워 어려워.