! 제품 버전을 정확하게 입력해 주세요.
제품 버전이 정확하게 기재되어 있지 않은 경우,
최신 버전을 기준으로 안내 드리므로
더욱 빠르고 명확한 안내를 위해
제품 버전을 정확하게 입력해 주세요!

Node.js를 사용하여 Excel XLSX를 가져오고 내보내는 방법 > 온라인 스터디

본문 바로가기

고급기능 Node.js를 사용하여 Excel XLSX를 가져오고 내보내는 방법

페이지 정보

작성자 GrapeCity 작성일 2023-05-11 10:12 조회 982회 댓글 0건

본문

첨부파일

Node.js 응용 프로그램에서 Excel 파일을 생성해야 하는 경우가 있습니다. 데이터베이스 또는 웹 서비스에서 데이터를 가져온 다음 추가 보고 또는 분석을 위해 Excel 파일로 출력해야 할 수도 있습니다. SpreadJS를 사용하면 서버에 Excel이 없어도 해당 작업을 수행할 수 있습니다.


Node.js는 일반적으로 네트워크 응용 프로그램을 만드는 데 널리 사용되는 이벤트 기반 JavaScript 런타임입니다.

여러 연결을 동시에 처리할 수 있으며 대부분의 다른 모델처럼 스레드에 의존하지 않습니다.


이번 스터디에서는 SpreadJS를 사용하여 사용자가 입력한 정보를 수집하고 Node.js 응용 프로그램에서 자동으로 Excel 파일을 내보내는 방법에 대해 알아봅니다.


  1. SpreadJS 및 Node.js 시작하기

  2. SpreadJS npm 패키지 사용

  3. Node.js 응용 프로그램에서 Excel 파일 읽기

  4. 사용자 입력 수집

  5. Excel 파일 채우기

  6. Excel로 Node.js 내보내기


SpreadJS를 사용하면 SpreadJS 또는 Node.js 사용 여부는 성능에 영향을 미치지 않습니다. 해당 프로젝트에 대한 샘플 zip을 다운로드하세요.


XLSX Node.js 가져오기/내보내기



SpreadJS 스프레드시트 및 Node.js 시작하기 


시작하려면 Node.js와 Mock-Browser, BufferJS, FileReader를 설치해야 하며, 각각 다음 링크에서 찾을 수 있습니다.


 

대부분의 IDE를 사용하여 이 응용 프로그램을 만들 수 있지만 해당 스터디에서는 Visual Studio 2019를 사용합니다. Visual Studio가 열리면 새 프로젝트 만들기를 사용하여 새 응용 프로그램을 만든 다음 "Blank Node.js Console Application"을 검색하세요. 이름을 지정하고 프로젝트를 만들 위치를 지정하면 됩니다.


그러면 필요한 파일이 자동으로 생성되고, "app.js" 파일이 열립니다. 우리는 해당 파일만 변경할 것입니다.


프로젝트에 패키지를 설치하려면 Solution Explorer에서 "npm" 헤더를 마우스 오른쪽 버튼으로 클릭하고 새 npm 패키지 설치를 클릭합니다. 다음으로 "Mock-Browser", "BufferJS" 및 "FileReader"에 대한 각 패키지를 검색 및 설치합니다.


설치한 후에는 package.json 파일에서 종속성이 업데이트됩니다.


{
  "name": "spread-jsnode-js",
  "version": "0.0.1",
  "description": "SpreadJSNodeJS",
  "main": "app.js",
  "author": {
    "name": ""
  },
  "dependencies": {
    "@grapecity/spread-excelio": "^16.0.4",
    "@grapecity/spread-sheets": "^16.0.4",
    "bufferjs": "^3.0.1",   
    "filereader": "^0.10.3",
    "mock-browser": "^0.92.14"
  }
}


이 샘플에서는 Node.js의 파일 시스템 모듈을 사용할 것입니다. 다음 위치에 로드할 수 있습니다.

var fs = require('fs');


SpreadJS와 Node.js를 사용하기 위해 설치했던 Mock-Browser를 로드합니다.

var mockBrowser = require('mock-browser').mocks.MockBrowser;


SpreadJS 스크립트를 로드하기 전에 mock-browser를 초기화해야 합니다. 추후 응용 프로그램에서 사용해야 할 변수, 특히 "window" 변수를 초기화합니다.

global.window = mockBrowser.createWindow();
global.document = window.document;
global.navigator = window.navigator;
global.HTMLCollection = window.HTMLCollection;
global.getComputedStyle = window.getComputedStyle;


FileReader 라이브러리를 초기화합니다.

var fileReader = require('filereader');
global.FileReader = fileReader;



SpreadJS npm 패키지 사용 


SpreadJS 및 ExcelIO 패키지를 프로젝트에 추가해야 합니다. Solution Explorer에서 "npm" 섹션을 마우스 오른쪽 버튼으로 클릭하고 새 npm 패키지 설치를 선택하여 프로젝트에 추가할 수 있습니다. "GrapeCity"를 검색하고 다음 두 가지 패키지를 설치할 수 있습니다.


  • @grapecity/spread-sheets
  • @grapectiy/spread-excelio
 

SpreadJS npm 패키지가 프로젝트에 추가된 후, package.json은 올바른 종속성을 사용하여 자동으로 업로드되어야 합니다.

{
  "name": "spread-jsnode-js",
  "version": "0.0.1",
  "description": "SpreadJSNodeJS",
  "main": "app.js",
  "author": {
    "name": ""
  },
  "dependencies": {
    "@grapecity/spread-excelio": "^16.0.4",
    "@grapecity/spread-sheets": "^16.0.4",
    "bufferjs": "^3.0.1",
    "filereader": "^0.10.3",
    "mock-browser": "^0.92.14"
  }
}


이제 app.js 파일에서 다음 작업을 수행해야 합니다.

var GC = require('@grapecity/spread-sheets');
var SJSExcel = require('@grapecity/spread-excelio');


npm 패키지를 사용할 때 다음 두 가지에 대한 라이선스 키도 설정해야 합니다.

GC.Spread.Sheets.LicenseKey = "<YOUR KEY HERE>";
SJSExcel.LicenseKey = "<YOUR KEY HERE>";


해당 응용 프로그램에서는 사용 중인 SpreadJS 버전을 사용자에게 보여 줍니다.

그러려면 package.json 파일을 요구한 다음, 종속성을 참조해 버전 번호를 가져올 수 있습니다.

var packageJson = require('./package.json');
console.log('\n** Using SpreadJS Version "' + packageJson.dependencies["@grapecity/spread-sheets"] + '" **');



Node.js 응용 프로그램으로 Excel 파일 읽기 


기존 Excel 템플릿 파일을 읽고 사용자로부터 데이터를 가지고 옵니다. 그런 다음 데이터를 파일로 저장하고 내보냅니다. 이 경우 파일은 사용자가 편집할 수 있는 송장이 됩니다.


통합 문서 및 Excel IO 변수와 시트 인덱스에 대한 변수를 초기화하는 것으로 시작합니다.

var wb = new GC.Spread.Sheets.Workbook();

var billingInvoiceSheetIndex = 1;
var companySetupSheetIndex = 2;

var excelIO = new SJSExcel.IO();


파일에서 확인한 대로 코드를 try/catch 블록으로 줄바꿈해 보겠습니다. 그런 다음 "readline" 변수를 초기화합니다. 이것은 사용자가 콘솔에 입력한 데이터를 읽을 수 있는 라이브러리입니다.


다음으로, Excel 파일을 쉽게 작성하는 데 사용할 수 있는 JavaScript 배열에 저장해 보겠습니다.

// Instantiate the spreadsheet and modify it
console.log('\nManipulating Spreadsheet\n---');
try {
    var file = fs.readFileSync('./content/billingInvoiceTemplate.xlsx');
    excelIO.open(file.buffer, (data) => {
        wb.fromJSON(data);
        const readline = require('readline');

        var invoice = {
            generalInfo: [],
            invoiceItems: [],
            companyDetails: []
        };
    });
} catch (e) {
    console.error("** Error manipulating spreadsheet **");
    console.error(e);
}



사용자 입력 수집 


Excel Node.js 가져오기/내보내기


위 이미지는 우리가 사용하고 있는 Excel 파일입니다. 가장 먼저 수집하고자 하는 정보는 일반적인 송장 정보입니다. excelio.open 호출 내에서 별도의 함수를 만듭니다. 이는 사용자에게 필요한 각 항목 메시지를 콘솔에 표시할 수 있습니다.


각 입력 후에 해당 섹션에 대한 모든 입력이 있을 때 데이터를 저장할 별도의 배열을 만들 수 있습니다.


생성한 invoice.generalInfo 배열로 푸시합니다.

function fillGeneralInformation() {
    console.log("-----------------------\nFill in Invoice Details\n-----------------------")
    const rl = readline.createInterface({
        input: process.stdin,
        output: process.stdout
    });
    var generalInfoArray = [];
    rl.question('Invoice Number: ', (answer) => {
        generalInfoArray.push(answer);
        rl.question('Invoice Date (dd Month Year): ', (answer) => {
            generalInfoArray.push(answer);
            rl.question('Payment Due Date (dd Month Year): ', (answer) => {
                generalInfoArray.push(answer);
                rl.question('Customer Name: ', (answer) => {
                    generalInfoArray.push(answer);
                    rl.question('Customer Company Name: ', (answer) => {
                        generalInfoArray.push(answer);
                        rl.question('Customer Street Address: ', (answer) => {
                            generalInfoArray.push(answer);
                            rl.question('Customer City, State, Zip (<City>, <State Abbr> <Zip>): ', (answer) => {
                                generalInfoArray.push(answer);
                                rl.question('Invoice Company Name: ', (answer) => {
                                    generalInfoArray.push(answer);
                                    rl.question('Invoice Street Address: ', (answer) => {
                                        generalInfoArray.push(answer);
                                        rl.question('Invoice City, State, Zip (<City>, <State Abbr> <Zip>): ', (answer) => {
                                            generalInfoArray.push(answer);
                                            rl.close();

                                            invoice.generalInfo.push({
                                                "invoiceNumber": generalInfoArray[0],
                                                "invoiceDate": generalInfoArray[1],
                                                "paymentDueDate": generalInfoArray[2],
                                                "customerName": generalInfoArray[3],
                                                "customerCompanyName": generalInfoArray[4],
                                                "customerStreetAddress": generalInfoArray[5],
                                                "customerCityStateZip": generalInfoArray[6],
                                                "invoiceCompanyName": generalInfoArray[7],
                                                "invoiceStreetAddress": generalInfoArray[8],
                                                "invoiceCityStateZip": generalInfoArray[9],
                                            });
                                            console.log("General Invoice Information Stored");
                                            fillCompanyDetails();
                                        });
                                    });
                                });
                            });
                        });
                    });
                });
            });
        });
    });
}


"fillCompanyDetails" 함수에서 회사에 대한 정보를 수집합니다.

통합 문서의 두 번째 시트를 작성합니다. 이 함수는 이전 함수 기능과 매우 유사합니다.

function fillCompanyDetails() {
    console.log("-----------------------\nFill in Company Details\n-----------------------");
    const rl = readline.createInterface({ input: process.stdin, output: process.stdout });
    var companyDetailsArray = []
    rl.question('Your Name: ', (answer) => {
        companyDetailsArray.push(answer);
        rl.question('Company Name: ', (answer) => {
            companyDetailsArray.push(answer);
            rl.question('Address Line 1: ', (answer) => {
                companyDetailsArray.push(answer);
                rl.question('Address Line 2: ', (answer) => {
                    companyDetailsArray.push(answer);
                    rl.question('Address Line 3: ', (answer) => {
                        companyDetailsArray.push(answer);
                        rl.question('Address Line 4: ', (answer) => {
                            companyDetailsArray.push(answer);
                            rl.question('Address Line 5: ', (answer) => {
                                companyDetailsArray.push(answer);
                                rl.question('Phone: ', (answer) => {
                                    companyDetailsArray.push(answer);
                                    rl.question('Facsimile: ', (answer) => {
                                        companyDetailsArray.push(answer);
                                        rl.question('Website: ', (answer) => {
                                            companyDetailsArray.push(answer);
                                            rl.question('Email: ', (answer) => {
                                                companyDetailsArray.push(answer);
                                                rl.question('Currency Abbreviation: ', (answer) => {
                                                    companyDetailsArray.push(answer);
                                                    rl.question('Beneficiary: ', (answer) => {
                                                        companyDetailsArray.push(answer);
                                                        rl.question('Bank: ', (answer) => {
                                                            companyDetailsArray.push(answer);
                                                            rl.question('Bank Address: ', (answer) => {
                                                                companyDetailsArray.push(answer);
                                                                rl.question('Account Number: ', (answer) => {
                                                                    companyDetailsArray.push(answer);
                                                                    rl.question('Routing Number: ', (answer) => {
                                                                        companyDetailsArray.push(answer);
                                                                        rl.question('Make Checks Payable To: ', (answer) => {
                                                                            companyDetailsArray.push(answer); rl.close();
                                                                            invoice.companyDetails.push({ "yourName": companyDetailsArray[0], "companyName": companyDetailsArray[1], "addressLine1": companyDetailsArray[2], "addressLine2": companyDetailsArray[3], "addressLine3": companyDetailsArray[4], "addressLine4": companyDetailsArray[5], "addressLine5": companyDetailsArray[6], "phone": companyDetailsArray[7], "facsimile": companyDetailsArray[8], "website": companyDetailsArray[9], "email": companyDetailsArray[10], "currencyAbbreviation": companyDetailsArray[11], "beneficiary": companyDetailsArray[12], "bank": companyDetailsArray[13], "bankAddress": companyDetailsArray[14], "accountNumber": companyDetailsArray[15], "routingNumber": companyDetailsArray[16], "payableTo": companyDetailsArray[17] });
                                                                            console.log("Invoice Company Information Stored");
                                                                            console.log("-----------------------\nFill in Invoice Items\n-----------------------");
                                                                            fillInvoiceItemsInformation();
                                                                        });
                                                                    });
                                                                });
                                                            });
                                                        });
                                                    });
                                                });
                                            });
                                        });
                                    });
                                });
                            });
                        });
                    });
                });
            });
        });
    });
}


이제 송장에 대한 기본 정보를 얻었으므로 개별 송장 항목을 수집하는 데 집중할 수 있습니다.


이 항목은 "fillInvoiceItemsInformation"이라는 다른 함수로 수행할 것입니다. 각 항목을 추가하기 전, 사용자에게 항목을 추가할지 묻습니다.


"y"를 계속 입력하면 해당 항목의 정보를 수집한 다음 "n"을 입력할 때까지 다시 묻습니다.

function fillInvoiceItemsInformation() {
    const rl = readline.createInterface({
        input: process.stdin, output: process.stdout
    });
    var invoiceItemArray = [];
    rl.question('Add item?(y/n): ', (answer) => {
        switch (answer) {
            case "y": console.log("-----------------------\nEnter Item Information\n-----------------------");
                rl.question('Quantity: ', (answer) => {
                    invoiceItemArray.push(answer);
                    rl.question('Details: ', (answer) => {
                        invoiceItemArray.push(answer);
                        rl.question('Unit Price: ', (answer) => {
                            invoiceItemArray.push(answer);
                            invoice.invoiceItems.push({
                                "quantity": invoiceItemArray[0], "details": invoiceItemArray[1], "unitPrice": invoiceItemArray[2]
                            });
                            console.log("Item Information Added");
                            rl.close();
                            fillInvoiceItemsInformation();
                        });
                    });
                });
                break;
            case "n": rl.close();
                return fillExcelFile();
                break;
            default: console.log("Incorrect option, Please enter 'y' or 'n'.");
        }
    });
}



Excel 스프레드시트에 데이터 추가 


필요한 송장 정보를 모두 수집한 후에는 Excel 파일을 작성할 수 있습니다.

청구 정보 및 회사 설정의 경우 JavaScript 배열에서 셀의 각 값을 수동으로 설정할 수 있습니다.

function fillExcelFile() {
    console.log("-----------------------\nFilling in Excel file\n-----------------------");
    fillBillingInfo();
    fillCompanySetup();
}

function fillBillingInfo() {
    var sheet = wb.getSheet(billingInvoiceSheetIndex);
    sheet.getCell(0, 2).value(invoice.generalInfo[0].invoiceNumber);
    sheet.getCell(1, 1).value(invoice.generalInfo[0].invoiceDate);
    sheet.getCell(2, 2).value(invoice.generalInfo[0].paymentDueDate);
    sheet.getCell(3, 1).value(invoice.generalInfo[0].customerName);
    sheet.getCell(4, 1).value(invoice.generalInfo[0].customerCompanyName);
    sheet.getCell(5, 1).value(invoice.generalInfo[0].customerStreetAddress);
    sheet.getCell(6, 1).value(invoice.generalInfo[0].customerCityStateZip);
    sheet.getCell(3, 3).value(invoice.generalInfo[0].invoiceCompanyName);
    sheet.getCell(4, 3).value(invoice.generalInfo[0].invoiceStreetAddress);
    sheet.getCell(5, 3).value(invoice.generalInfo[0].invoiceCityStateZip);
}

function fillCompanySetup() {
    var sheet = wb.getSheet(companySetupSheetIndex);
    sheet.getCell(2, 2).value(invoice.companyDetails[0].yourName);
    sheet.getCell(3, 2).value(invoice.companyDetails[0].companyName);
    sheet.getCell(4, 2).value(invoice.companyDetails[0].addressLine1);
    sheet.getCell(5, 2).value(invoice.companyDetails[0].addressLine2);
    sheet.getCell(6, 2).value(invoice.companyDetails[0].addressLine3);
    sheet.getCell(7, 2).value(invoice.companyDetails[0].addressLine4);
    sheet.getCell(8, 2).value(invoice.companyDetails[0].addressLine5);
    sheet.getCell(9, 2).value(invoice.companyDetails[0].phone);
    sheet.getCell(10, 2).value(invoice.companyDetails[0].facsimile);
    sheet.getCell(11, 2).value(invoice.companyDetails[0].website);
    sheet.getCell(12, 2).value(invoice.companyDetails[0].email);
    sheet.getCell(13, 2).value(invoice.companyDetails[0].currencyAbbreviation);
    sheet.getCell(14, 2).value(invoice.companyDetails[0].beneficiary);
    sheet.getCell(15, 2).value(invoice.companyDetails[0].bank);
    sheet.getCell(16, 2).value(invoice.companyDetails[0].bankAddress);
    sheet.getCell(17, 2).value(invoice.companyDetails[0].accountNumber);
    sheet.getCell(18, 2).value(invoice.companyDetails[0].routingNumber);
    sheet.getCell(19, 2).value(invoice.companyDetails[0].payableTo);
}


우리가 사용하는 템플릿에는 송장의 항목에 대해 정해진 수의 행이 배치되어 있습니다. 최댓값보다 많이 추가하려면 시트에 행을 더 추가하면 됩니다.


배열에서 시트의 항목을 설정하기 전에 행을 추가합니다.

function fillInvoiceItems() {
    var sheet = wb.getSheet(billingInvoiceSheetIndex);
    var rowsToAdd = 0;
    if (invoice.invoiceItems.length > 15) {
        rowsToAdd = invoice.invoiceItems.length - 15;
        sheet.addRows(22, rowsToAdd);
    }
    var rowIndex = 8;
    if (invoice.invoiceItems.length >= 1) {
        for (var i = 0; i < invoice.invoiceItems.length; i++) {
            sheet.getCell(rowIndex, 1).value(invoice.invoiceItems[i].quantity);
            sheet.getCell(rowIndex, 2).value(invoice.invoiceItems[i].details);
            sheet.getCell(rowIndex, 3).value(invoice.invoiceItems[i].unitPrice);
            rowIndex++;
        }
    }
}


Excel XLSX 스프레드시트에 Node.js 내보내기  


통합 문서에 정보를 입력한 후에는 해당 문서를 Excel 파일로 내보낼 수 있습니다. 우리는 excelio open 함수를 사용할 것입니다.


이 경우 파일 이름에 날짜를 입력하면 됩니다.

function exportExcelFile() {
    excelIO.save(wb.toJSON(), (data) => {
        fs.appendFileSync('Invoice' + new Date().valueOf() + '.xlsx', new Buffer(data), function (err) {
            console.log(err);
        });
        console.log("Export success");
    }, (err) => {
        console.log(err);
    }, { useArrayBuffer: true });
}


위의 코드 조각을 사용하여 통합 문서를 Excel 파일로 내보낼 수 있습니다.

완료된 파일은 다음과 같습니다.

Excel Node.js 가져오기/내보내기


SpreadJS와 Node.js를 활용하는 것은 SpreadJS의 다기능성과 확장성을 증명하는 예입니다. Node.js를 사용하여 Excel XLSX를 가져오고 내보내는 방법에 대해 알아보았습니다.


다음 유익한 글로 또 찾아뵙겠습니다.




지금 바로 SpreadJS를 다운로드하여 직접 테스트해 보세요!

spjs.png


  • 페이스북으로 공유
  • 트위터로  공유
  • 링크 복사
  • 카카오톡으로 보내기

댓글목록

등록된 댓글이 없습니다.

메시어스 홈페이지를 통해 제품에 대해서 더 자세히 알아 보세요!
홈페이지 바로가기

태그1

메시어스 홈페이지를 통해 제품에 대해서 더 자세히 알아 보세요!
홈페이지 바로가기
이메일 : sales-kor@mescius.com | 전화 : 1670-0583 | 경기도 과천시 과천대로 7길 33, 디테크타워 B동 1107호 메시어스(주) 대표자 : 허경명 | 사업자등록번호 : 123-84-00981 | 통신판매업신고번호 : 2013-경기안양-00331 ⓒ 2024 MESCIUS inc. All rights reserved.