none
How to consume WCF services using jquery in App for office application RRS feed

  • Question

  • Hi,

    I'm using WCF services  and I need to consume the same service on click of a html button

    Please have a look at the below code, I have also realized that App for office doesnt support many of javascript/jquery functions.

     function InvokeService() {
                 $(document).ready(function () {
                   
                     $("#setDatabtn").click(function () {
                         $.ajax({
                             type: "GET",
                             url: "http://localhost:56050/Service1.svc/rh/data?id=" + $('#ddl1').val(),
                             processData: false,
                             contentType: "application/json; charset=utf-8",
                             dataType: "json",
                             success: function (data) {
                                 alert(data);
                                 //openExcelFile(data)
                                 //openExcelFile();
                             },
                             error: function (xhr, status, error) {
                                 alert(error);
                             }
                         });
                     });
                 });
             }

    This code doesnt work with app for office but works perfectly fine with MVC and asp.net applications.

    Please let me know how to achieve the same in App for office

    Thanks,


    Prapthi

    Thursday, September 6, 2012 2:42 PM

Answers

  • Hi Prapthi - you don't post the error you are seeing but I suspect you are running into issues with browser same origin rules. Apps for Office are more like web pages than traditional desktop programs and are bound by the rules of the browser - see the following link for a more detailed explanation:

    http://en.wikipedia.org/wiki/Same_origin_policy

    You have a couple of choices to resolve this:

    1 - Host your app in the same domain as the WCF service (in your case localhost:56050 - obviously this isn't a great solution unless you plan on putting your app on everyone's machine but would work while you test, and then you would move both the app and the service to a new domain on a shared server)

    2 - Weaken your browser's same origin protection by using the following IE9 or IE10 setting:

    - Select the "gear" icon, then Internet Options
    - In the Internet Options dialog select the Security tab
    - Select the "Local Intranet" zone and select the "Custom Level..." button
    - In the Security Settings - Local Intranet Zone, Miscellaneous section, set "Access data sources across domains" to Enable - this enables XML & ADO services to be accessed across domains for pages from servers on your Intranet.

    The downside to doing this is that any page that you load into the browser from your Intranet will be able to access data (as you) on other servers - this is usually ok as long as you trust your Intranet. Note that you may need to change from using http://localhost to using your machine name to indicate that you are working in the Intranet zone (I've not tested this with localhost)

    There are other options for cross domain communication that web developers use, you can search for these on Bing, this is a good technical note from the IE team:

    http://blogs.msdn.com/b/ieinternals/archive/2012/04/03/explaining-same-origin-policy-part-2-limited-write.aspx

    Hope this helps...Patrick

     

    Thursday, September 6, 2012 4:30 PM
  • Hi Patrick,

    Thanks for your reply,

    I just added extra line

    $.support.cors = true

    and it solved my problem.

    Thanks,

    Prapthi

    Friday, September 7, 2012 2:07 PM

All replies

  • Hi Prapthi - you don't post the error you are seeing but I suspect you are running into issues with browser same origin rules. Apps for Office are more like web pages than traditional desktop programs and are bound by the rules of the browser - see the following link for a more detailed explanation:

    http://en.wikipedia.org/wiki/Same_origin_policy

    You have a couple of choices to resolve this:

    1 - Host your app in the same domain as the WCF service (in your case localhost:56050 - obviously this isn't a great solution unless you plan on putting your app on everyone's machine but would work while you test, and then you would move both the app and the service to a new domain on a shared server)

    2 - Weaken your browser's same origin protection by using the following IE9 or IE10 setting:

    - Select the "gear" icon, then Internet Options
    - In the Internet Options dialog select the Security tab
    - Select the "Local Intranet" zone and select the "Custom Level..." button
    - In the Security Settings - Local Intranet Zone, Miscellaneous section, set "Access data sources across domains" to Enable - this enables XML & ADO services to be accessed across domains for pages from servers on your Intranet.

    The downside to doing this is that any page that you load into the browser from your Intranet will be able to access data (as you) on other servers - this is usually ok as long as you trust your Intranet. Note that you may need to change from using http://localhost to using your machine name to indicate that you are working in the Intranet zone (I've not tested this with localhost)

    There are other options for cross domain communication that web developers use, you can search for these on Bing, this is a good technical note from the IE team:

    http://blogs.msdn.com/b/ieinternals/archive/2012/04/03/explaining-same-origin-policy-part-2-limited-write.aspx

    Hope this helps...Patrick

     

    Thursday, September 6, 2012 4:30 PM
  • Hi Patrick,

    Thanks for your reply,

    I just added extra line

    $.support.cors = true

    and it solved my problem.

    Thanks,

    Prapthi

    Friday, September 7, 2012 2:07 PM