Javascript 将ByteArray从Knockout.js发布到Web服务

我对KnockoutJS非常陌生，我到目前为止都很喜欢，但是尽我所能，我在任何地方都找不到这些信息，所以我希望社区能提供帮助！在我看来，我对文件输入有以下数据绑定：

 <input type="file" data-bind="value: ImageToUpload"/>
 <button data-bind="click: $root.saveImage">Upload</button>

对象很好地传递到我的服务，我可以访问所有表单数据，包括“ImageToUpload”变量。。。但这就是我被困的地方：

1） “ImageToUpload”只是一个表示我上传的文件名的字符串，不是ByteArray。如何访问图像文件而不仅仅是名称

2） 有没有更好的方法在响应头中将ByteArray作为流或其他格式传递

3） 我的技术完全失败了吗？有更好的方法吗？我的目标是有一个动态列表的图像“插槽”上传到

---

提前谢谢

文件上传需要以特殊方式处理。它们通常不属于您的模型。看看下面的ApiController。专用类（如

MultipartFormDataStreamProvider

）用于访问提交给控制器的二进制数据

public class FileUploadController : ApiController
{
    [HttpPost]
    public List<FileResult> UploadFile()
    {
        // Verify that this is an HTML Form file upload request
        if (!Request.Content.IsMimeMultipartContent("form-data"))
        {
            throw new HttpResponseException(HttpStatusCode.UnsupportedMediaType);
        }

        // Create a stream provider for setting up output streams
        MultipartFormDataStreamProvider streamProvider = new MultipartFormDataStreamProvider();

        // Read the MIME multipart content using the stream provider we just created.
        IEnumerable<HttpContent> bodyparts = Request.Content.ReadAsMultipartAsync(streamProvider).Result;

        // The submitter field is the entity with a Content-Disposition header field with a "name" parameter with value "submitter"
        string submitter;
        if (!bodyparts.TryGetFormFieldValue("submitter", out submitter))
        {
            submitter = "unknown";
        }

        // Get a dictionary of local file names from stream provider.
        // The filename parameters provided in Content-Disposition header fields are the keys.
        // The local file names where the files are stored are the values.
        IDictionary<string, string> bodyPartFileNames = streamProvider.BodyPartFileNames;

        // Create response containing information about the stored files.
        return bodyPartFileNames.Select(kv =>
        {
            FileInfo fileinfo = new FileInfo(kv.Value);
            return new FileResult
            {
                FileName = kv.Key,
                LocalPath = fileinfo.FullName,
                LastModifiedTime = fileinfo.LastWriteTimeUtc,
                Length = fileinfo.Length,
                Submitter = submitter
            };
        }).ToList();
    }

    private static bool TryGetFormFieldValue(IEnumerable<HttpContent> contents, string dispositionName, out string formFieldValue)
    {
        HttpContent content = contents.FirstDispositionNameOrDefault(dispositionName);
        if (content != null)
        {
            formFieldValue = content.ReadAsStringAsync().Result;
            return true;
        }

        formFieldValue = null;
        return false;
    }
}

公共类FileUploadController:ApicController
{
[HttpPost]
公共列表上载文件（）
{
//确认这是一个HTML表单文件上传请求
if（！Request.Content.IsMimeMultipartContent（“表单数据”））
{
抛出新的HttpResponseException（HttpStatusCode.UnsupportedMediaType）；
}
//创建用于设置输出流的流提供程序
MultipartFormDataStreamProvider streamProvider=新的MultipartFormDataStreamProvider（）；
//使用我们刚刚创建的流提供程序读取MIME多部分内容。
IEnumerable bodyparts=Request.Content.ReadAsMultipartAsync（streamProvider）.Result；
//submitter字段是具有内容处置头字段的实体，该字段的“名称”参数值为“submitter”
字符串提交器；
if（！bodyparts.TryGetFormFieldValue（“提交者”，out提交者））
{
提交人=“未知”；
}
//从流提供程序获取本地文件名的字典。
//内容处置标题字段中提供的文件名参数是键。
//存储文件的本地文件名是值。
IDictionary BodyPartFileName=streamProvider.BodyPartFileName；
//创建包含有关存储文件信息的响应。
返回BodyPartFileName。选择（kv=>
{
FileInfo FileInfo=新的FileInfo（千伏值）；
返回新文件结果
{
FileName=kv.Key，
LocalPath=fileinfo.FullName，
LastModifiedTime=fileinfo.LastWriteTimeUtc，
长度=fileinfo.Length，
提交者
};
}).ToList（）；
}
私有静态bool TryGetFormFieldValue（IEnumerable内容、字符串处理名称、输出字符串formFieldValue）
{
HttpContent=contents.firstDispositionName或default（dispositionName）；
如果（内容！=null）
{
formFieldValue=content.ReadAsStringAsync（）.Result；
返回true；
}
formFieldValue=null；
返回false；
}
}

另一种对代码要求不高的解决方案是使用

HttpPostedFileBase

作为ApicController的参数

HttpPostedFileBase

本质上是通过表单上传的文件的包装器。我必须补充一点，使用

MultipartFormDataStreamProvider

优于

HttpPostedFileBase

，因为后者是ASP.NET MVC框架的一部分。记住，WebAPI技术可以在ASP.NET MVC之外使用

---

更多信息：无法访问本地文件内容是JavaScript安全沙箱的一个基本限制。它是随着引入的而取消的，但是，不幸的是，支持被取消了。如果您的代码需要在不兼容的浏览器中工作，那么您唯一的选择就是让浏览器处理传统的

多部分/表单数据

上载。另一方面，如果不支持IE<10对您来说没问题，那么可以使用带有自定义绑定的文件API“击倒方式”。看一看这个例子：（由于某种原因，当我试图在其中运行这段代码时，它会对我造成严重的破坏）。在Github。

我知道这很古老，但如果你还在，我有个问题。如何将此arraybuffer传递回mvc控制器？

public class FileUploadController : ApiController
{
    [HttpPost]
    public List<FileResult> UploadFile()
    {
        // Verify that this is an HTML Form file upload request
        if (!Request.Content.IsMimeMultipartContent("form-data"))
        {
            throw new HttpResponseException(HttpStatusCode.UnsupportedMediaType);
        }

        // Create a stream provider for setting up output streams
        MultipartFormDataStreamProvider streamProvider = new MultipartFormDataStreamProvider();

        // Read the MIME multipart content using the stream provider we just created.
        IEnumerable<HttpContent> bodyparts = Request.Content.ReadAsMultipartAsync(streamProvider).Result;

        // The submitter field is the entity with a Content-Disposition header field with a "name" parameter with value "submitter"
        string submitter;
        if (!bodyparts.TryGetFormFieldValue("submitter", out submitter))
        {
            submitter = "unknown";
        }

        // Get a dictionary of local file names from stream provider.
        // The filename parameters provided in Content-Disposition header fields are the keys.
        // The local file names where the files are stored are the values.
        IDictionary<string, string> bodyPartFileNames = streamProvider.BodyPartFileNames;

        // Create response containing information about the stored files.
        return bodyPartFileNames.Select(kv =>
        {
            FileInfo fileinfo = new FileInfo(kv.Value);
            return new FileResult
            {
                FileName = kv.Key,
                LocalPath = fileinfo.FullName,
                LastModifiedTime = fileinfo.LastWriteTimeUtc,
                Length = fileinfo.Length,
                Submitter = submitter
            };
        }).ToList();
    }

    private static bool TryGetFormFieldValue(IEnumerable<HttpContent> contents, string dispositionName, out string formFieldValue)
    {
        HttpContent content = contents.FirstDispositionNameOrDefault(dispositionName);
        if (content != null)
        {
            formFieldValue = content.ReadAsStringAsync().Result;
            return true;
        }

        formFieldValue = null;
        return false;
    }
}