title: Problem sending JSON data from JQuery to WCF REST method
body: <p>I'm having some trouble getting jquery to post some json data to a rest method I have on my WCF service.</p>
  
  <p>On the WCF side, here's the operation contract:</p>
  
  <pre><code>[OperationContract]
  [WebInvoke(Method = "POST",
             BodyStyle = WebMessageBodyStyle.Bare,
             RequestFormat = WebMessageFormat.Json,
             ResponseFormat = WebMessageFormat.Json,
             UriTemplate = "PostSomething")]
  MyResult PostSomething(MyRequest request);
  </code></pre>
  
  <p>both <code>MyResult</code> and <code>MyRequest</code> are marked with all the necessary <code>DataContract</code> and <code>DataMember</code> attributes and service is exposing WebHttp endpoint.</p>
  
  <p>On the JQuery side, here's my function call:</p>
  
  <pre><code>var jsonStr = JSON.stringify(reqObj);
  
  $.ajax({
      type: "POST",
      dataType: "json",
      url: "http://localhost/MyService/PostSomething",
      contentType: "application/json; charset=utf-8",
      data: jsonStr,
      success: function (html) {
          alert(html);
      }
  });
  </code></pre>
  
  <p>this request never reaches my method (I get a 405 Method Not Allowed everytime), and looking in Charles the request looks like this:</p>
  
  <pre><code>OPTIONS /MyService/PostSomething HTTP/1.1
  Host: localhost
  Cache-Control: max-age=0
  Access-Control-Request-Method: POST
  Origin: null
  Access-Control-Request-Headers: Content-Type, Accept
  Accept: */*
  User-Agent: Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US) AppleWebKit/534.10 (KHTML, like Gecko) Chrome/8.0.552.237 Safari/534.10
  Accept-Encoding: gzip,deflate,sdch
  Accept-Language: en-GB,en-US;q=0.8,en;q=0.6
  Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.3
  </code></pre>
  
  <p>couple of things which is strange about this:</p>
  
  <ol>
  <li>the method is OPTIONS not POST</li>
  <li>the content-type (in another tab) shows <code>text/html; charset=UTF-8</code> instead of json</li>
  <li>the JSON data is no where to be seen</li>
  </ol>
  
  <p>However, if I modify the request in Charles so that its headers is similar to the solution <a href="http://social.msdn.microsoft.com/forums/en-US/wcf/thread/3a7b550d-9ee3-4a8c-8c25-89baa347ae67/" rel="noreferrer">here</a>, then everything works:</p>
  
  <pre><code>POST /MyService/PostSomething HTTP/1.1
  Content-Type: application/json; charset=utf-8
  Host: localhost
  Content-Length: 152
  
  {"Id":"", "Name":"testspot","Description":"test" } 
  </code></pre>
  
  <p>looking at tutorials and other questions on here others have managed to get JQuery to post to a WCF REST method like this, and I'm at a loss as to what I'm doing wrong here..</p>
  
  <p>oh, to put some context, this is a WCF 4 service and I'm using JQuery 1.4.4.</p>
  
  <p>Thanks,</p>
  
  <p><strong>UPDATE:</strong></p>
  
  <p>After some more reading and thanks to Darrel for pointing me towards the cross-domain spec, I managed to get a bit further by making some small changes to my service, on the service interface:</p>
  
  <pre><code>[OperationContract]
  [WebInvoke(Method = "*",
             BodyStyle = WebMessageBodyStyle.Bare,
             RequestFormat = WebMessageFormat.Json,
             ResponseFormat = WebMessageFormat.Json,
             UriTemplate = "PostSomething")]
  MyResult PostSomething(MyRequest request);
  </code></pre>
  
  <p>and in the implementation, I need to check if the incoming requests is for OPTIONS and in that case return some headers rather than doing the intended work:</p>
  
  <pre><code>if (WebOperationContext.Current.IncomingRequest.Method == "OPTIONS")
  {
      WebOperationContext.Current.OutgoingResponse.Headers.Add("Access-Control-Allow-Origin", "*");
      WebOperationContext.Current.OutgoingResponse.Headers.Add("Access-Control-Allow-Methods", "POST");
      WebOperationContext.Current.OutgoingResponse.Headers.Add("Access-Control-Allow-Headers", "Content-Type, Accept");
  
      return null;
  }
  </code></pre>
  
  <p>the method then gets called twice, the first time the server returns null but adds some headers to the client, and then the actual request is made with POST as method and the server goes ahead and deals with the request normally.</p>