Uploading images to a server folder in WCF

Question

I have written an ajax function & WCF class for uploading files to a folder in a server, but unfortunately images are getting uploaded to the folder but aren't opening. When I try to open them they give an error that its corrupt , same thing happens when i upload .doc, pdf or .excel files.

But works fine with .txt files only.

This is my WCF Interface class

[ServiceContract]
    public interface IFileUpload
    {
        [OperationContract]
        [WebInvoke(Method = "POST", UriTemplate = "Upload/{fileName}")]
        String UploadFile(String fileName, Stream data);

Implementation of the class

  public class FileUpload : IFileUpload
    {
        public String UploadFile(String fileName, Stream streamData)
        {

            String fileId = fileName;
            Logger.Info("file Name" + fileName);
            string FilePath = Path.Combine(HostingEnvironment.MapPath("~/Uploads"), fileName);
            Logger.Info("file path" + FilePath);


            int length = 0;
            using (FileStream writer = new FileStream(FilePath, 
 FileMode.Create))
            {
                int readCount;
                var buffer = new byte[8192];
                while ((readCount = streamData.Read(buffer, 0, buffer.Length)) != 0)
                {
                    writer.Write(buffer, 0, readCount);

                    length += readCount;
                }
                streamData.Close();
            }

            return "fileId";
        }

Ajax function for file submission from UI

$.ajax({
                    url: fileUpload + $scope.filename,
                    method: "POST",
                    cache: false,
                    data: data,
                    contentType: "application/octet-stream",
                    enctype: 'multipart/form-data',
                    processData: false

                }).success(function (response) {
                    document.getElementById('file2').value = "";

                    console.log("File uploaded successfully");

                }).error(function (xhr, rrr, error) {
                    console.log("Error while uploading the file: - " + error);
                })

The Web.config script binding configuration

<bindings>
        <webHttpBinding>
            <binding name="webBinding" maxBufferSize="2147483647" maxReceivedMessageSize="2147483647">
                <security mode="None">
                    <transport clientCredentialType="None" />
                </security>
            </binding>
            <binding name="FileWorker.webHttpBinding" maxBufferSize="2147483647" 
                maxReceivedMessageSize="2147483647" transferMode="Streamed">
                <readerQuotas maxDepth="2147483647" maxStringContentLength="2147483647"
                    maxArrayLength="2147483647" maxBytesPerRead="2147483647" maxNameTableCharCount="2147483647" />
            </binding>
            <binding name="webBindingHTTPS" maxBufferSize="2147483647" maxReceivedMessageSize="2147483647">
                <security mode="Transport">
                    <transport clientCredentialType="None" />
                </security>
            </binding>
        </webHttpBinding>
    <bindings>

I have researched everywhere but nothing seems to work