• Disclaimer

Developer Concepts

Monthly Archives: March 2011

You are browsing the site archives by month.

WCF Web Service and JavaScript

March 28, 2011 10:30 am / Steve

Over the last week or so I have been playing around with a simple WCF service to send and receive data from JavaScript using JQuery.  I thought that this would be a lot easier than I found it.  The other interesting thing I found is that a few people seem to have had trouble getting the two to connect and work.  When I set up a standard Service in Visual Studio 2010.  I thought it would be easy.  You would just use the $.ajax to send through the request and wait for an answer from the service.  Now this is probably due to the fact that I am not familiar with WCF, but I thought it would be simple.  Well I found that a few things did not work.  So What I have done is created a simple project based in MVC 3 (not that that even matters,  Since there is only one page on the website), and a service.

So these are my steps to getting JQuery to talk to a WCF service.

Start this off by creating a new project.  It can be Web forms or MVC application.  The application type is not the most important part.  As long as it is a web style project.

Creating the Service

Once you have created a solution, add a new WCF service to the project.

New Service

 

When I created the service, I added it to a service folder to keep it separate from the the rest of the web project,  I find it makes it easy to find if there are any changes that need to be made.  There should three files in the folder, an interface, the svc service and the service code behind.

DISCLAIMER:  I had a lot of issue getting the service to work with the interface.  I found that when I deleted it and just worked with the service it worked.  I am not saying that it will not work with the interface.  I just could not get it to work.  So if anyone has information on how to get it working, please let me know.

So before I started trying to connect the JavaScript to the service I went to the service page to make sure it was working the way I expected.  You should get the following page:

Service Page

I found this useful since any errors will be shown and may save you a lot of hassle before trying to connect the JavaScript.  One thing to note is that you need to have at least one method or operation contract or the service will return an error.  There should be one by default when you create the service.  If you have deleted the interface remember to add the [OperationContract] onto the method before checking to see the service works.

There are some changes needed to make the service work:

  • On the Class definition, add the following [ServiceBehavior(IncludeExceptionDetailInFaults = true)].  This will make sure that if there is any errors, the exception will be sent to the JavaScript.  I found this really useful debugging the errors.
  • [AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
  • Right click on the Service.svc file and select View Markup.  Add Factory=”System.ServiceModel.Activation.WebScriptServiceHostFactory” in the ServiceHost definition.
  •  

    Connecting With JavaScript

    This was the easiest part for me.  There are two methods that I used here:  The first obviously was JQuery.  I used the $.ajax to call the WCF service.  You can find the JQuery documentation on the Ajax call here : JQuery Page. The Basic format is this:

    $.ajax({
    url: url, //Url of the Service
    type: “POST”,  //Type of ajax call
    data: JSON2.stringify({ value: “value” }),  //Data to send
    processData: true,
    contentType: “application/json”, //Type of data being sent
    timeout: 10000,
    dataType: “json”,
    success: function (response, status) { //Success Callback
    //Do Something cool here

    }
    },
    error: function (request, textStatus, error) { //Error callback
    alert(“An unexpected error occured”);
    }
    }
    );

    The second thing I use is the json library.  This can be found at http://www.JSON.org/. The method I use here is stringify.  This converts a JavaScript object to a Json string.

    JsonP

    I would like to take the time to look into Jsonp.  Normally you are not allow cross domain calls using normal json.  Jsonp stands for json with padding.  The way this works is by wrapping the json response in script tags.  The way this works is that when you call the sever, you add a jsonp at the end of the url i.e. www.url.com?jsonp=callback.  When the server responds to the call, it will wrap the json response in the method call you specified.  So in this example, the response would be callback({ “property” : “valueDefined” });

    When you implement the callback function all you would do is call the callback method in the following way:

    function callback(jsonObject){
    //Do clever stuff here
    }

    BUT be warned.  This can mean that the service can inject malicious code into browser.  So be careful when using this approach.
    kick it on DotNetKicks.com
    CodeProject

    Posted in: Visual Studio 2010, WCF

    Camel case table names in MySQL

    March 26, 2011 11:01 am / Steve

    I have been working with Entity Framework 4 and MySQL.  The main problem I have found is that since I am working on a windows server, the table names in the database are all lower case.  This means that when I create the entities in Visual Studio, the classes are all lower case. 

    So I have found this solution:

    There is a setting in the configuration file in the MySQL server directory.  I am using Windows 7 so this was under:

    C:Program Files (x86)MySQLMySQL Server 5.5C:Program Files (x86)MySQLMySQL In this Server 5.5

    In this directory you will find a file: my.cnf.  This governs how MySQL runs.  You will need to change or add a line to allow camel casing of table names.  Please note that you should read http://dev.mysql.com/doc/refman/5.0/en/identifier-case-sensitivity.html.  This details the changes and how they should be used on different operating systems.  I am only detailing how I got this to work on windows.  If you are running Linux then please go to the link mentioned above to make sure that the change will not affect your system / MySQL instance.

    Steps taken to allow camel casing:

    • Go to Control Panel –> Administrative Tools –> Services
    • Stop the MySQL Service
    • Open C:Program Files (x86)MySQLMySQL Server 5.5C:Program Files (x86)MySQLMySQL In this Server 5.5
    • Open the my.cnf file as Administrator
    • Add the line lower_case_table_names=2 under the mysqld section.  If this line is there then just change the value to ‘2’.  Make sure that there is only one line there.
    • Go Back to Services and restart MySQL.

    You should be done.  Hope this short guide has helped.

    CodeProject

    Posted in: MySql, Visual Studio 2010 / Tagged: EF 4, Entity Framework 4, MySQL

    Recent Posts

    • Unrecognized element folderLevelBuildProviders
    • Using Javascript to Load Blog Posts From WordPress
    • An introduction to KnockoutJS Observables
    • Automating NTLM logins with Selenium
    • KnockoutJS and Web API

    Recent Comments

      Archives

      • July 2015
      • April 2015
      • March 2015
      • November 2014
      • October 2014
      • June 2014
      • May 2014
      • March 2014
      • February 2014
      • November 2013
      • August 2013
      • January 2013
      • November 2012
      • May 2012
      • September 2011
      • July 2011
      • May 2011
      • March 2011
      • November 2010
      • September 2010
      • February 2010
      • December 2009
      • November 2009
      • October 2009

      Categories

      • Architecture
      • Caching
      • Code Smells
      • Html 5
      • IOC
      • Javascript
      • Jquery
      • JSON
      • KnockoutJS
      • Linq
      • Linq To Xml
      • Mocking
      • MVC
      • MVVM
      • MySql
      • NHibernate
      • Selenium
      • Silverlight
      • Solving Errors
      • Sql
      • TDD
      • Uncategorized
      • Unit Testing
      • Visual Studio 2010
      • WCF

      Meta

      • Log in
      • Entries RSS
      • Comments RSS
      • WordPress.org
      © Copyright 2019 - Developer Concepts
      Infinity Theme by DesignCoral / WordPress