고급기능 JavaScript 로직을 통해, URL에서 XLSX를 가져오는 방법
페이지 정보
작성자 GrapeCity 작성일 2021-08-23 16:23 조회 1,175회 댓글 0건본문
관련링크
SpreadJS의 ExcelIO 모듈은 Excel 파일을 가져오고 내보내기 위한 순수 JavaScript 로직를 포함하며 SpreadJS에 내장되어 있습니다.
이 기능은 응용 프로그램 플랫폼을 독립형으로 구축해야 할 때 유용합니다.
이 모듈에는 Windows Server가 필요하지 않으며 JavaScript가 있는 단순 HTML 페이지에서 실행할 수 있습니다. 이 옵션을 사용하여 사용자의 시스템에서 파일을 가져오고 해당 URL을 사용하여 서버에 호스팅된 Excel 파일을 가져올 수 있습니다.
아래에는 만들려는 프로젝트의 호스팅 샘플 버전이 나와 있습니다.
프로젝트 설정
HTML 파일을 만들고 평가판 SJS 파일, 특히 CSS 파일, 주 SJS 라이브러리 및 ExcelIO 라이브러리에 대한 참조를 추가하는 것부터 시작합니다.
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title>SpreadJS ExcelIO URL</title> <link href="http://cdn.grapecity.com/spreadjs/hosted/css/gc.spread.sheets.excel2013white.14.1.1.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="http://cdn.grapecity.com/spreadjs/hosted/scripts/gc.spread.sheets.all.14.1.1.min.js"></script> <script type="text/javascript" src="http://cdn.grapecity.com/spreadjs/hosted/scripts/interop/gc.spread.excelio.14.1.1.min.js"></script> </head> <body> </body> </html>
페이지를 배포하려면 라이선스 키도 추가해야 합니다.
<script> GC.Spread.Sheets.LicenseKey = "<Your Deployment Key>"; </script>
일부 코드를 추가하여 컴포넌트와 ExcelIO 모듈을 초기화합니다.
<script> var workbook, excelIO; window.onload = function () { workbook = new GC.Spread.Sheets.Workbook(document.getElementById("spreadSheet")); excelIo = new GC.Spread.Excel.IO(); } </script>
설정을 완료하려면 페이지 본문에 SpreadJS 컴포넌트를 호스팅할 DIV를 추가하십시오.
<body> <div id="spreadSheet" style="width: 860px; height: 498px; border: 1px solid gray"></div> </body>
ExcelIO 코드 추가
다음 단계는 두 가지 HTML 입력 요소, 즉 가져올 URL을 지정하는 요소와 버튼을 클릭하여 파일을 가져오는 요소를 추가하는 것입니다. 이 샘플의 경우 HTML을 호스팅하는 폴더에 파일을 이미 업로드했습니다.
참고: 동일한 폴더에 있지 않으면 CORS 예외가 발생합니다. 이것은 누구도 악의적인 파일을 가져오지 못하도록 하는 보안 조치입니다.
<input id="importUrl" value="http://cdn.grapecity.com/spreadjs/hosted/samples/SpreadJSExcelIOURL/Test.xlsx" /> <input id="btnExcelUpload" type="button" onclick="loadFile()" value="Load Excel File" />
이제 URL에서 Excel 파일을 로드하기 위해 버튼에 코드를 추가합니다. 이 작업을 수행하려면 파일을 로드하기 위해 ExcelIO 논리와 결합된 XMLHttpRequest를 사용하십시오.
function loadFile() { var excelUrl = document.getElementById("importUrl").value; var oReq = new XMLHttpRequest(); oReq.open('get', excelUrl, true); oReq.responseType = 'blob'; oReq.onload = function () { var blob = oReq.response; excelIo.open(blob, function (json) { jsonData = json; workbook.fromJSON(json); }, function (message) { console.log(message); }); }; oReq.send(null); }
이제 모두 완료되었습니다. 이것이 ExcelIO 모듈을 사용하여 지정된 URL에서 SpreadJS로 Excel 파일을 가져오는 데 필요한 모든 코드입니다.
지금 바로 SpreadJS를 다운로드하여 직접 테스트해보세요!
댓글목록
등록된 댓글이 없습니다.