고급기능 Node.js 응용 프로그램에서 Excel 시트를 생성하는 방법
페이지 정보
작성자 GrapeCity
작성일 2021-08-23 16:38 조회 1,591회
댓글 0건
본문
첨부파일
관련링크
를 사용하면 서버에 Excel이 없어도 이 작업을 수행할 수 있습니다.
Node.js는 일반적으로 네트워크 응용 프로그램을 만드는 데 많이 사용되는 이벤트 기반 JavaScript 런타임입니다. 여러 연결을 동시에 처리할 수 있으며 대부분의 다른 모델처럼 스레드에 의존하지 않습니다.
이 튜토리얼에서는 SpreadJS를 사용하여 사용자가 입력한 정보를 수집하고 Node.js 응용 프로그램에서 자동으로 Excel 파일로 내보냅니다. SpreadJS를 사용하면 SpreadJS 또는 Node.js 사용 여부가 성능에 영향을 미치지 않습니다.
이 프로젝트의 샘플 zip은 .
SpreadJS 및 Node.js 시작하기
시작하려면 Node.js와 Mock-Browser, BufferJS, FileReader를 설치해야 하며, 모두 다음 링크에서 찾을 수 있습니다.
Visual Studio 2019를 사용하여 응용 프로그램을 만들 예정입니다.
Visual Studio가 열리면 새 프로젝트 만들기를 사용하여 새 응용 프로그램을 만든 다음 "Blank Node.js Console Application"을 검색하십시오. 이름을 지정한 다음 프로젝트를 만들 위치를 지정하십시오.
그러면 필요한 파일이 자동으로 생성되고 "app.js" 파일이 열립니다. 이 파일만 변경할 것입니다.
프로젝트에 패키지를 설치하려면 Solution Explorer에서 "npm" 헤더를 마우스 오른쪽 버튼으로 클릭하고 새 npm 패키지 설치를 클릭한 다음 "Mock-Browser", "BufferJS" 및 "FileReader"에 대한 각 패키지를 검색 및 설치합니다.
설치한 후에는 package.json file에서 종속성이 업데이트됩니다.
{
"name": "spread-jsnode-js",
"version": "0.0.0",
"description": "SpreadJSNodeJS",
"main": "app.js",
"author": {
"name": ""
},
"dependencies": {
"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 Sheets 및 ExcelIO 패키지를 프로젝트에 추가해야 합니다.
Solution Explorer에서 "npm" 섹션을 마우스 오른쪽 버튼으로 클릭하고 새 npm 패키지 설치를 선택하여 프로젝트에 추가할 수 있습니다. "GrapeCity"를 검색하고 다음 2개의 패키지를 설치할 수 있습니다.
@grapecity/spread-sheets
@grapectiy/spread-excelio
SpreadJS npm 패키지가 프로젝트에 추가된 후에 package.json은 올바른 종속성을 사용하여 자동으로 업로드되어야 합니다.
{
"name": "spread-jsnode-js",
"version": "0.0.0",
"description": "SpreadJSNodeJS",
"main": "app.js",
"author": {
"name": ""
},
"dependencies": {
"@grapecity/spread-excelio": "^14.1.2",
"@grapecity/spread-sheets": "^14.1.2",
"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 excelIO = new SJSExcel.IO();
파일에서 읽은 대로 코드를 시도/캐치 블록으로 줄바꿈해 보겠습니다.
그런 다음 "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 파일입니다.
첫 번째로 수집하고자 하는 정보는 일반적인 송장 정보입니다.
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(0);
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(1);
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(0);
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로 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 파일로 내보낼 수 있습니다. 완료된 파일은 다음과 같습니다.
문자열의 SpreadJS와 Node.js를 사용하는 것은 SpreadJS의 다기능성과 확장성을 증명하는 예입니다. 관련 문서, 데모, 비디오 및 튜토리얼은 를 참조하십시오.
지금 바로 SpreadJS를 다운로드하여 직접 테스트해보세요!
댓글목록
등록된 댓글이 없습니다.
