Menu
I know it seems this question has been posted many times, but I've read nearly all of them (an most of the tutorials on the internet), and I still can't grasp what I'm doing wrong.
I tried to implement in a web site we're developing a WCF web service to be consumed by a jQuery script, but I keep getting 400 Bad Request when doing the AJAX request, and I'm starting to loose hope.
Please note that I'm new to WCF, and I've formed myself only through online tutorials, so it's entirely possible I overlook or majorly screwed up something.
Questions I tried but didn't help:
External resources I read to no avail:
I also tried creating a new solution, with only a page and the service, to rule out interferences, but I still have the same problem. Here you can find the code:
IService.cs
namespace WebService
{
using System;
using System.ServiceModel;
using System.ServiceModel.Web;
[ServiceContract(Name = "Service", Namespace = "WebService")]
public interface IService
{
[OperationContract]
[WebInvoke(BodyStyle = WebMessageBodyStyle.Wrapped, Method = "POST", RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json)]
String Test();
}
}
Service.svc.cs
namespace WebService
{
using System;
public class Service : IService
{
public String Test()
{
return "Hello, world.";
}
}
}
Default.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebService.Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#doAjax").click(function (event) {
event.preventDefault();
jQuery.ajax({
contentType: "application/json"
, dataType: "text"
, error: function (jqXHR, textStatus, errorThrown) {
console.group("AJAX error:");
console.debug(jqXHR);
console.debug(textStatus);
console.groupEnd();
}
, processData: false
, success: function (data, textStatus, jqXHR) {
console.group("AJAX success:");
console.debug(data);
console.debug(textStatus);
console.debug(jqXHR);
console.groupEnd();
}
, type: "post"
, url: "/Service.svc/Test"
});
});
});
</script>
<title>WebService</title>
</head>
<body>
<form runat="server">
<h1><%= this.Page.Title %></h1>
<p><input id="doAjax" type="button" value="Run" /></p>
</form>
</body>
</html>
Web.config
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<system.web>
<compilation debug="true" targetFramework="4.0" />
</system.web>
<system.serviceModel>
<bindings />
<client />
<behaviors>
<endpointBehaviors>
<behavior name="Behavior">
<webHttp />
</behavior>
</endpointBehaviors>
<serviceBehaviors>
<behavior name="">
<serviceMetadata httpGetEnabled="true" />
<serviceDebug includeExceptionDetailInFaults="false" />
</behavior>
</serviceBehaviors>
</behaviors>
<serviceHostingEnvironment multipleSiteBindingsEnabled="true" />
<services>
<service name="Service">
<endpoint behaviorConfiguration="Behavior" binding="webHttpBinding" contract="WebService.IService" />
</service>
</services>
</system.serviceModel>
</configuration>
880
The service name must be fully qualified. Try: <service name="WebService.Service">
60
Hey! I was having this same problem (.....again) but finally figured it out and got it working properly.
Now this is my own example, but because it worked for me, hopefully it will work for you too... The key line that I was forgetting was in my $ajax command:
contentType: "application/json; charset=utf-8"
Good luck :) I spent half a day on this issue.
interface:
[OperationContract]
[WebInvoke(ResponseFormat = WebMessageFormat.Json)]
int CreateMilestone(Milestone Input);
Class:
[DataContract]
public class Milestone
{
[DataMember]
public string Name { get; set; }
[DataMember]
public string Date { get; set; }
[DataMember]
public int Risk { get; set; }
[DataMember]
public int Complexity { get; set; }
}
the method:
public int CreateMilestone(Milestone Input)
{
return 0;
}
the jquery:
$("#btnSubmit").click(function () {
if ($.trim($("#txtName").val()) == "") {
$("#dName").effect("highlight", 500);
}
else {
var date = $("#txtDate").datepicker("getDate");
var data = {
Name: $("#txtName").val(),
Date: (date.getMonth() + 1) + "-" + date.getDate() + "-" + date.getFullYear(),
Risk: parseInt($("#sRisk").text()),
Complexity: parseInt($("#sComplexity").text())
};
var jsondata = JSON.stringify(data);
$.ajax({
type: "POST",
async: false,
url: 'Services/ProjectService.svc/CreateMilestone',
contentType: "application/json; charset=utf-8",
data: jsondata,
dataType: "json",
success: function (msg) {
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
// alert(XMLHttpRequest.status);
// alert(XMLHttpRequest.responseText);
}
});
}
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
