Web API Cross browser issue

See more:

jQuery

web

API

I am getting below error msg while calling Web API service from jquery.

XMLHttpRequest cannot load
http://localhost:7532/api/Common/GenerateTabs?clickedTab=null&null&_=1407394637890.
Request header field Access-Control-Allow-origin is not allowed by Access-Control-Allow-Headers.

Juqery Code
$.ajax({
cache: false,
type: type,
url: url,
data: JSON.stringify(data),
//async: false,
crossDomain: true,
//dataType: "jsonp",
processData: true,
contentType: 'application/json; charset=utf-8',
headers: {
'UserToken': 'sdsdsd'
},
beforeSend: function (xhr) {
xhr.setRequestHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE');
xhr.setRequestHeader('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept,UserToken');
xhr.setRequestHeader('Access-Control-Allow-origin', '*');
xhr.setRequestHeader('Access-Control-Allow-Credentials', "true");
},
success: successCallBack
});


Web API

<httpProtocol>
  <customHeaders>
    <add name="Access-Control-Allow-Origin" value="*" />
    <add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept,UserToken" />
    <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE" />
  </customHeaders>
</httpProtocol>

[EnableCors(origins: "*", headers: "Origin, X-Requested-With, Content-Type, Accept, UserToken", methods: "*")]

config.EnableCors();

public override void OnActionExecuted(HttpActionExecutedContext actionExecutedContext)
        {
            System.Diagnostics.Debugger.Launch();

            // Helper.WriteLog("OnActionExecuted", DateTime.Now, DateTime.Now);
            try
            {
                string actionName = actionExecutedContext.ActionContext.ActionDescriptor.ActionName;
                string controllerName = actionExecutedContext.ActionContext.ActionDescriptor.ControllerDescriptor.ControllerName;

                if (controllerName != USERCONTROLLER && actionName != USERACTION)
                {
                    if (actionExecutedContext.Request.Content.Headers.GetValues("UserToken").First() != null)
                    {
                        string token = actionExecutedContext.Request.Content.Headers.GetValues("UserToken").First();
                        actionExecutedContext.Response.Content.Headers.Add("UserToken", token);
                        actionExecutedContext.Response.Content.Headers.Add("Access-Control-Allow-Origin", "*");
                        actionExecutedContext.Response.Content.Headers.Add("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
                    }
                }

            }
            catch (Exception)
            {
                actionExecutedContext.Response.Content.Headers.Add("UserToken", "");
                actionExecutedContext.Response.Content.Headers.Add("Access-Control-Allow-Origin", "*");
                actionExecutedContext.Response.Content.Headers.Add("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
            }

            base.OnActionExecuted(actionExecutedContext);
        }

UI and web api both are deployed in IIS 7.0. not working in Chrome and FireFox.