locked
WCF from Jquery RRS feed

  • Question

  • User564472261 posted

    Hi

    I'm doing this tutorial to call a Wcf service from jquery:

    http://www.encodedna.com/wcf/tutorial/call-wcf-service-from-jquery-ajax-json-aspdotnet.htm

    It go.

    But when i try to call the service from another project it doesn't go.

    Certanily i wrong to divide web.config.

    This the tutorial web.config

    <system.serviceModel>
        <services>
          <service name="Books" behaviorConfiguration="MyServiceBehavior">

            <endpoint
                address=""
                binding="webHttpBinding"
                behaviorConfiguration="webEndPointBehavior"
                name="webEndPoint"
                contract="IBooks"/>

          </service>
        </services>

        <behaviors>
          <serviceBehaviors>
            <behavior name="MyServiceBehavior">
              <serviceMetadata httpGetEnabled="true"/>
              <serviceDebug includeExceptionDetailInFaults="true"/>
            </behavior>
          </serviceBehaviors>

          <endpointBehaviors>
            <behavior name="webEndPointBehavior">
              <webHttp />
            </behavior>
          </endpointBehaviors>

        </behaviors>

        <serviceHostingEnvironment multipleSiteBindingsEnabled="true"/>
      </system.serviceModel>

    I divided in service web config:

    <system.serviceModel>
        <services>
          <service name="Books" behaviorConfiguration="MyServiceBehavior">

          </service>
        </services>

        <behaviors>
          <serviceBehaviors>
            <behavior name="MyServiceBehavior">
              <serviceMetadata httpGetEnabled="true"/>
              <serviceDebug includeExceptionDetailInFaults="true"/>
            </behavior>
          </serviceBehaviors>

          

        </behaviors>

        <serviceHostingEnvironment multipleSiteBindingsEnabled="true"/>
      </system.serviceModel>

    and consumer web.config:

    <system.serviceModel>
            <bindings>
                <webHttpBinding>
                    <binding name="WebHttpBinding_IBooks" />
                </webHttpBinding>
            </bindings>
            <client>
                <endpoint address="http://localhost:3268/Books.svc" binding="webHttpBinding"
                    bindingConfiguration="WebHttpBinding_IBooks" contract="BooksReference.IBooks"
                    name="WebHttpBinding_IBooks" />
            </client>
          
          
          <behaviors>
            <endpointBehaviors>
              <behavior name="webEndPointBehavior">
                <webHttp />
              </behavior>
            </endpointBehaviors>
          </behaviors>

        </system.serviceModel>

    Friday, October 2, 2015 3:20 AM

Answers

All replies

  • User475983607 posted

    Open Developer Tools (F12) and go to the console tab to view script errors.

    Are you receiving a CORS error?  

    http://forums.asp.net/p/2066964/5962489.aspx?Re+webservice+Access+Control+Allow+Origin+header+is+present+on+the+requested+resource

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, October 2, 2015 6:23 AM
  • User564472261 posted

    The console tab is empty.

    If I use the tutorial web.config and the jquery in the same project it goes. But if I try from another project id doesn't go.

    With the tutorial web.config (the first i wrote) the service don't start. If I delete enpoint it starts but jquery consumer don't go.

    Saturday, October 3, 2015 3:03 AM
  • User475983607 posted

    The console tab is empty.

    If I use the tutorial web.config and the jquery in the same project it goes. But if I try from another project id doesn't go.

    With the tutorial web.config (the first i wrote) the service don't start. If I delete enpoint it starts but jquery consumer don't go.

    What does "Don't go" mean?  In developer tools there is a network tab.  The network allows you to see network traffic.  Do you see the new request when clicking the btSubmit button?  Did you remember to update the service URL?  This other project, did you remember to start the project before making the call?  

    BTW, you can start the project by right clicking the svc file and selecting "View In Browser".

    Saturday, October 3, 2015 8:12 AM
  • User564472261 posted

    Ok I used view in browser now.

    The console tab say:

    <div class="logContent ">"NetworkError: 405 Method Not Allowed - http://localhost:3268/Books.svc/ShowBookDetails"</div>

    But if I use the consumer inside web service project all go well. (Same Jquery code)

     

    Sunday, October 4, 2015 3:33 AM
  • User475983607 posted

    WebDeveloper3

    Ok I used view in browser now.

    The console tab say:

    <div class="logContent ">"NetworkError: 405 Method Not Allowed - http://localhost:3268/Books.svc/ShowBookDetails"</div>

    But if I use the consumer inside web service project all go well. (Same Jquery code)

    You're trying to make a Cross Domain Request (CORs) and have not configured the service correctly.  See my first response and click the link!

    Sunday, October 4, 2015 9:05 AM
  • User564472261 posted

    Ok I see your link.

    This is my new web.config

    <system.webServer>
        <httpProtocol>
          <customHeaders>
            <add name="Access-Control-Allow-Headers" value="accept, content-type" />
            <add name="Access-Control-Allow-Origin" value="http://localhost:3268/Books.svc" />
            <add name="Access-Control-Allow-Methods" value="POST, GET, OPTIONS" />
          </customHeaders>
        </httpProtocol>
      </system.webServer>

       <system.serviceModel>
        <services>
          <service name="Books" behaviorConfiguration="MyServiceBehavior">

            <endpoint
                address=""
                binding="webHttpBinding"
                behaviorConfiguration="webEndPointBehavior"
                name="webEndPoint"
                contract="IBooks"/>

          </service>
        </services>

        <behaviors>
          <serviceBehaviors>
            <behavior name="MyServiceBehavior">
              <serviceMetadata httpGetEnabled="true"/>
              <serviceDebug includeExceptionDetailInFaults="true"/>
            </behavior>
          </serviceBehaviors>

          <endpointBehaviors>
            <behavior name="webEndPointBehavior">
              <webHttp />
            </behavior>
          </endpointBehaviors>

        </behaviors>

        <serviceHostingEnvironment multipleSiteBindingsEnabled="true" aspNetCompatibilityEnabled="true">
         
        </serviceHostingEnvironment>
      </system.serviceModel>

    Same error. Then i inserted in Global.asax this:

    void Application_BeginRequest(object sender, EventArgs e)
    {
    	var context = HttpContext.Current;
    	var response = context.Response;
    	
    	// enable CORS
    	response.AddHeader("Access-Control-Allow-Origin", "*");
    	
    	if (context.Request.HttpMethod == "OPTIONS")
    	{
    		response.AddHeader("Access-Control-Allow-Methods", "GET, POST, OPTIONS");
    		response.AddHeader("Access-Control-Allow-Headers", "Content-Type, Accept");
    		response.End();
    	}
    }

    Jquery say error but the browser console now is empty.

    I searched on web tutoriols on Cross Domain Request. For example this:

    http://www.codeproject.com/Articles/223572/Calling-Cross-Domain-WCF-service-using-Jquery-Java

    But <standardendpoints> and <modules> give me compile error.

    It's so difficult call a service with Jquery????

    Tuesday, October 6, 2015 6:00 AM
  • User475983607 posted

    Jquery say error but the browser console now is empty.

    What is the error?

    It's so difficult call a service with Jquery????

    My previous link contained a MSD article that explains how CORs works.  Did you read it?

    Are you looking at the network tab in developer tools to view the HTTP requests?  Are you making sure the service is running/hosted?

    Tuesday, October 6, 2015 6:54 AM
  • User564472261 posted

    What is the error?

    Jquery window say only "Error". The browser console now give me no error.

    My previous link contained a MSD article that explains how CORs works.  Did you read it?

    Are you looking at the network tab in developer tools to view the HTTP requests?  Are you making sure the service is running/hosted?

    Yes i read it and I tried to modify my code. The service is viewed in browser.

    This is the network tab:

    POST Default.aspx (http://localhost:3374/Default.aspx)

    Response Header

    Cache-Control private
    Content-Encoding gzip
    Content-Length 1271
    Content-Type text/html; charset=utf-8
    Date Tue, 06 Oct 2015 11:27:08 GMT
    Server Microsoft-IIS/8.0
    Vary Accept-Encoding
    X-AspNet-Version 4.0.30319
    X-Powered-By ASP.NET
    X-SourceFiles =?UTF-8?B?QzpcVXNlcnNcTWFyY29cRG9jdW1lbnRzXFZpc3VhbCBTdHVkaW8gMjAxMlxUZWNoXFdDRlxXQ0ZKcXVlcnk0Q29uc3VtZXJcRGVmYXVsdC5hc3B4?=

    Request Header

    Accept text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
    Accept-Encoding gzip, deflate
    Accept-Language it-IT,it;q=0.8,en-US;q=0.5,en;q=0.3
    Connection keep-alive
    Cookie ASP.NET_SessionId=dpwatsyymee2tt2paoe4wo1t
    Host localhost:3374
    Referer http://localhost:3374/Default.aspx
    User-Agent Mozilla/5.0 (Windows NT 6.1; WOW64; rv:41.0) Gecko/20100101 Firefox/41.0

    OPTIONS ShowBookDetails (http://localhost:3268/Books.svc/ShowBookDetails)

    Response Header

    Access-Control-Allow-Head... Content-Type, Accept, accept, content-type
    Access-Control-Allow-Meth... GET, POST, OPTIONS, POST, GET, OPTIONS
    Access-Control-Allow-Orig... *, http://localhost:3268/Books.svc
    Content-Length 0
    Date Tue, 06 Oct 2015 11:27:12 GMT
    Server Microsoft-IIS/8.0
    X-Powered-By ASP.NET
    X-SourceFiles =?UTF-8?B?QzpcVXNlcnNcTWFyY29cRG9jdW1lbnRzXFZpc3VhbCBTdHVkaW8gMjAxMlxUZWNoXFdDRlxXQ0ZKcXVlcnk0XEJvb2tzLnN2Y1xTaG93Qm9va0RldGFpbHM=?=

    Request Header

    Accept text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
    Accept-Encoding gzip, deflate
    Accept-Language it-IT,it;q=0.8,en-US;q=0.5,en;q=0.3
    Access-Control-Request-He... content-type
    Access-Control-Request-Me... POST
    Cache-Control no-cache
    Connection keep-alive
    Host localhost:3268
    Origin http://localhost:3374
    Pragma no-cache
    User-Agent Mozilla/5.0 (Windows NT 6.1; WOW64; rv:41.0) Gecko/20100101 Firefox/41.0

    Tuesday, October 6, 2015 7:38 AM