Kendo Upload无法获取所选文件的Byte数组

问题描述 投票:0回答:2

如何获取所选文件的字节数组数据?从select事件我可以得到e.files[0].rawFile但我找不到存储字节[]的位置。我想在客户端这个数据

javascript kendo-ui upload client
2个回答
0
投票

尝试这样的事情:

function(data) {
    data = btoa(data);
    var bytesArr = [];
    for(var i = 0; i < data.length; i++) {
       bytesArr.push(data.charCodeAt(i)); 
    }
    return new Uint8Array(bytesArr);
}

0
投票

我发现文档在这个问题上也很差。该文档适用于使用REST端点对文件进行服务器端处理。客户端处理的大多数示例仅用于显示文件名,如果您要对文件内容进行任何有意义的客户端验证,则这不是非常有用。在我的情况下,我有CSV文件,我想在客户端进行一些预处理。诀窍是你需要使用HTML5 a FileReader。以下是AngularJS中的示例,其中$ ctrl.fileContent将具有CSV文件的内容。

        controller: ['$scope', function ($scope) {

            var $ctrl = this;

            // function called by kendo upload component
            $ctrl.onSelect = function(e) {
                var message = e.files.map(function(file) {
                    return $ctrl.readFile(file);
                }).join(', ');

                // log file names being uploaded
                console.log('event :: files select (' + message + ')');
            };

            // read file and do basic validation
            $ctrl.readFile = function(file) {
                var reader = new FileReader();

                reader.onload = function(e) {
                    var text = reader.result;
                    console.log('File contents :: ' + text);
                    $ctrl.fileContent = text;
                };

                reader.readAsText(file.rawFile);

                // return file name
                return file.name;
            };

            // function called by kendo upload component
            $ctrl.onUpload = function(e) {
                // todo
                console.log('Uploading file');
                console.log($ctrl.fileContent);
            };
        }]
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div class="content-panel">
    <div class="row">
        <div class="form-group col-lg-3 col-md-3 col-sm-6 col-xs-12">
            <h4>Upload CSV files</h4>
            <input name="files"
                type="file"
                kendo-upload
                k-async="{ saveUrl: '$ctrl.save', removeUrl: 'remove', autoUpload: false }"
                k-select="$ctrl.onSelect"
                k-validation="{ allowedExtensions: ['csv']}"
                k-upload="$ctrl.onUpload"
                />
        </div>
    </div>
</div>
© www.soinside.com 2019 - 2024. All rights reserved.