I need to have a javascript which will send object as json to WCF service to save it. I have javascript:
<script>
$(document).ready(function(){
$("#submitButton").click(function() {
console.info("executing submitButton click");
TestJSon();
);
});
</script>
<button type="button" id="submitButton">Save</button>
<script>
var varType;
var varUrl;
var varData;
var varContentType;
var varDataType;
var varProcessData;
//Generic function to call AXMX/WCF Service
function CallService()
{
console.log('called CallService')
$.ajax({
type : varType, //GET or POST or PUT or DELETE verb
url : varUrl, // Location of the service
data : varData, //Data sent to server
contentType : varContentType, // content type sent to server
dataType : varDataType, //Expected data format from server
processdata : varProcessData, //True or False
success : function(msg) {//On Successfull service call
ServiceSucceeded(msg);
},
error: ServiceFailed// When Service call fails
});
}
function ServiceSucceeded(result) {//When service call is sucessful
alert('Service call succeded');
varType=null;varUrl = null;varData = null;varContentType = null;varDataType = null;varProcessData = null;
}
function ServiceFailed(result) {
alert('Service call failed: ' + result.status + '' + result.statusText);
varType = null; varUrl = null; varData = null; varContentType = null; varDataType = null; varProcessData = null;
}
function TestJSon() {
varType = "POST";
varUrl = "http://localhost:56616/bebc179a-3a96-4934-88df-df1ca17da8b1/CountryDataService.svc/SaveObject";
varData = { player: {'Name': '1' }};
varContentType = "application/json; charset=utf-8";
varDataType = "json";
varProcessData = true;
CallService();
}
</script>
This script should use this method of WCF:
public void SaveObject(Player player)
{
var input = player;
File.WriteAllText(@"c:\Temp\" + "index.html", input.Name, Encoding.UTF8);
return player;
}
on service interface it is:
[OperationContract]
[WebInvoke(Method = "POST", BodyStyle = WebMessageBodyStyle.Wrapped, ResponseFormat = WebMessageFormat.Json)]
void SaveObject(Player player);
Player class:
[DataContract(Name = "Player")]
public class Player
{
private string _name;
[DataMember]
public string Name { get { return _name; } set { _name = value; } }
}
in the config I have:
<services>
<service name="MyCompany.Services.CountryDataService" behaviorConfiguration="CountryProvinceBehavior" >
<endpoint address="" binding="webHttpBinding" contract="MyCompany.Services.ICountryDataService" behaviorConfiguration="CountryProvinceBehavior"/>
</service>
<behaviors>
<endpointBehaviors>
<behavior name="CountryProvinceBehavior">
<webHttp/>
</behavior>
</endpointBehaviors>
<serviceBehaviors>
<behavior name="CountryProvinceBehavior">
<serviceMetadata httpGetEnabled="true" />
<serviceDebug includeExceptionDetailInFaults="true" />
</behavior>
</serviceBehaviors>
</behaviors>
<system.webServer>
<modules runAllManagedModulesForAllRequests="true" />
</system.webServer>
and the most important - the result: Method ServiceFailed has been hit with code 0 and statusText - NoTransport There was also no traffic (Fiddler told me) the address of service is ok, because when I changed json to jsonp ServiceFailed also has been hit with code 200 and statusText - success.
And there was a traffic:
Request
GET http://localhost:56616/bebc179a-3a96-4934-88df-df1ca17da8b1/CountryDataService.svc/SaveObject?callback=jQuery1710486683341013641_1342788918981&player%5BName%5D=1&_=1342788921786 HTTP/1.1
Accept: application/javascript, */*;q=0.8
Accept-Language: en-US
User-Agent: Mozilla/5.0 (patible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/5.0)
Accept-Encoding: gzip, deflate
Connection: Keep-Alive
Host: localhost:56616
Response
HTTP/1.1 404 Not Found
Content-Length: 1565
Content-Type: text/html; charset=UTF-8
Server: Microsoft-IIS/7.5
X-Powered-By: ASP.NET
Date: Fri, 20 Jul 2012 12:55:21 GMT
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ".dtd">
<html xmlns="">
<head>
<title>Service</title>
<style>BODY { color: #000000; background-color: white; font-family: Verdana; margin-left: 0px; margin-top: 0px; } #content { margin-left: 30px; font-size: .70em; padding-bottom: 2em; } A:link { color: #336699; font-weight: bold; text-decoration: underline; } A:visited { color: #6699cc; font-weight: bold; text-decoration: underline; } A:active { color: #336699; font-weight: bold; text-decoration: underline; } .heading1 { background-color: #003366; border-bottom: #336699 6px solid; color: #ffffff; font-family: Tahoma; font-size: 26px; font-weight: normal;margin: 0em 0em 10px -20px; padding-bottom: 8px; padding-left: 30px;padding-top: 16px;} pre { font-size:small; background-color: #e5e5cc; padding: 5px; font-family: Courier New; margin-top: 0px; border: 1px #f0f0e0 solid; white-space: pre-wrap; white-space: -pre-wrap; word-wrap: break-word; } table { border-collapse: collapse; border-spacing: 0px; font-family: Verdana;} table th { border-right: 2px white solid; border-bottom: 2px white solid; font-weight: bold; background-color: #cecf9c;} table td { border-right: 2px white solid; border-bottom: 2px white solid; background-color: #e5e5cc;}</style>
</head>
<body>
<div id="content">
<p class="heading1">Service</p>
<p>Endpoint not found.</p>
</div>
</body>
</html>
So, I need help with saving this Player object at my WCF service. I'm using Wk8 and 4.0
I will be gratefull for any help.
I need to have a javascript which will send object as json to WCF service to save it. I have javascript:
<script>
$(document).ready(function(){
$("#submitButton").click(function() {
console.info("executing submitButton click");
TestJSon();
);
});
</script>
<button type="button" id="submitButton">Save</button>
<script>
var varType;
var varUrl;
var varData;
var varContentType;
var varDataType;
var varProcessData;
//Generic function to call AXMX/WCF Service
function CallService()
{
console.log('called CallService')
$.ajax({
type : varType, //GET or POST or PUT or DELETE verb
url : varUrl, // Location of the service
data : varData, //Data sent to server
contentType : varContentType, // content type sent to server
dataType : varDataType, //Expected data format from server
processdata : varProcessData, //True or False
success : function(msg) {//On Successfull service call
ServiceSucceeded(msg);
},
error: ServiceFailed// When Service call fails
});
}
function ServiceSucceeded(result) {//When service call is sucessful
alert('Service call succeded');
varType=null;varUrl = null;varData = null;varContentType = null;varDataType = null;varProcessData = null;
}
function ServiceFailed(result) {
alert('Service call failed: ' + result.status + '' + result.statusText);
varType = null; varUrl = null; varData = null; varContentType = null; varDataType = null; varProcessData = null;
}
function TestJSon() {
varType = "POST";
varUrl = "http://localhost:56616/bebc179a-3a96-4934-88df-df1ca17da8b1/CountryDataService.svc/SaveObject";
varData = { player: {'Name': '1' }};
varContentType = "application/json; charset=utf-8";
varDataType = "json";
varProcessData = true;
CallService();
}
</script>
This script should use this method of WCF:
public void SaveObject(Player player)
{
var input = player;
File.WriteAllText(@"c:\Temp\" + "index.html", input.Name, Encoding.UTF8);
return player;
}
on service interface it is:
[OperationContract]
[WebInvoke(Method = "POST", BodyStyle = WebMessageBodyStyle.Wrapped, ResponseFormat = WebMessageFormat.Json)]
void SaveObject(Player player);
Player class:
[DataContract(Name = "Player")]
public class Player
{
private string _name;
[DataMember]
public string Name { get { return _name; } set { _name = value; } }
}
in the config I have:
<services>
<service name="MyCompany.Services.CountryDataService" behaviorConfiguration="CountryProvinceBehavior" >
<endpoint address="" binding="webHttpBinding" contract="MyCompany.Services.ICountryDataService" behaviorConfiguration="CountryProvinceBehavior"/>
</service>
<behaviors>
<endpointBehaviors>
<behavior name="CountryProvinceBehavior">
<webHttp/>
</behavior>
</endpointBehaviors>
<serviceBehaviors>
<behavior name="CountryProvinceBehavior">
<serviceMetadata httpGetEnabled="true" />
<serviceDebug includeExceptionDetailInFaults="true" />
</behavior>
</serviceBehaviors>
</behaviors>
<system.webServer>
<modules runAllManagedModulesForAllRequests="true" />
</system.webServer>
and the most important - the result: Method ServiceFailed has been hit with code 0 and statusText - NoTransport There was also no traffic (Fiddler told me) the address of service is ok, because when I changed json to jsonp ServiceFailed also has been hit with code 200 and statusText - success.
And there was a traffic:
Request
GET http://localhost:56616/bebc179a-3a96-4934-88df-df1ca17da8b1/CountryDataService.svc/SaveObject?callback=jQuery1710486683341013641_1342788918981&player%5BName%5D=1&_=1342788921786 HTTP/1.1
Accept: application/javascript, */*;q=0.8
Accept-Language: en-US
User-Agent: Mozilla/5.0 (patible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/5.0)
Accept-Encoding: gzip, deflate
Connection: Keep-Alive
Host: localhost:56616
Response
HTTP/1.1 404 Not Found
Content-Length: 1565
Content-Type: text/html; charset=UTF-8
Server: Microsoft-IIS/7.5
X-Powered-By: ASP.NET
Date: Fri, 20 Jul 2012 12:55:21 GMT
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3/1999/xhtml">
<head>
<title>Service</title>
<style>BODY { color: #000000; background-color: white; font-family: Verdana; margin-left: 0px; margin-top: 0px; } #content { margin-left: 30px; font-size: .70em; padding-bottom: 2em; } A:link { color: #336699; font-weight: bold; text-decoration: underline; } A:visited { color: #6699cc; font-weight: bold; text-decoration: underline; } A:active { color: #336699; font-weight: bold; text-decoration: underline; } .heading1 { background-color: #003366; border-bottom: #336699 6px solid; color: #ffffff; font-family: Tahoma; font-size: 26px; font-weight: normal;margin: 0em 0em 10px -20px; padding-bottom: 8px; padding-left: 30px;padding-top: 16px;} pre { font-size:small; background-color: #e5e5cc; padding: 5px; font-family: Courier New; margin-top: 0px; border: 1px #f0f0e0 solid; white-space: pre-wrap; white-space: -pre-wrap; word-wrap: break-word; } table { border-collapse: collapse; border-spacing: 0px; font-family: Verdana;} table th { border-right: 2px white solid; border-bottom: 2px white solid; font-weight: bold; background-color: #cecf9c;} table td { border-right: 2px white solid; border-bottom: 2px white solid; background-color: #e5e5cc;}</style>
</head>
<body>
<div id="content">
<p class="heading1">Service</p>
<p>Endpoint not found.</p>
</div>
</body>
</html>
So, I need help with saving this Player object at my WCF service. I'm using Wk8 and 4.0
I will be gratefull for any help.
Let's do this step by step so that you could have a starting base.
Add a model class
[DataContract]
public class Player
{
[DataMember]
public string Name { get; set; }
}
A service contract:
[ServiceContract]
public interface ICountryDataService
{
[OperationContract]
[WebInvoke(Method = "POST", RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.WrappedRequest)]
void SaveObject(Player player);
}
And an implementation:
public class CountryDataService : ICountryDataService
{
public void SaveObject(Player player)
{
}
}
Add an .svc endpoint (CountryDataService.svc):
<%@ ServiceHost
Language="C#"
Debug="true"
Service="MyService.CountryDataService"
%>
Modify web.config:
<system.serviceModel>
<behaviors>
<endpointBehaviors>
<behavior name="CountryProvinceBehavior">
<webHttp/>
</behavior>
</endpointBehaviors>
<serviceBehaviors>
<behavior name="">
<serviceMetadata httpGetEnabled="true" />
<serviceDebug includeExceptionDetailInFaults="false" />
</behavior>
</serviceBehaviors>
</behaviors>
<services>
<service name="MyService.CountryDataService">
<endpoint
address=""
binding="webHttpBinding"
contract="MyService.ICountryDataService"
behaviorConfiguration="CountryProvinceBehavior" />
</service>
</services>
<serviceHostingEnvironment multipleSiteBindingsEnabled="true" />
</system.serviceModel>
Add an index.htm to consume:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript" src=" http://ajax.googleapis./ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$.ajax({
url: 'countrydataservice.svc/saveobject',
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({ player: { Name: 'foo bar'} }),
success: function (result) {
}
});
</script>
</body>
</html>
UPDATE:
And here's a link to my sample solution: http://www.filedropper./myservice
Looks like you have the wrong element in the endpoint behavior.
Try replacing <webHttp/> with <enableWebSCript/> in your config.
<endpointBehaviors>
<behavior name="CountryProvinceBehavior">
<enableWebScript/>
</behavior>
</endpointBehaviors>
When you set endpoint behaviour configuration to use <enableWebScript /> WCF generates for you JavaScript Proxy endpoint. So it will be more simple for you to use it out of box.
Web.config file
<system.serviceModel>
<services>
<service name="Service.TestService">
<endpoint address="" contract="Service.ITestService" binding="webHttpBinding" behaviorConfiguration="web"/>
</service>
</services>
<behaviors>
<serviceBehaviors>
<behavior name="">
<serviceMetadata httpGetEnabled="true" />
</behavior>
</serviceBehaviors>
<endpointBehaviors>
<behavior name="web">
<enableWebScript />
</behavior>
</endpointBehaviors>
</behaviors>
Service contract
[ServiceContract(Name = "TestService", Namespace = "Service")]
public interface ITestService
{
[OperationContract]
[WebInvoke(ResponseFormat = WebMessageFormat.Json, RequestFormat = WebMessageFormat.Json)]
int GetSum(int a, int b);
}
For example, your service hosted on localhost/TestService.svc, then to get JavaScript proxy class code you should go to url localhost/TestService.svc/js
How to use JS proxy class
var proxy = new Service.TestService();
proxy.GetSum(1, 2, function(response) { alert('Result: ' + response); }, function(response) { alert('Error'); }, proxy);
For more info look at http://msdn.microsoft./en-us/library/bb412167.aspx