wcf self hosting jquery

Question

I'm trying to call an wcf self hosted method from jquery but, i'm aways getting the message: "method not allowed". I found some answers to this issue on this forum but nothing worked to me.... ps. It works fine when I add the reference on a console app and consume it.

it's an windows forms self-hosted app

form load:

ServiceHost host = new ServiceHost(typeof(MyServices), new Uri[] { });
host.Open();

App.Config

<system.serviceModel>
        <services>
            <service behaviorConfiguration="ServiceConfig" name="MyServices">
                <endpoint address="srv" binding="basicHttpBinding" contract="Operations" />
                <endpoint address="mex" binding="mexHttpBinding" contract="IMetadataExchange" />
                <host>
                    <baseAddresses>
                        <add baseAddress="http://localhost:8766" />
                    </baseAddresses>
                </host>
            </service>
        </services>
        <behaviors>
            <serviceBehaviors>
                <behavior name="ServiceConfig">
                    <serviceMetadata httpGetEnabled="true" />
                </behavior>
            </serviceBehaviors>
        </behaviors>
        <serviceHostingEnvironment aspNetCompatibilityEnabled="true"/>
    </system.serviceModel>

Operation Contract:

[OperationContract]
[WebInvoke(BodyStyle = WebMessageBodyStyle.WrappedRequest, RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json)]
string Test();

Service:

public string Test()
{
return "Good!";
}

JQuery

$.ajax({
    url: "http://localhost:8766/Test",
    contentType: "application/json",
    processData: false,
    //data: '{}', // tried passing data
    type: "GET", // tried POST and pass nothing(deleting this param), but nothing...
    success: function (msg) {
        console.log(msg);
    }
});

Answer 1

Well, your current problem is caused by the fact that WebInvoke, when you don't specify the Method parameter, will default to "POST". Your jQuery code is issuing a "GET" request, so the "method not allowed" error would be expected.

However, your comment about trying GET initially and getting nothing in return makes me lean towards your problem being a violation of the same origin policy with your browser. Since you're hosting the service in a Windows Form with the address of http://localhost:8766, I'm assuming your web site is not located at `http://localhost:8766'. Per the same origin policy:

The term "origin" is defined using the domain name, application layer protocol, and (in most browsers) TCP port of the HTML document running the script. Two resources are considered to be of the same origin if and only if all these values are exactly the same.

If you're returning data from your service in JSON format, you may want to consider using a GET request that returns JSONP. This type of request does not violate the same origin policy as requesting remote scripts are allowed. Your jQuery call would then look like this:

$.ajax({
    url: "http://localhost:8766/Test",
    dataType: "jsonp",
    processData: false,
    type: "GET",
    success: function (msg) {
        console.log(msg);
    }
});

Since you're using WebInvoke, you may also want to use the WebHttpBinding binding instead of BasicHttpBinding. WebInvoke doesn't work unless it's used with WebHttpBinding. And when you use WebHttpBinding, you can customize it so that it responds to JSONP requests. So your config would look like this:

<system.serviceModel>
    <bindings>
        <webHttpBinding>
            <binding name="webHttpBindingWithJsonP" crossDomainScriptAccessEnabled="true" />
        </webHttpBinding>
    </bindings>
    <behaviors>
        <endpointBehaviors>
          <behavior name="webHttpBehavior">
            <webHttp />
          </behavior>
        </endpointBehaviors>
    </behaviors>
    <services>
        <service behaviorConfiguration="ServiceConfig" name="MyServices">
            <endpoint address="srv" binding="webHttpBinding" contract="Operations" bindingConfiguration="webHttpBindingWithJsonP" behaviorConfiguration="webHttpBehavior" />
            <endpoint address="mex" binding="mexHttpBinding" contract="IMetadataExchange" />
            <host>
                <baseAddresses>
                    <add baseAddress="http://localhost:8766" />
                </baseAddresses>
            </host>
        </service>
    </services>
    <behaviors>
        <serviceBehaviors>
            <behavior name="ServiceConfig">
                <serviceMetadata httpGetEnabled="true" />
            </behavior>
        </serviceBehaviors>
    </behaviors>
    <serviceHostingEnvironment aspNetCompatibilityEnabled="true"/>
</system.serviceModel>

Here's a very good blog post that steps you through this.

Hopefully this helps!