이미지 리사이징 유틸 만들기 #167
이미지 리사이징 유틸 만들기 #167
Conversation
|
울 웹쁜이 고생많았어 ! 여기서 미리보기로 보면서 쉬어~ 다른 웹쁜이들한테도 자랑해줘~ |
| if (agent.indexOf('chrome') !== -1) return 'Chrome'; | ||
| if (agent.indexOf('opera') !== -1) return 'Opera'; | ||
| if (agent.indexOf('staroffice') !== -1) return 'Star Office'; | ||
| if (agent.indexOf('webtv') !== -1) return 'WebTV'; | ||
| if (agent.indexOf('beonex') !== -1) return 'Beonex'; | ||
| if (agent.indexOf('chimera') !== -1) return 'Chimera'; | ||
| if (agent.indexOf('netpositive') !== -1) return 'NetPositive'; | ||
| if (agent.indexOf('phoenix') !== -1) return 'Phoenix'; | ||
| if (agent.indexOf('firefox') !== -1) return 'Firefox'; | ||
| if (agent.indexOf('safari') !== -1) return 'Safari'; | ||
| if (agent.indexOf('skipstone') !== -1) return 'SkipStone'; | ||
| if (agent.indexOf('netscape') !== -1) return 'Netscape'; | ||
| if (agent.indexOf('mozilla/5.0') !== -1) return 'Mozilla'; | ||
| if (agent.indexOf('msie') !== -1) return 'Internet Explorer'; |
There was a problem hiding this comment.
브라우저 다양한 거 새삼 느낀다.. 익스플로러도 챙겼넹 ㅋㅋㅋㅋ
There was a problem hiding this comment.
사실 반 넘게 안 쓰는데 누가 저렇게 해놨길래 가져왔어요잉
| const { dWidth, dHeight } = getWidthHeight(imageBitmap, maxSquare); | ||
| canvas.width = dWidth; | ||
| canvas.height = dHeight; | ||
| context.drawImage(imageBitmap, 0, 0, dWidth, dHeight); |
There was a problem hiding this comment.
dWidth랑 dHeight가 뭔가 했는데 destination의 d구나..!
There was a problem hiding this comment.
공식 문서에 변수 이름이 dWidth랑 dHeight로 되어 있어가지구 그렇게 하였으..!!
There was a problem hiding this comment.
이 경우에는 한번 만들어놓고 갖다쓰는 유틸 함수라 어엄청 중요하지는 않지만 만약 비슷한 경우가 있다면 나는 그래도 풀어서 쓰는게 좋지 않나 생각! 문서 보지 않은 사람도 이해할 수 있는게 더 좋은 것 같아
There was a problem hiding this comment.
얍얍..!! 다른 곳에서 많이 export되는 친구들을 쓸 때에는 유의하겠어유..!!
| alert('이미지 파일을 첨부해주세요'); | ||
| fireToast({ content: '이미지 파일을 첨부해주세요' }); |
| setFileThumbnail(URL.createObjectURL(file)); | ||
| if (!file) return fireToast({ content: '이미지 파일을 첨부해주세요' }); | ||
| if (file.name.match(imgFileForm)) { | ||
| if (checkBrowser('Internet Explorer')) { |
There was a problem hiding this comment.
checkBrowser 여기에 쓰려고 만들었구나~ 앞으로 또 유용하게 쓸 일 있을 것 같아!!
IE에서는 createBitmap 함수가 없기 때문입니다!! 그럼 안 정의된 함수라고 오류가 나기 때문에 그렇게 처리해두었어유 |
⛓ Related Issues
📋 작업 내용
📌 PR Point
무슨 이유로 어떻게 코드를 변경했는지
어떤 위험이나 우려가 발견되었는지
atob,unescape는 deprecate되었다고 뜨지만, 대체할 수 있는 함수를 못 찾았습니다..🔬 Reference
https://developer.mozilla.org/en-US/docs/Web/API/createImageBitmap
https://blog.naver.com/PostView.nhn?blogId=okskmk2&logNo=221763461417&parentCategoryNo=&categoryNo=148&viewDate=&isShowPopularPosts=false&from=postView
https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/drawImage
https://stackoverflow.com/questions/27159179/how-to-convert-blob-to-file-in-javascript