1

一部の JavaScript データ (主に配列) を Microsoft Excel にエクスポートできるようにする必要がある Web アプリケーションがあります。そのための最善の方法は、データを CSV ファイルとして保存することだと言われました。同様の問題に対処するスレッドがたくさんあることは知っていますが、これまでのところ、探しているものが正確には見つかりませんでした... Web サービスの呼び出しを回避し、クライアント側からこれを実行したいと思います。

いくつかの提案に従って、データ URI を使用してアレイをディスクに書き込もうとしました。これが私がjavascriptで持っているコードです:

function exportToCsv() {

        var data = [JSONdata.mass, JSONdata.waterMass, JSONdata.bedTemp, JSONdata.evapRate];
        var keys = ["Mass(kg)", "H2O Mass in Bed(kg)", "Bed Temperature(kg)", "Evaporation Rate"];

        var str;
        var orderedData = [];
        for (var i = 0, iLen = data.length; i < iLen; i++) {
            temp = data[i];
            for (var j = 0, jLen = temp.length; j < jLen; j++) {

                if (!orderedData[j]) {
                    orderedData.push([temp[j]]);
                } else {
                    orderedData[j].push(temp[j]);
                }
            }
        }


        str = keys.join(',') + '\r\n' + orderedData.join('\r\n');      



        var uri = 'data:application/csv;charset=UTF-8,' + str;
        window.open(uri);       

}

文字列strは CSV 形式のように見えますが、ファイルを保存すると空になります。strまた、ポップアップ プロンプトからの内容を CSV ファイルに保存したいと考えています。

Downloadify と FileSaver.js を調べましたが、適切なドキュメントを見つけるのに苦労しました。これはかなり簡単なことのように思えます... 手を貸してください!

前もって感謝します!


編集/更新

FileSaver.jsを使用してソリューションを機能させることになりました。私のデータはヘッダーの後に 4 つの大きな double 配列が続くものだったので、CVS は私にとって十分な形式でした。CSVファイルを適切に保存するために使用したコードは次のとおりです。

function exportExcel()
    {
        var data = [JSONdata.mass, JSONdata.waterMass, JSONdata.bedTemp, JSONdata.evapRate];
        //var data = [[1,2,3,4,5],[11,22,33,44,55],[111,222,333,444,555],[1111,2222,3333,4444,5555]];
        var keys = ['"Mass(kg)"', '"H2O Mass in Bed(kg)"', '"Bed Temperature(kg)"', '"Evaporation Rate"'];

        var convertToCSV = function(data, keys) {
            var orderedData = [];
            for (var i = 0, iLen = data.length; i < iLen; i++) {
                temp = data[i];
                for (var j = 0, jLen = temp.length; j < jLen; j++) {

                    quotes = ['"'+temp[j]+'"'];
                    if (!orderedData[j]) {
                        orderedData.push([quotes]);
                    } else {
                        orderedData[j].push(quotes);
                    }
                }
            }
            return keys.join(',') + '\r\n' + orderedData.join('\r\n');
        }


        var str = convertToCSV(data, keys);

        var blob = new Blob([str], {type: "text/plain;charset=utf-8"});
        var filename = prompt("Please enter the filename");
        if(filename!=null && filename!="")
            saveAs(blob, [filename+'.csv']);
        else
            alert("please enter a filename!");        

    }

他の誰かが同様の問題に遭遇した場合、この解決策は私にとって非常にうまく機能し、サーバー側に戻るのをスキップすることができました. みんな助けてくれてありがとう。

4

2 に答える 2

2

あなたが説明している動作を理解し、再現することができました。URI を生成するコードの問題は、 のコンテンツをエンコードしていないことですstr

str変更した行は次のとおりです。変数がencodeURI()組み込み関数でラップされていることに注意してください。

var uri = 'data:application/csv;charset=UTF-8,' + encodeURI(str);

新しい行が含まれた CSV ファイルを生成するフィドルは次のとおりです: DEMO。実行後に空になったforので、ループを単純化しました。orderedData

Excel が生成した「CSV」ファイルでは、実際にはカンマではなくセミコロンを使用することに注意してください。そのため、ファイルを Excel で使用する場合は、,for を置き換え;ます。Excel 互換ファイルの生成は次のとおりです: DEMO .

于 2013-07-26T15:24:33.723 に答える