Dropzone JS Przesyłanie do WCF Nieprawidłowe dane

Question

Po pierwsze, jestem nowy zarówno dla usług WCF, jak i dla JS Dropzone, ale próbuję połączyć te dwa, aby utworzyć prosty program do przesyłania obrazów. Mam poprawnie działający moduł WCF dla metadanych, które do niego przesłałem (więc wiem, że przekazuje on poprawnie krzyżową domenę), ale Strumień przechwycony przez Dropzone nie pasuje do obrazu, który upuściłem . Rzeczywiście, każdy pojedynczy zrzut obrazu skutkuje tym samym zakodowanym ciągiem po stronie serwera ...

Na przykład użyłem tego star image jako testu, a przesyłając obraz do base64 online converter, widzę, że początku łańcucha base64 wygląda następująco:

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAOYAAADbCAMAAABOUB36AAAAwFBMVEX... 

jednak, kiedy debugowania mojego kodu WCF, że base64 konwertowane ciąg wygląda następująco:

LS0tLS0tV2ViS2l0Rm9ybUJvdW5kYXJ5T1RUV0I1RFZZdTVlM2NTNQ0KQ29udG... 

ciąg powyżej jest taka sama dla utworzona na zawsze y obraz, który próbuję wysłać.

Tak więc dla wszystkich odpowiednich części kodu. Mam prostą stronę w jednym projekcie i pliki powiązane z WCF w innym projekcie w tym samym rozwiązaniu.

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 
    }; 

OperationContract:

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

realizacja 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); 
} 

webconfig obowiązujące sztuk:

<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> 

Problem jest widoczny po złamaniu elementu encodedString i nie jest zgodny z oczekiwanym. Jeśli skopiuję cały ciąg do innego obrazu online, który generuje obrazy ze stringów base64, nie jest to poprawny obraz. W tym momencie utknąłem i nie byłem w stanie określić, dlaczego nie mogę odczytać z dropzone.

Answer 1

Dla każdy, kto chce skonfigurować usługę WCF do przechwytywania obrazów dropzone, należy pamiętać, że dropzone wysyła dane wieloczęściowe/formularzowe, które wyglądają następująco:

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

<file bytes> 
------WebKitFormBoundary-- 

Nie ma wbudowany sposób analizować te dane, które znalazłem, jednak blog post przechodzi w więcej szczegółów i zapewnia codeplex MultipartParser class że pracował idealnie dla tego scenariusza.

kod uproszczony WCF teraz wygląda:

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; 
    } 

Answer 2

Gdybym dekodowania odebranych ciąg base64 LS0tLS0tV2ViS2l0Rm9ybUJvdW5kYXJ5T1RUV0I1RFZZdTVlM2NTNQ0KQ29udG

uzyskać

------WebKitFormBoundaryOTTWB5DVYu5e3cS5 Cont

Więc myślę, że masz problem w przedstawieniu element, jak w tym poście: Uploaded file only contains "WebKitFormBoundary"