본문 바로가기

JavaScript47

javascript cryptojs 예제 AES 256 https://cryptojs.gitbook.io/docs/ API 문서 참고 CryptoJS Original documentation: https://code.google.com/archive/p/crypto-js/ cryptojs.gitbook.io 암호화시 주의사항 128, 256 암복호화시에 실수하는 부분이 있다. 128 암호화 키에서는 16 byte 를 사용하고, 256 에서는 32 Byte를 사용 하여야 한다. 오픈소스 모듈에따라 지원하는게 다름으로, 암호화 종류에 따라. 키값을 채우지 않아도 공백값으로 채워주어거나 잘라서 사용하도록 되어 있지만. 사용자 실수를 최소화 하기 위해서는 키값을 명확하게 적어서 사용하면 좋다. 예제에서는 AES 256 임으로 32byte의 키를 사용한다. 암호화 복호화 2020. 8. 28.
nodejs crypto aes256, md5 CryptoUtils.js import crypto from "crypto" ; /** * sha512 해싱 알고리즘 * @description 단방향 * @param {String} text 암호화할 평문. */ export const sha512 = (text) => crypto.createHash('sha512').update(text).digest('base64') let data = sha512("가나다라마바사") console.log(` sha512 : ${data}`) AES256Utils.js import crypto from "crypto" ; const aesKey = crypto.randomBytes(32) // 32 byte const iv = Buffer.from([0x00, 0x.. 2020. 8. 19.
IE 브라우저 버전 체크 script 브라우저 에이전트 체크 스크립트 네비게이터 속성에서 사용자 에이전트 값을 가져와 체크해본다. IE Version Check 인터넷 익스프로러 일경우에는 버전이 아닐경우에는 N/A를 화면에 표시한다. 2016. 7. 8.
HTML5 Video and image 재생 (AD Player) HTML4 video tag 를 이용한 AD player 재생기 HTML5로 광고를 재생할수 있는 기능을 구현해보자 광고재생이라하면 기본적으로 비디오, 이미지 두가지의 기능이 있어야 할 것이다. HTML5에 VIDEO Tag가 있으니 이를 활용하여 만든다. Video Tag는 다음음과 같은 속성을 가지고 있다. 프로퍼티 형식 설명 buffered TimeRanges[ref name=”time-ranges”]시간 범위를 나타내는 객체로 length, start, end 를 속성으로 가집니다. 현재 재생중인 미디어의 URL currentSrc 문자열 현재 재생중인 미디어의 URL currentTime 숫자 재생 중인 미디어의 현재 위치 defaultPlaybackRate 숫자 기본 미디어 재생 속도 배속. .. 2016. 6. 28.
javascript 이미지 미리보기 이미지 미리보기, 어떻게 보면 간단한것인데 무조건 한쪽 방향에만 나오게 한다면 윈도우 사이즈에 따라 상하 좌우가 포지션이 잘못잡혀 사진이 안보이게 된다. 이때 마우스 포인터위치를 잡아서 미리보기 섹션이 어디로 보여질지 판단하면 된다. #preview { z-index: 99999; position:absolute; border:0px solid #ccc; background:#333; padding:1px; display:none; color:#fff; } this.imagePreview = function(){ /* CONFIG */ xOffset = 10; yOffset = 30; /* END CONFIG */ $(".img_thumb").hover(function(e){ this.t = this.t.. 2016. 3. 30.
JavaScript Boolean Object javascript 에서 사용하는 true false 사용할때 이렇게 써봤나? character 'false' 오면 true 이고, false 로 오면 false 난 이것 때문에 삽질한적이 있지,그래서 API를 봐야한다는거야.. Boolean 객체Boolean 객체는 boolean 갑을 랩핑하고 있는 객체다.Boolean이 아닌 값을 Boolean으로 변경할 때 사용한다.new 키워드를 사용하여 새로운 객체를 생성할 수 있다.초기값이 없거나, 0, -0, null, NaN, "", false, undefined일 경우 false가 되고,그 이외의 경우에는 true가 된다. 다음의 객체들은 false를 나타낸다.var myBoolean=new Boolean()var myBoolean=new Boolean(.. 2012. 7. 19.
HTML5 API How is support browser ? html5 과연 마크업 언어인가? 스크립트 영역으로 봐야 할것인가?이둘을 나누는것 보다는 모두 포함하고 있다는 사실이 맞겠지. 확장된 JavaScript API 그리고 추가된 form Element 를 봤을대 어느 하나를 택하기에는..하지만 퍼센트(%) 비율로 봤을때는 아무래도 약 70~80%를 스크립트 언어라고 봐도 과언이 아닐듯하다. 자 그럼 5대 메이저 브라우저에서 얼만큼이나 살펴보나 볼까? 내가모두 테스트 할 수는 없었고, 어느정도만 했는데, 역시나 이런거 클릭한방으로 알아볼수 있는곳이 있다. 바로여기!! *http://html5please.com/ *http://www.html5rocks.com/en/ *http://caniuse.com/#search=canvas *http://html5demo.. 2012. 7. 19.
HTML A Tag href 이미지에도 onclick 이벤트를 걸수 있다만. 퍼블리셔 분들이 a Tag를 항상 이미지 위에 걸어 주신다. #자신의 페이지를 뜻하기 때문에 화면이 변경되는건 아니지만. 새로고침 되며 위치는 상단으로 이동된다. 이를 방지 하기 위한 몇가지 방법이 있는데 내가 알고 있는 몇가지 방법을 제외 하고도 여러 브라우저에서 테스트한 내용이 아래 링크에 담겨있다. http://blog.naver.com/ymobius?Redirect=Log&logNo=30095324654 굳이 A Tag를 쓰겠다면은 아래와 같이 사용한다. 머릿속에 모든걸 기억할수 없으니, 키워드는 기억하자 2012. 2. 15.
jQuery UI libary url Link jQuery가 나오기전 javascript 의 최초(맞나?)의 framework 으로 명성을 날린 Prototype.. 나도 이전까지만 해도 prototype기반의 script.aculo.us 를 사용하였는데. 이젠 나도 jQuery로 갈아 타려한다. url link . http://jqueryui.com/demos/tabs/ http://api.jquery.com/hide/ 좌측 메뉴 확인. javascript의 기본 개념을 잡지 않고 jQuery, Prototype을 한다면, 당신은 아주 많이 어려워 할것이다. 그러니 일반적인 DOM script부터 익힐것을 권고한다.(사실 나도잘 모름) (왠지써놓고보니 이건 영문번역해둔거 쓴거 같은...) 아무튼 하지만 아직도 프로토타입과 스크랍타큘러스의 조합은 괜.. 2011. 11. 30.