Skip to main content

Web API, JSON, AJAX, CORS, Chrome 500 error and Authentication–Oh My!

By

I have been working on a project that is using .Net 4.0 and MVC 4 with Web API. Web API is great and provides a lot of great functionality easily. We have needed to call our Web API from another domain though which introduces Cross Origin Resource Sharing (CORS) issues. Web API in 4.0 does not really support this so it has been causes us issues, you can configure IIS to work with it pretty easily.. In later version it will support it better. See the following links:

Web API VS 2013 (.Net 4.5 and later)

http://aspnetwebstack.codeplex.com/

Enabling Cross-Origin Requests in ASP.NET Web API

ASP.NET Web API: CORS support and Attribute Based Routing Improvements

However, if you are using 4.0 that is not much help to you. We have had to push through a few issues on this front. If you are testing with IE8 you will not see them as it does not care about CORS issues. If it is working in IE but not working in Chrome or FireFox here are some issues we have been working through:

 

Some calls return data others do not

Be default Web returns both XML and JSON formatted objects. If you are doing a browser based request (especially in Chrome) the default request asks for XML back. Look at what type of objects you are returning. If you are returning an complex type that holds a complex type this can cause an issue. The embedded complex types may need serialization defined for them. Or you can just remove the XML serializor which forces the response to be JSON instead of XML.

In the WebAPIConfig.cs Register method:

//Remove XML formatting 
config.Formatters.Remove(config.Formatters.XmlFormatter);
 

Some calls never get to the API

If you are seeing your calls in a cancelled state (Chrome inspector or fiddler) this means you are having CORS issues. This means the browser sees that you are trying to request data from the client side from a different domain. Keep in mind here that domain means different website. So just because you have test1.mysite.com  and test2.mysite.com (same domain different sub domain) it does not mean you are good. If those two sites are hosted in different webservers or different sites in IIS. Here are some sites with solutions on what you need to setup to make this work.

Web API, JavaScript, Chrome & Cross-Origin Resource Sharing

jQuery, CORS, JSON (without padding) and authentication issues

Using CORS to access ASP.NET services across domains

http://www.w3.org/TR/access-control/#origin-request-header

HTTP Cookies and Ajax requests over HTTPS

Here is an example AJAX call I setup that works. 

var xhr = new XMLHttpRequest();
 
$.ajax( {
  method: "POST",
  url: form.attr( 'action' ),
  data: form.serialize(),
  xhrFields: {withCredentials: true},      
    cache: false,
    async:true,
  dataType: "application/x-www-form-urlencoded",
  success: function( response ) 
{
    console.log( response );
},
error: function (XMLHttpResponse, textStatus, errorThrown) {
            console.log(XMLHttpResponse);console.log(textStatus); console.log(errorThrown);
        }
 });

 

Passing Credentials and Cookies

Notice that I have xhrFields: {withCredentials: true}, this is a must have if you are doing an AJAX call that requires authentication. This will make sure any cookies created stay attached to the request.

We had to do authentication with Novell Access Manager (NetIQ Access Manager) and it was a serious pain. NetIQ really struggles to allow CORS calls. In fact I would say that it does not. Now I am no NAM expert and we were working with another firm who managed that, so if you know how to make it support CORS let me know. We ended up having to make it so CORS did not come into play.

There seems to be some confusion on the origin request header. You will even see this in some posts. Some people say to if you need to allow multiple headers just add it in one header separated by a comma. Others will say add multiple headers. Here is the key. If your request includes credentials you can only have one origin and no wildcards.

Per the w3 specs:

“If the resource supports credentials add a single Access-Control-Allow-Origin header, with the value of the Origin header as value, and add a single Access-Control-Allow-Credentials header with the case-sensitive string "true" as value.”

Labels:

Comments

Post a Comment

Popular posts from this blog

Excel XIRR and C#

By
I have spend that last couple days trying to figure out how to run and Excel XIRR function in a C# application. This process has been more painful that I thought it would have been when started. To save others (or myself the pain in the future if I have to do it again) I thought I would right a post about this (as post about XIRR in C# have been hard to come by). Lets start with the easy part first. In order to make this call you need to use the Microsoft.Office.Interop.Excel dll. When you use this dll take note of what version of the dll you are using. If you are using a version less then 12 (at the time of this writing 12 was the highest version) you will not have an XIRR function call. This does not mean you cannot still do XIRR though. As of version 12 (a.k.a Office 2007) the XIRR function is a built in function to Excel. Prior version need an add-in to use this function. Even if you have version 12 of the interop though it does not mean you will be able to use the function. The
14 comments
Read more

Experience Profile Anonymous, Unknown and Known contacts

By
When you first get started with Sitecore's experience profile the reporting for contacts can cause a little confusion. There are 3 terms that are thrown around, 1) Anonymous 2) Unknown 3) Known. When you read the docs they can bleed into each other a little. First, have a read through the Sitecore tracking documentation to get a feel for what Sitecore is trying to do. There are a couple key things here to first understand: Unless you call " IdentifyAs() " for request the contact is always anonymous.  Tracking of anonymous contacts is off by default.  Even if you call "IdentifyAs()" if you don't set facet values for the contact (like first name and email) the contact will still show up in your experience profile as "unknown" (because it has no facet data to display).  Enabled Anonymous contacts Notice in the picture I have two contacts marked in a red box. Those are my "known" contacts that I called "IdentifyAs"
1 comment
Read more

Uniting Testing Expression Predicate with Moq

By
I recently was setting up a repository in a project with an interface on all repositories that took a predicate. As part of this I needed to mock out this call so I could unit test my code. The vast majority of samples out there for mocking an expression predicate just is It.IsAny<> which is not very helpful as it does not test anything other then verify it got a predicate. What if you actually want to test that you got a certain predicate though? It is actually pretty easy to do but not very straight forward. Here is what you do for the It.IsAny<> approach in case someone is looking for that. this .bindingRepository.Setup(c => c.Get(It.IsAny<Expression<Func<UserBinding, bool >>>())) .Returns( new List<UserBinding>() { defaultBinding }.AsQueryable()); This example just says to always return a collection of UserBindings that contain “defaultBinding” (which is an object I setup previously). Here is what it looks like when you want to pass in an exp
2 comments
Read more

WPF Localization - RESX Option

By
About a year ago I was building a WPF project in .Net 3.0 and Visual Studio 2005. I wanted to revisit this subject and see what has changed in .Net 3.5 and Visual Studio 2008. I will make a few of these posts to try and cover all the different options (RESX option, LocBaml option, Resource Dictionary Option). In this blog I will focus on using a resx file to localize an application. To show how the resx option is done I created a WPF form with three labels on it. The first label has is text set inline in XAML, the second has it text set via code behind from the resx file and the third has its text set via XAML accessing the resx file. The first thing that needs to happen to setup a project for localization is a small change to the project file. To make this change you will need to open the project file in notepad (or some other generic editor). In the first PropertyGroup section you need to add the follow XML node <UICulture>en-US</UICulture>. So the project file node w
6 comments
Read more

Password Management

By
The need to create, store and manage passwords is a huge responsibility in modern day life. So why is it that so many people do it so poorly? This is a loaded questions with answers ranging from people being uneducated, to lazy, to educated but not affective in their methods and many more. This blog is to help those (in some way even myself) around me strengthen their online security. Why does it matter? To answer this let's look at a few numbers. According to the US Department of Justice (DOJ)’s most recent study , 17.6 million people in the US experience some form of identity theft each year. Ok fine but that is identity theft that has nothing to do with password management. What is one way someone can start getting information about who you are? How do they get access to steal your money? From Cyber Security Ventures 2019 report : "Cybersecurity Ventures predicts that healthcare will suffer 2-3X more cyberattacks in 2019 than the average amount for other industries. W
Post a Comment
Read more