Search code examples
jquerynode.jswcf

Call WCF service from jquery ajax using node js


Hi I'm trying to call a WCF service using jquery ajax in my node js application.

It won't give any error but the service is not invoking. But when I try this code without node js it works.

How can I call the wcf service from node js

WCF Service Contract

 [ServiceContract]
    public interface IService1
    {

        [OperationContract]
        [WebInvoke(Method = "POST",
               BodyStyle = WebMessageBodyStyle.Wrapped,
               ResponseFormat = WebMessageFormat.Json)]
        string GetData(int value);

        [OperationContract]
        CompositeType GetDataUsingDataContract(CompositeType composite);

        // TODO: Add your service operations here
    }

WCF Service

 public class Service1 : IService1
    {
        public string GetData(int value)
        {
            return string.Format("You entered: {0}", value);
        }
     }

Web.config

<system.serviceModel>
    <behaviors>
      <serviceBehaviors>
        <behavior name="ServiceBehavior">
          <serviceMetadata httpGetEnabled="true"/>
          <serviceDebug includeExceptionDetailInFaults="true"/>
        </behavior>
      </serviceBehaviors>
      <endpointBehaviors>
        <behavior name="EndpBehavior">
          <webHttp />
        </behavior>
      </endpointBehaviors>
    </behaviors>
    <protocolMapping>
        <add binding="basicHttpsBinding" scheme="https" />
    </protocolMapping>    
    <serviceHostingEnvironment aspNetCompatibilityEnabled="true" multipleSiteBindingsEnabled="true" />
    <services>
      <service behaviorConfiguration="ServiceBehavior" name="Service1">
        <endpoint address="" binding="webHttpBinding" contract="IService1" behaviorConfiguration="EndpBehavior"/>
      </service>
    </services>
  </system.serviceModel>
  <system.webServer>
    <modules runAllManagedModulesForAllRequests="true"/>
    <!--
        To browse web app root directory during debugging, set the value below to true.
        Set to false before deployment to avoid disclosing web app folder information.
      -->
    <directoryBrowse enabled="true"/>
  </system.webServer>

And my Node js code

var jsdom = require("jsdom");
const { JSDOM } = jsdom;
const { window } = new JSDOM();
const { document } = (new JSDOM('')).window;
global.document = document;

var $ = jQuery = require('jquery')(window);

var showStb = function(){
    try{    
    $.ajax({
                type: "POST",              
                url: "http://localhost:56147/Service1.svc/GetData",
                data: '{"value": "2"}', 
                dataType: "jsonp",
                contentType: "application/json", // content type sent to server
                success: function(data){
                    console.log(data);
                },
                error: function(err){
                    console.log(err);
                }
            });


    }
    catch(e){
                console.log( e);
    }
};

showStb();

I'm following this sample enter link description here


Solution

  • Assuming your service is hosted properly.Let me try to reorder and explain you each property .

     $.ajax({
                   //where is thre url present
                    url: "http://localhost:56147/Service1.svc/GetData",
                    //what kind of request
                    method: "post", 
                    //contenttype that we will send it to the server 
                    contentType: "application/json;charset-utf-8", 
                    //lets convert the data to json and send it to the server
                    data: JSON.stringify({value: "2"}), 
                    dataType: "json",
                    //when the request is success
                    success: function(data){
                        console.log(data);
                    },
                    //if any error 
                    error: function(err){
                        console.log(err);
                    }
                });
    

    This should do the work instead of using jsonp.