development

Javascript를 통해 Excel을 생성하는 방법

big-blog 2020. 12. 30. 20:18
반응형

Javascript를 통해 Excel을 생성하는 방법


Javascript를 통해 Excel / CSV를 생성하는 방법이 있습니까? (브라우저와도 호환되어야합니다)


github에 Excel Builder (.js) 라는 흥미로운 프로젝트가 있습니다.이 프로젝트 는 클라이언트 측에서 Excel xlsx 파일 을 다운로드하는 방법을 제공 하고 Excel 스프레드 시트 형식을 지정하는 옵션을 포함합니다.
https://github.com/stephenliberty/excel-builder.js

이 라이브러리를 사용하면 브라우저 및 Excel 호환성 문제가 모두 발생할 수 있지만 올바른 조건에서는 매우 유용 할 수 있습니다.

Excel 옵션이 적지 만 Excel 호환성 문제에 대한 걱정이 적은 또 다른 github 프로젝트는 여기에서 찾을 수 있습니다. ExcellentExport.js
https://github.com/jmaister/excellentexport

AngularJS를 사용하는 경우 ng-csv가 있습니다 .
"배열과 객체를 다운로드 가능한 CSV 파일로 바꾸는 간단한 지시문"입니다.


서버에서 Excel 파일을 생성 할 수 있다면 이것이 가장 좋은 방법 일 것입니다. Excel을 사용하면 서식을 추가하고 출력을 더보기 좋게 만들 수 있습니다. 여러 Excel 옵션이 이미 언급되었습니다. PHP 백엔드가있는 경우 phpExcel을 고려할 수 있습니다 .

클라이언트에서 모든 작업을 자바 스크립트로 수행하려는 경우 Excel이 옵션이라고 생각하지 않습니다. CSV 파일을 생성하고 사용자가 다운로드 할 수 있도록 데이터 URL을 생성 할 수 있습니다.

시연하기 위해 JSFiddle을 만들었습니다. http://jsfiddle.net/5KRf6/3/

이 자바 스크립트 (jQuery를 사용한다고 가정)는 테이블의 입력 상자에서 값을 가져와 CSV 형식의 문자열을 만듭니다.

var csv = "";
$("table").find("tr").each(function () {
    var sep = "";
    $(this).find("input").each(function () {
        csv += sep + $(this).val();
        sep = ",";
    });
    csv += "\n";
});

원하는 경우 페이지의 태그에 데이터를 놓을 수 있습니다 (내 경우에는 ID가 "csv"인 태그).

$("#csv").text(csv);

다음 코드를 사용하여 해당 텍스트에 대한 URL을 생성 할 수 있습니다.

window.URL = window.URL || window.webkiURL;
var blob = new Blob([csv]);
var blobURL = window.URL.createObjectURL(blob);

마지막으로 해당 데이터를 다운로드 할 수있는 링크가 추가됩니다.

$("#downloadLink").html("");
$("<a></a>").
attr("href", blobURL).
attr("download", "data.csv").
text("Download Data").
appendTo('#downloadLink');

비슷한 답변이 여기에 게시 되었습니다 .

실례 링크

var sheet_1_data = [{Col_One:1, Col_Two:11}, {Col_One:2, Col_Two:22}];
var sheet_2_data = [{Col_One:10, Col_Two:110}, {Col_One:20, Col_Two:220}];
var opts = [{sheetid:'Sheet One',header:true},{sheetid:'Sheet Two',header:false}];
var result = alasql('SELECT * INTO XLSX("sample_file.xlsx",?) FROM ?', [opts,[sheet_1_data ,sheet_2_data]]);

필요한 주요 라이브러리-

<script src="http://alasql.org/console/alasql.min.js"></script> 
<script src="http://alasql.org/console/xlsx.core.min.js"></script> 

웹 서버에 CSV 파일을 쓰고 URL을 반환하는 AJAX 포스트 백 메소드를 생성합니다. 브라우저에서 숨겨진 IFrame을 서버의 CSV 파일 위치로 설정합니다.

그러면 사용자에게 CSV 다운로드 링크가 표시됩니다.


실제 예제로 질문에 답하려면 :

<script type="text/javascript">
function DownloadJSON2CSV(objArray)
{
    var array = typeof objArray != 'object' ? JSON.parse(objArray) : objArray;

    var str = '';

    for (var i = 0; i < array.length; i++) {
        var line = new Array();

        for (var index in array[i]) {
           line.push('"' + array[i][index] + '"');
        }

        str += line.join(';');
        str += '\r\n';
    }
    window.open( "data:text/csv;charset=utf-8," + encodeURIComponent(str));
}
</script>

I recommend you to generate an open format XML Excel file, is much more flexible than CSV.
Read Generating an Excel file in ASP.NET for more info

ReferenceURL : https://stackoverflow.com/questions/333537/how-to-generate-excel-through-javascript

반응형