본문 바로가기

JavaScript6

npm 취약점 점검 도구 - npm audit 먼저 npm이란 javascript 또는 typescript 언어를 위한 Package 관리 도구입니다. npm에는 개발자 편의를 위한 여러가지 Command가 존재하는데, 그 중 취약점 점검 기능인 audit에 대하여 설명하도록 하겠습니다. 사용 방법은 매우 간단합니다. # Default Usage $ npm audit # output json format $ npm audit --json 발견된 취약점에 대한 조치도 단순한 명령어를 통하여 손쉽게 진행할 수 있습니다. $ npm audit fix 다만, deprecated 되었거나 변경된 기능으로 인하여 프로그램이 정상적으로 작동하지 않을 수 있어 사전 백업 후 반드시 작업을 진행해야 할 것 같습니다. Reference About audit repor.. 2022. 11. 16.
Package-lock.json이란? NPM을 사용하여 Build를 하다보면, package-lock.json이 생긴 것을 확인할 수 있습니다. package-lock.json 파일은 NPM을 이용하여 node_modules Tree나 package.json 파일을 수정할 경우 자동으로 생성되는 파일로써 파일이 생성된 시점의 의존성에 대한 정확한 정보를 담고 있습니다. 샘플 파일을 통하여 좀 더 정확하게 알아보도록 하겠습니다. typescript 정보만 나열되어 있는 packge.json 파일과 해당 파일을 통해 생성된 package-lock.json 파일입니다. package.json { "dependencies": { "typescript": "^4.8.4" } } package-lock.json { "name": "typescript".. 2022. 11. 16.
TypeScript 문법 정리 화살표 함수 여러 번 사용 Typescript Code var a = (b:string) => (c:string) => { return b+"-"+c+"-"+"789"; } var b = a("123"); var c = b("456") console.log(c) Javascript Code var a = function (b) { return function (c) { return b + "-" + c + "-" + "789"; }; }; var b = a("123"); var c = b("456"); console.log(c); 실행 결과 > 123-456-789 코드 설명 함수(인자) 안에 함수(인자)를 담아서 사용할 수 있으며, 사용 시점에 맞춰 인자를 설정할 수 있는 장점이 있는 것 같습니다. 또.. 2022. 10. 14.
AngularJS에 대하여 알아보자 SPA(Single Page Application) AngularJS는 SPA(Single Page Application) Framework 입니다. Single Page Applicaiton(SPA, 스파)는 서버로부터 완전한 새로운 페이지를 불러오지 않고 현재의 페이지를 동적으로 재사용함으로써 사용자와 소통하는 WEB Applicaiton을 의미합니다. SPA 사용 이전까지는 페이지 요청 시 Server에서 HTML을 생성 및 Rendering하여 Client로 전송하면 Client는 그 결과를 화면에 보여지도록 처리만 했습니다. 그러나 웹 사이트가 고도화됨에 따라 한 페이지에 해당하는 용량이 커져갔고, 매번 새로운 페이지를 전달하는 게 버거워졌습니다. 이를 해결하기 위해 나온 것이 SPA인데요. S.. 2022. 10. 9.
TypeScript에 대하여 알아보자 TypeScript가 필요해진 이유 초기 javascript의 경우 Web 환경이 이렇게 커질 것이라고 생각을 하지 못했기 때문에 짧은 형태의 간단한 코드들로 이뤄질 것이라고 생각하여 단순한 형태의 간단한 Scripting Language를 만들려고 했습니다. 그렇기 때문에 언어의 복잡도를 최소화하고 Running Curve(습득 난이도)를 낮추기 위해 당시에 가장 유행 중이던 C++과 java의 문법을 빌려오는 방향으로 구성이 되었습니다. 이로 인해 Java 계열의 문법을 차용하면서도 type을 제거하고 class와 같은 복잡성을 야기할 수 있는 부분들도 제거하여 간결한 문법을 가지면서 Type 없이 객체지향도 함수형 프로그래밍도 할 수 있는 Prototype의 객체 기반 함수형 동적 타입 스크립트의 .. 2022. 10. 3.
strtoupper를 이용한 XSS 공격 개요 rubiya님의 해당 게시글에 자세한 개념이 잘 정리되어 있습니다. 여기서는 실제 진단에 어떻게 활용할 수 있을지에 대한 부분만 중점적으로 다루겠습니다. strtoupper() – blog.rubiya.kr 해당 문서는 위의 트윗을 보고 추가적인 연구를 진행해 Theori 내부 세미나에서 발표한 결과물이다.(사장님 허락받고 올린다) (%C4%B1) 는 LATIN SMALL LETTER DOTLESS I를, (%E2%84%AA) KELVIN SIGN을, (%C5%BF) 는 LATI blog.rubiya.kr 실제 취약점 진단에 활용하는 방법 strtolower()와 같이 소문자로 치환해주는 함수의 경우 로 입력해주는 것만으로도 XSS 취약점이 발생하였습니다. 그런데 strtoupper()와 같은 함수.. 2021. 1. 6.