Geek Answers Handbook

Dropzone JS Download to WCF Retrieving Invalid Data

First of all, I'm new to both WCF and Dropzone JS, but I try to combine these two to create a simple image downloader. I have WCF working correctly for the metadata that I uploaded through it (so I know that it transferred the entire cross-domain correctly), but the Stream that I captured from Dropzone does not match the image that I reset, Actually, every single image fell, the result in the same encoded line on the server side ...

For example, I used this star image as a test, and by uploading the image to base64 online converter , I see that the beginning of the base64 line looks like this:

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

However, when I debug my WCF code, the converted base64 string looks like this:

 LS0tLS0tV2ViS2l0Rm9ybUJvdW5kYXJ5T1RUV0I1RFZZdTVlM2NTNQ0KQ29udG...

This line above is the same as the one created for each image that I am trying to send.

So, now for all applicable code snippets. I have a simple web page in one project and WCF-related files in another project in the same solution.

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

Implementation of 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 applicable fragments:

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

The problem is visible when I break a fragment of an encoded string and does not match what was expected. If I copy the entire line to another online image that generates images from base64 strings, this is not a valid image. At the moment, I am stuck and could not determine why I can not read from dropzone.

+5
source share
2 answers

For anyone who wants to configure the WCF service to detect dropzone images, keep in mind that dropzone sends multipart / form-data, which looks like this:

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

There is no built-in way to analyze this data that I found, however this blog post contains more detailed information and provides a codeplex MultipartParser class that worked great for this scenario.

Simplified WCF code now looks like this:

 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; }
+1
source

If I decode your received base64 string LS0tLS0tV2ViS2l0Rm9ybUJvdW5kYXJ5T1RUV0I1RFZZdTVlM2NTNQ0KQ29udG

I get

------WebKitFormBoundaryOTTWB5DVYu5e3cS5 Cont

So, I think that you have a problem with the link to the element, as in this post: The downloaded file contains only "WebKitFormBoundary"

+1
source

More articles:


All Articles