使用REST上传文件中的文件数据为空 [英] File data null in File uploading using REST

问题描述

我有下面的代码：

$ p $ self.upload = function（file）{
var path = $ （ '#fileUpload'）VAL（）;
var fr = new FileReader（）;
var ID = JSON.stringify（{
ID：23，
名称：file.name，
类型：file.type，
大小：file.size，
Path：path，
data：fr.readAsDataURL（file），


}）;
$ .ajax（{
cache：false，
url：http：// localhost：49589 / api / files，
类型：POST ，
dataType：json，
data：ID，
contentType：application / json; charset = utf-8，
processData：false，
成功：函数（json）{
alert（Data Returned：+ JSON.stringify（json））;
}，
错误：function（json）{
alert（错误+ JSON.stringify（json））;
}

}）;


即时文件上传。我的控制器是

pre $ code $ H $ p $ b $公共字符串上传（filesUpload f）
{

byte [] jj = f.data; // **在这里得到空**
字符串givenId = f.Path;
返回givenId;






$ b

当我执行此操作并上传一个文件即时获取空文件数据。 filesUpload 是我的模型

我的代码出了什么问题。我使用Knockout.js为viwe和drundal SPA框架

有没有其他方法可以做。请帮助我

解决方案

FileReader.readAsDataURL 读取异步文件，不返回任何内容。您应该首先阅读文件，然后捕获fr.onload事件，并从这里创建您的json对象，并调用ajax。代码如下所示：

  self.upload = function（file）{
 var path = $（' #fileUpload'）VAL（）; 
 var fr = new FileReader（）; 
 fr.onload = function（frEvent）{
 var ID = JSON.stringify（{
 ID：23，
名称：file.name，
类型：file .type，
大小：file.size，
路径：path，
 data：frEvent.target.result，
}）; 
 $ .ajax（{
 cache：false，
 url：http：// localhost：49589 / api / files，
类型：POST ，
 dataType：json，
 data：ID，
 contentType：application / json; charset = utf-8，
 processData：false，
成功：函数（json）{
 alert（Data Returned：+ JSON.stringify（json））; 
}，
错误：function（json）{
 alert（错误+ JSON.stringify（json））; 
} 
}）; 
}; 
 fr.readAsDataURL（file）; 
}; 
  

And i have the following code

self.upload = function (file) {
            var path = $('#fileUpload').val();
           var fr= new FileReader();
            var ID = JSON.stringify({
               ID:23,
               Name: file.name,
               Type: file.type,
               Size: file.size,
               Path: path,
               data:fr.readAsDataURL(file),


            });

            $.ajax({
                cache: false,
                url: "http://localhost:49589/api/files",
                type: "POST",
                dataType: "json",
                data: ID,
                contentType: "application/json; charset=utf-8",
                processData: false,
                success: function (json) {
                            alert("Data Returned: " + JSON.stringify(json));
                        },
                error: function (json) {
                alert("error" + JSON.stringify(json));
            }

            });

im performing file upload . and my controller is

[HttpPost]
        public string upload(filesUpload f)
        {

            byte[] jj = f.data; // **getting null here** 
            string givenId = f.Path;
            return givenId;

        }

when i execute this and upload a file im getting null file data . where filesUpload is my model

what went wrong in my code . Im using Knockout.js for viwe and drundal SPA framework

is there any other way to do . kindly help me

解决方案

FileReader.readAsDataURL reads the file asyncronically and return nothing. You should at first start read the file, then catch fr.onload event and from here create your json object and call ajax.

upd: The code will look like this:

    self.upload = function (file) {
               var path = $('#fileUpload').val();
               var fr= new FileReader();
               fr.onload = function (frEvent) {
                     var ID = JSON.stringify({
                     ID:23,
                     Name: file.name,
                     Type: file.type,
                     Size: file.size,
                     Path: path,
                     data:frEvent.target.result,
                    });

                    $.ajax({
                      cache: false,
                      url: "http://localhost:49589/api/files",
                      type: "POST",
                      dataType: "json",
                      data: ID,
                      contentType: "application/json; charset=utf-8",
                      processData: false,
                      success: function (json) {
                                alert("Data Returned: " + JSON.stringify(json));
                            },
                      error: function (json) {
                       alert("error" + JSON.stringify(json));
                      }
                    });
                   };
                 fr.readAsDataURL(file);
            };

这篇关于使用REST上传文件中的文件数据为空的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！