내가 보려고 만든 블로그

const today = new Date(); const timeValue = new Date(date); const betweenTime = Math.floor((today.getTime() - timeValue.getTime()) / 1000 / 60); if (betweenTime < 1) return '방금전'; if (betweenTime < 60) { return `${betweenTime}분전`; } const betweenTimeHour = Math.floor(betweenTime / 60); if (betweenTimeHour < 24) { return `${betweenTimeHour}시간전`; } const betweenTimeDay = Math.floor(betweenTime / 6..

ckeditor에서 유튜브를 embeded 했는데, embeded 태그로 입력되서 출력이 되지않는다ㅠㅠ 유튜브는 iframe으로 출력해야되서 그런데, 간편하게 변경할 수 있는 방법이 있다! editor config에 넣어주면 된다! editorConfig = { toolbar: [....], mediaEmbed: { previewsInData: true } } [vue 전체 코드]

AWS S3에 올려둔 이미지를 다운로드해보자! 우선 코드 먼저 let image = new Image(); image.onload = function() { const canvas = document.createElement("canvas"); canvas.width = image.width; canvas.height = image.height; const ctx = canvas.getContext("2d"); ctx.drawImage(image, 0, 0); let dataURL = canvas.toDataURL(); const element = document.createElement('a'); element.setAttribute('href', dataURL); element.setAttribute..

input에서 휴대폰 번호 입력할때 휴대폰 양식에 맞춰서 자동으로 dash를 넣어줘야될 경우가 있다 예를들어 사용자가 숫자만 01011112222만 입력하면 입력할때마다 자동으로 010-1111-2222로 변환해주는 이런거... 그럴땐 let phoneNumber = 01011112222; phoneNumber = phoneNumber.replace(/(\d{3})(\d{4})(\d{4})/, "$1-$2-$3"); console.log(phoneNumber) // 010-1111-2222 이렇게만 하면 끝이라는거!! 생각보다 자주쓰는데 할때마다 검색하는게 귀찮으니 나는 이제 블로그 들어와서 봐야겠다

이미지를 가져오고 싶은데 cros 오류가 발생한다... cors는 통신때만 해주면 되는데 왜 여기서 까지 발생할까... 이유를 검색해보니 초기 이미지를 캐싱하는 단계에서는 cors 헤더를 가져가지 않고 캐싱을 하기때문에 이와같은 오류가 발생한다고 한다 그래서 열심시 구글링해서 canvas로 우회해서 가져오고 crossOrigin을 설정해주었지만... 그래도 동일하게 발생하는 오류... 여기서 삽질을 더 한결과 기존 코드 getBase64FromUrl(){ let image = new Image(); const _this = this; image.onload = function() { const canvas = document.createElement("canvas"); canvas.width = imag..

file to base64 function fileToBase64(file){ const reader = new FileReader(); reader.readAsDataURL(file) reader.onload = () => { console.dir(reader.result)// base64 } } base64 to file function dataURLtoFile(dataurl, filename) { var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1], bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n); while(n--){ u8arr[n] = bstr.charCodeAt(n)..

const _vDate = new Date(new Date().getTime() + 5*60000) const _second = 1000 const _minute = _second * 60 const _hour = _minute * 60 const _day = _hour * 60 let timer const _this = this setInterval(() => { const now = new Date(); const distDt = _vDate - now if(distDt < 0){ clearInterval(timer) return ; } const days = Math.floor(distDt / _day) const hours = Math.floor((distDt % _day) / _hour) con..

input에서 날짜 입력하면 입력한 길이 계산해서 하이폰 추가하기! inputDate(event){ let date = event.target.value date = date.replace(/-/g,"") let tempDate = '' if(date.length < 5){ return tempDate = date }else if(date.length

ckeditor로 작성한 문서를 tag만 제거하고 출력하고싶을때 ?? 정규식으로 태그만 제거하자! text = text.replace(/ /ig, "\n"); text = text.replace(/]*)?(\s)*(\/)?>/ig, ""); text = text.replace(/(]+)>)/gi, ""); text = text.replace(/ /gi,""); console.dir(text) return text; 출처 구글선생님들 🙇🏻‍♀️

항상 고정으로 정해두는게 아닌 동적으로 metatag를 넣구 싶을때?? 코드 $("meta[property='og\\:title']").attr('content', 'title'); $("meta[property='og\\:url']").attr('content', 'url'); $("meta[property='og\\:description']").attr('content', 'description'); $("meta[property='og\\:imageurl']").attr('content', 'imageUrl'); 얍 완성 끗 그럼 안뇽🙇🏻‍♀️