Dropzone JS上传到WCF获取错误的数据

Dan*_*iel 5 javascript c# wcf image

首先,我是WCF服务和dropzone JS的新手,但我正在尝试将两者结合起来创建一个简单的图像上传器.我有我的WCF的,我已经上传到过它的元数据正常工作(所以我知道这是正确传递的东西跨域),但我从悬浮窗拍摄的流,我放弃了形象不符.实际上,每个丢失的图像都会产生相同的编码字符串服务器端...

例如,我使用这个星形图像作为测试,通过将图像上传到base64在线转换器,我可以看到base64字符串的开头如下所示:

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAOYAAADbCAMAAABOUB36AAAAwFBMVEX...
Run Code Online (Sandbox Code Playgroud)

但是,当我调试我的WCF代码时,base64转换后的字符串如下所示:

LS0tLS0tV2ViS2l0Rm9ybUJvdW5kYXJ5T1RUV0I1RFZZdTVlM2NTNQ0KQ29udG...
Run Code Online (Sandbox Code Playgroud)

上面的这个字符串与我尝试发送的每个图像创建的字符串相同.

所以适用于所有适用的代码片段.我在一个项目中有一个简单的网页,在同一个解决方案中有另一个项目中的WCF相关文件.

index.html的:

<div class="col-lg-12">
    <form action="http://localhost:39194/ImageRESTService.svc/AddImageStream/"
            class="dropzone"
            id="dropzone"></form>
</div>
...
Dropzone.options.dropzone = {
        maxFilesize: 10, // MB
    };
Run Code Online (Sandbox Code Playgroud)

OperationContract的:

/*  Stores a new image in the repository  */
    [OperationContract]
    [WebInvoke(Method = "POST",
                ResponseFormat = WebMessageFormat.Json,
                UriTemplate = "AddImageStream/")]
    void AddImageStream(Stream img);
Run Code Online (Sandbox Code Playgroud)

AddImageStream实现:

public void AddImageStream(Stream img)
    {
        //try to save image to database  
        byte[] buffer = new byte[10000];
        int bytesRead, totalBytesRead = 0;
        string encodedData = "";

        do
        {
            bytesRead = img.Read(buffer, 0, buffer.Length);
            encodedData = encodedData + Convert.ToBase64String(buffer,
                                       Base64FormattingOptions.InsertLineBreaks);
            totalBytesRead += bytesRead;
        } while (bytesRead > 0);
}
Run Code Online (Sandbox Code Playgroud)

Webconfig适用部分:

<services>
  <service name="ImageRESTService.ImageRESTService" behaviorConfiguration="serviceBehavior">
    <endpoint address="" behaviorConfiguration="web" contract="ImageRESTService.IImageRESTService" binding="webHttpBinding" bindingConfiguration="webHttpBinding"></endpoint>
  </service>
</services>
<behaviors>
  <serviceBehaviors>
    <behavior name="serviceBehavior">
      <serviceMetadata httpGetEnabled="false" />
      <serviceDebug includeExceptionDetailInFaults="false" />
    </behavior>
  </serviceBehaviors>
  <endpointBehaviors>
    <behavior name="web">
      <webHttp />
    </behavior>
  </endpointBehaviors>
</behaviors>
<standardEndpoints>
  <webHttpEndpoint>
    <standardEndpoint name="" helpEnabled="true" automaticFormatSelectionEnabled="true" maxReceivedMessageSize="2147000000" />
  </webHttpEndpoint>
</standardEndpoints>
<bindings>

  <webHttpBinding>
    <binding crossDomainScriptAccessEnabled="true" name="ImagesBinding" closeTimeout="00:10:00" openTimeout="00:10:00" receiveTimeout="00:10:00" sendTimeout="00:10:00" maxBufferSize="2147483647" maxBufferPoolSize="2147483647" maxReceivedMessageSize="2147483647" />
    <binding name="webHttpBinding" transferMode="Streamed" maxReceivedMessageSize="2147483647" maxBufferSize="10485760" closeTimeout="00:01:00" openTimeout="00:01:00"
         receiveTimeout="00:10:00" sendTimeout="00:01:00">
      <readerQuotas maxStringContentLength="2147483647" maxArrayLength="1000000" />
    </binding>
  </webHttpBinding>
Run Code Online (Sandbox Code Playgroud)

当我打破encodedString片段并且它与我期望的不匹配时,问题是可见的.如果我将整个字符串复制到另一个从base64字符串生成图像的在线图像中,则它不是有效图像.此时我陷入困境,无法确定为什么我无法从dropzone读取.

Dan*_*iel 1

对于希望配置 WCF 服务来捕获 dropzone 图像的其他人,请注意 dropzone 会发送如下所示的 multipart/form-data:

------WebKitFormBoundary
Content-Disposition: form-data; name="data"; filename="DSCF0001.JPG"
Content-Type: image/jpeg

<file bytes>
------WebKitFormBoundary--
Run Code Online (Sandbox Code Playgroud)

我发现没有内置的方法来解析这些数据,但是这篇博客文章详细介绍了更多细节,并提供了一个非常适合这种情况的codeplex MultipartParser 类。

简化的 WCF 代码现在如下所示:

public string AddImageStream(Stream img)
    {
        MultipartParser parser = new MultipartParser(img);

        string encodedString = "";

        if (parser.Success)
        {
            // Save the file
            encodedString = SaveFile(parser.Filename, parser.ContentType, parser.FileContents);
        }

        return encodedString;
    }
Run Code Online (Sandbox Code Playgroud)