【问题标题】:Corrupted file when uploading file to server using ajax and WCF使用 ajax 和 WCF 将文件上传到服务器时文件损坏
【发布时间】:2014-01-14 18:20:54
【问题描述】:

我正在尝试在服务器端使用 jquery、ajax 和 wcf 实现图像上传。 运营合约:

    [WebInvoke(UriTemplate = "/createnewsfeedpost?fileName={fileName}", Method = "POST", ResponseFormat = WebMessageFormat.Json)]
    [OperationContract]
    void CreateNewsfeedPost(Stream imageContent, string fileName);

操作实现:

public void CreateNewsfeedPost(Stream imageContent, string fileName)
    {
        byte[] buffer = new byte[32768];
        using (var ms = new FileStream(@"C:/Temp/test.png", FileMode.CreateNew))
        {
            int bytesRead, totalBytesRead = 0;
            do
            {
                bytesRead = imageContent.Read(buffer, 0, buffer.Length);
                totalBytesRead += bytesRead;

                ms.Write(buffer, 0, bytesRead);
            } while (bytesRead > 0);

         }
   }

客户端代码:

      <a id="createNewsFeedPostButton" href="javascript:;">Share</a>
      <input type="file" id="newsFeedImage" />

Javascript:

$(document).ready(function () {
        $("#createNewsFeedPostButton").click(function () {
            createNewsFeedPost();
        });
    });

function createNewsFeedPost() {
        var fd = new FormData();
        fd.append('file', $('#newsFeedImage')[0].files[0]);
        $.ajax({
            url:/createnewsfeedpost + "?fileName=test.png",
            data: fd,
            processData: false,
            contentType: false,
            type: 'POST',
            success: function (data) {
                alert('sas');
            },
            error: function (jqXHR, textStatus, errorThrown) {
                alert(textStatus + ' / ' + errorThrown);
            }
        });
  }

我能够在服务实现中获得填充的 Stream 对象,但问题是它有些损坏。如果我使用记事本打开保存的文件,我会在其中看到一些奇怪的页眉和页脚。

标题:

-----------------------------7de17128101f8
Content-Disposition: form-data; name="file"; filename="C:\icon.png"
Content-Type: image/png

页脚:

-----------------------------7de17128101f8--

有没有办法去掉这个页脚和页眉?

【问题讨论】:

  • 这个请求没有错。您只需要正确处理multipart encoded requests 服务器端。
  • 是的,它现在可以工作了。非常感谢:)。
  • 请发布您修改后的服务器代码的答案,以便其他人受益。
  • 你确定我应该发布它吗?我认为如果我发布它是不公平的,你应该这样做。
  • 是的,请发布您的代码。

标签: wcf jquery


【解决方案1】:

感谢 Ray Nicholus 提供的解决方案。我需要将消息正文解析为多部分数据才能访问图像内容。我从here 获取了多部分解析器。

更新的服务器端代码:

var parser = new MultipartParser(imageContent);
if (!parser.Success)
    throw new ApplicationException("Error while parsing image file");

using (var ms = new FileStream(@"C:/Temp/test.png", FileMode.CreateNew))
{
    ms.Write(parser.FileContents, 0, parser.FileContents.Length);
}

【讨论】: