You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

Windows系统下载CSV文件日文乱码问题及相关代码咨询

解决Windows下日文CSV下载乱码问题

我来帮你搞定这个Windows环境下下载日文CSV乱码的问题~你已经尝试在ng-csv按钮里设置了charset="shift_jis"add-bom="true",但还是遇到乱码,下面给你分析几个可能的原因和对应的解决办法:

1. 调整编码+BOM的组合(最常见的解决思路)

Windows里的Excel打开CSV时,编码识别逻辑有点“挑剔”:

  • 带BOM的UTF-8格式,Excel能直接正确识别
  • Shift-JIS格式本身不需要加BOM,强行加了反而可能导致识别错误

你可以试试两种调整方向:

方案A:改用UTF-8带BOM格式

把按钮的charset改成utf-8,保留add-bom="true",这样生成的CSV是UTF-8带BOM,Excel打开日文不会乱码:

<button class="btn btn-raised btn-inverse btn-sm" 
        charset="utf-8" 
        add-bom="true" 
        ng-csv="getSampleData" 
        csv-header="['コード','勘定科目名','Main_code']" 
        filename="{{ samplefilename }}.csv" 
        field-separator="{{separator}}" 
        decimal-separator="{{decimalSeparator}}">
    <span translate> load.common.sample </span>
</button>

方案B:用Shift-JIS但移除BOM

如果业务要求必须用Shift-JIS编码,那就去掉add-bom="true"参数(Shift-JIS没有标准BOM,加了反而会干扰识别):

<button class="btn btn-raised btn-inverse btn-sm" 
        charset="shift_jis" 
        ng-csv="getSampleData" 
        csv-header="['コード','勘定科目名','Main_code']" 
        filename="{{ samplefilename }}.csv" 
        field-separator="{{separator}}" 
        decimal-separator="{{decimalSeparator}}">
    <span translate> load.common.sample </span>
</button>

另外要确保你的getSampleData里的日文内容本身是正常的Unicode字符串,这样ng-csv才能正确转成Shift-JIS编码。

2. 检查ng-csv版本是否支持这些参数

有些早期版本的ng-csv可能不支持charsetadd-bom参数,你可以确认一下自己用的是angular-csv-ext(扩展版,支持这些参数)还是官方原版ng-csv。如果是原版,可能需要升级到扩展版,或者用下面的自定义方案。

3. 手动生成CSV(最可控的方案)

如果上面的参数调整都没用,那就自己在控制器里写逻辑生成CSV,完全掌控编码和BOM的处理:

$scope.downloadSampleCSV = function() {
    // 获取要导出的数据
    var data = $scope.getSampleData();
    var headers = ['コード','勘定科目名','Main_code'];
    
    // 拼接CSV内容(注意处理字段里的分隔符,这里简化处理,实际可以加引号包裹)
    var csvContent = headers.join($scope.separator) + '\n';
    data.forEach(function(row) {
        var rowStr = Object.values(row).join($scope.separator);
        csvContent += rowStr + '\n';
    });
    
    // 处理编码和BOM,这里以UTF-8带BOM为例
    var bom = new Uint8Array([0xEF, 0xBB, 0xBF]); // UTF-8 BOM
    var stringBlob = new Blob([csvContent], { type: 'text/csv;charset=utf-8' });
    var blob = new Blob([bom, stringBlob], { type: 'text/csv;charset=utf-8' });
    
    // 触发下载
    var url = URL.createObjectURL(blob);
    var a = document.createElement('a');
    a.href = url;
    a.download = $scope.samplefilename + '.csv';
    a.click();
    URL.revokeObjectURL(url);
};

然后把按钮改成调用这个自定义函数:

<button class="btn btn-raised btn-inverse btn-sm" ng-click="downloadSampleCSV()">
    <span translate> load.common.sample </span>
</button>

这种方式完全自己控制生成过程,基本不会出现编码问题。

4. 验证下载后的文件编码

下载文件后,用Notepad++这类编辑器打开,查看文件的编码:

  • 如果是UTF-8带BOM,编辑器会显示“UTF-8-BOM”
  • 如果是Shift-JIS,显示“Shift-JIS”
    要是编码不对,说明ng-csv没正确应用参数,那还是用自定义生成的方案更靠谱。

内容的提问来源于stack exchange,提问作者Mayur Sarang

火山引擎 最新活动