ホーム > ajax | php | 技術系 > php+ajaxでCSVをダウンロードした場合の文字化け対処法

php+ajaxでCSVをダウンロードした場合の文字化け対処法

以下の問題を解決するのに苦労したので、備忘録として書いておきます。

発生した問題

phpでそのままCSVを生成して出力した場合は問題なく出力できる

ajaxを使って、生成したCSVをダウンロードすると、エクセルで開いた場合に文字化け

出力されたCSVファイルを、テキストエディタで開くと、ファイルの文字コードがUTF-8になっている?(普通にPHPで出力した場合はsjis)

前提の環境

サーバ側で出力しているCSVはPHPで生成し、文字コードはsjis

ブラウザはIE11

今回やろうとしていたのは、PHPでそのまま出力するのではなく、ajaxでダウンロードするパターンだったので、文字化けの対処法を探すのに苦労しました。

以下の記事のおかげで解決できました。

JavaScript 文字化けしないファイルの出力法 | グルーヴであなたのビジネスは加速する

サンプルコード(上記のサイトからそのまま抜粋)

ar csv = 'ここにCSVのデータを入れる';

var link = document.createElement('a');
var bom = new Uint8Array([0xEF, 0xBB, 0xBF]);
var blob;

if (window.navigator.msSaveOrOpenBlob) {
  // for ie
  blob = new Blob([bom, csv], {type: 'text/csv'});
  window.navigator.msSaveOrOpenBlob(blob, csvName);
} else if (window.webkitURL && window.webkitURL.createObjectURL) {
  // for chrome (and safari)
  blob = new Blob([bom, csv], {type: 'text/csv'});
  link.setAttribute('download', csvName);
  link.setAttribute('href', window.webkitURL.createObjectURL(blob));
  link.click();
} else if (window.URL && window.URL.createObjectURL) {
  // for firefox
  blob = new Blob([bom, csv], {type: 'text/csv'});
  link.setAttribute('download', csvName);
  link.setAttribute('href', window.URL.createObjectURL(blob));
  link.click();
}

やっていたこととしては上記と同じで、ajaxで取得したCSVデータをwindow.navigator.msSaveOrOpenBlobで開くというものだったのですが、new Blobで開くblobデータを作成する場合に、テキストの先頭にBOMをつければよいというものでした。

自分の場合は、この方法で解決することができました。

コメント:0

コメントフォーム
入力した情報を記憶する

トラックバック:0

この記事のトラックバック URL
https://www.itblog.jp/wp-trackback.php?p=10011
トラックバックの送信元リスト
php+ajaxでCSVをダウンロードした場合の文字化け対処法 - ITblog より

ホーム > ajax | php | 技術系 > php+ajaxでCSVをダウンロードした場合の文字化け対処法

フィード

ページの上部に戻る