본문 바로가기
블로그 이미지

방문해 주셔서 감사합니다! 항상 행복하세요!

  
   - 문의사항은 메일 또는 댓글로 언제든 연락주세요.
   - "해줘","답 내놔" 같은 질문은 답변드리지 않습니다.
   - 메일주소 : lts06069@naver.com


Javascript/[중요] Javascript26

Excel파일 웹에서 Table로 표현 xlsx파일을 읽어서 웹에서 표출하는 방법은 Sheetjs라는 라이브러리를 사용하면 편리하게 구현 가능 하다. 위 예제코드는 input type file에서의 예제코드이다. ajax로 바꾸는것도 어렵지는 않다. workbook에 메타데이터를 활용하면 여러 형태로 가공이 편리하다. 2019. 6. 18.
ES6 문법을 HTML에 활용해보기 export class userClass { constructor() { //생성자를 통해 내부 변수를 만들 수 있다. } accessToServer(server_url, param) { return new Promise((resolve, reject) => { //Promise 객체를 통해 ajax 통신 후 이벤트를 받로독 한다. $.ajax({ url: server_url, //보낼주소 type: 'post', data: param, //보낼 데이터 success: function (result) { resolve(result); //성공시 행위 }, error: function (errors) { reject(errors); //실패시 행위 } }); }); } } 자바스크립트 버전이 ES6이 등장.. 2019. 4. 27.
Input type File 다중 파일 선택 & Ajax 전송 input type file 테그 속성중에 multiple이라는 속성이 있다. 해당 속성을 선택하면 파일이 여러개 선택 되는데, 해당 데이터가 배열로 리턴된다. 해당 내용을 한번에 던져도 상관없지만 만약 프로그래스를 구현하려면 각각 전송하는 것을 권장한다. function sendData(){ $.each(formArray, function (uniquId, DATA) { //앞서 유니크한 아이디로 프로그래스 아이디를 매칭하면 파일마다 각각 //전송상태 효과를 줄 수 있다. $.ajax({ url: '주소', xhr: function() { var myXhr = $.ajaxSettings.xhr(); //PROGRESS_KEY 값에 앞서 지정한 유니크한아이디를 넣어주자. myXhr.upload.PROGR.. 2019. 4. 27.
Firebase 파일다운로드 크로스 도메인(Cross-origin) 파이어베이스 연동을 하다보면 파일 업로드는 뭐 상관없이 되는데.. 파일 다운로드를 하는 경우에 데이터가 있는 곳을 url로 주기 때문에 일반 웹에서 접근하면 크로스 도메인에 걸리게 된다. 뭐..jsonp나 기타등등 방법을 사용해도 안된다. 아무튼, 이 현상을 해결하려면 검색에서 "Firebase 저장소 크로스도메인" 이런 내용으로 검색하면 해결 방법이 나온다. 대충 몇자 적어보면, 1. Cloud SDK 설치 프로그램을 다운로드 2. Google Cloud SDK shell 실행 3. gcloud components update로 업데이트를 수행 (옵션, 안해도된다.) 4. gsutil 명령어 실행 5. 변경할 프로젝트 선택 6. cors.json 파일 만들기 7. 변경할 버킷 url 가져와서 set 명.. 2019. 4. 27.
Javascript로 일반 문자열을 배열로 파싱, 변환 서버에서 데이터를 받은 경우에..헤더나 네트워크문제로 해당 데이터가 객체가 아니라 일반 문자열로 들어오는 경우가 있다. 또는 콤마, json형식처럼 보이는 문자열을 가져와서 파싱만 해주면 반복문으로 사용하면 참 편리한데 이걸 일일이 split하거나 사용자 정의의 파싱메소드를 만들기에는 참 귀찮은 일이지 않을 수 없다. 이럴때는 아래 소스코드를 활용하면 쉽게 배열형태의 객체로 파싱이 가능하다. var string = "0,1,2,3,4,5"; //콤마로된 문자열 var objectstring = '{Name:"김이사", number:12345}'; //json형태의 문자열 var stringToArray = (new Function("return [" + string+ "];")()); var object.. 2019. 4. 27.
익스플로러에서 간단한 파일다운로드 기능 익스플로러를 쓰는 인구의 비중이 아마도..우라니라만 무지 높을 것 같다. 공공기관을 가보면 대부분의 실무자들이 익스플로러만 쓴다....엣지는요..?ㅠㅠ ​ 크롬, 파폭, 엣지에서 잘 되던 기능이 익스플로러만 가면 안되는 경우가 너무나도 많으며...특히 HTML5에서 태그들의 좋은 속성이 잘 안되는 경우가 허다 하다. ​ 특히..a테그의 download 기능은 무척이나 편리해서...서버에서 따로 작업을 안해도 간단한 파일 따위는 브라우저가 알아서 파일 다운로드를 하게 해주는데.. 문제는 익스플로러에서는 이 download 속성이 지원되지 않는 것이다. ​ 그러면 서버에서 응답하는 프로세스를 만들어야하는데..무척이나 귀찮고 하기 싫은 일이다. 자바스크립트에서는 navigator객체를 통해서 여러 기능을 지원.. 2019. 4. 27.