javaでのCSVを読み込んでブラウザに返却したい。

Question

前提・実現したいこと。

javaでcsvファイルを読み込んでブラウザに返却をしたいです。
そして、その返却をしたcsvをダウンロードしたいです。

TypeScriptで書いたコードでダウンロードをすると何も書かれていないファイルがダウンロードされます。

フロントエンドはAngularを使用しています。

CSVの読み込みと返却

CSVの読み込みは以下です。

package csv.opereta;

import java.io.BufferedReader;
import java.io.ByteArrayOutputStream;
import java.io.File;
import java.io.FileInputStream;
import java.io.FileNotFoundException;
public class CsvReader {
	
	public static byte[] Reading() throws Exception {
		
		byte[] b = new byte[1];
		File file = new File("save.csv");
		FileInputStream input = new FileInputStream(file);  
		ByteArrayOutputStream baos = new ByteArrayOutputStream();
		 while (input.read(b) > 0) {
		   baos.write(b);
		 }
		   baos.close();
		   input.close();
		   b = baos.toByteArray();
		return b;
	}
}

    @Path("csv-down")
	@Produces("text/csv")
	@GET
	public byte[] CsvDownload() throws Exception {
		byte[] i = CsvReader.Reading();
		
		return i;
}

TypeScript

public async outputCsv(event: any): Promise<any> {
    this.http.getCsv()
    .then(
      (response: any) => {
        const csv = response.csv;
        const filename = response.fileName;
        console.log('responce', response)
        const bom = new Uint8Array([0xEF, 0xBB, 0xBF]);
        const blob = new Blob([bom, csv], { type: 'text/csv' });
        const url = window.URL.createObjectURL(blob);
        const link: HTMLAnchorElement = this.element.querySelector('#csv-donwload') as HTMLAnchorElement;
        link.href = url;
        link.download = filename;
        link.click();
      }
    )
    .catch(
      (error) => console.log(error)
    );
  }

public getCsv(): Promise<any> {
    return this.http.get(this.host + 'csv-down', this.httpOptions)
    .toPromise()
    .then((res) => {
      const response: any = res;
      console.log('aaa', response)
      return response;
    })
    .catch(this.handleError);
  }

###　わからないこと。質問。

＞CSVファイルはbyte[]で読み込んで返却をしていいのか？

＞TypeScriptで返却されたbyte型のcsvデータが読み込めていないのか？

＞RXJSでは返却されたデータをどのように扱っていくのか？

上記がわかりません。
一般的にどのような方法で実装をしていくのかを教えていただけたら幸いです。

Comments

[hoshi-takanori]

ファイルの内容をそのままダウンロードさせたいなら、Java も TypeScript も不要では。

[I_am_]

すみませんそれは具体的にどのような意味でしょうか？

[hoshi-takanori]

Java も TypeScript も不要というのは、save.csv を静的なファイルを置く場所 (画像ファイルなどと同様) に置いて、<a href="〜"> で直接ダウンロードさせれば良いのではないかということです。

また、Java 側で byte[] として読むだけなら nio の Files.readBytes なら一行で書けます。
https://qiita.com/ts7i/items/2c2d0de96ebd26b2a874#%E4%B8%80%E6%8B%AC%E3%81%AE%E3%83%90%E3%82%A4%E3%83%8A%E3%83%AA%E8%AA%AD%E3%81%BF%E8%BE%BC%E3%81%BF
読み込んだ CSV に何らかの処理をする場合は、CSV の内容によっては自分でパースせずにちゃんとしたライブラリを使った方が良いような。

TypeScript 側の処理はよく分かりません。(わざわざ BOM を付ける必要があるのでしょうか。あるならサーバー側で付けた方がいい気がします…。)

[I_am_]

＞hoshi-takanoriさん
ご丁寧にありがとございます。
開発の手順がわかりました。
ちゃんとしたライブラリとはPythonのpandasとかのことですか？

[hoshi-takanori]

pandas は Python でしか使えないので、Java でやりたいなら Java 用のライブラリを使う必要があります。とりあえず OpenCSV ってのと Apache Commons CSV ってのがあるようです。
https://qiita.com/sunnycloudy764/items/c117e769863dc96edc59

「CSV の内容によっては」というのは、CSV では文字列中に , がある場合などは "〜" で囲むことになってますが、その中に " が含まれてる場合の処理などをちゃんとやる必要がある場合とかのことで、単なる数値の羅列なら一行ごとに splite でも構わないと思います。

[I_am_]

なるほどよく理解できました。
であるとOpenCSVを使う必要があるので調べて使ってみます。