Web API跨浏览器问题

本文介绍了Web API跨浏览器问题的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 29岁程序员，3月因学历无情被辞！ 从jquery调用Web API服务时，我收到错误信息。 XMLHttpRequest无法加载 http：/ / localhost：7532 / api / Common / GenerateTabs？clickedTab = null& null& _ = 1407394637890。 请求标头字段Access-Control不允许Access-Control-Allow-origin - 允许报头。 Juqery Code $ .ajax（{ cache：false， 类型：类型， url：url， 数据：JSON.stringify（数据）， // async：false， crossDomain：true， // dataType：jsonp， processData：true， contentType：'application / json; charset = utf-8'， 标题：{ '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（'Ac cess-Control-Allow-Credentials'，true）; }， 成功：successCallBack }）; Web APII am getting below error msg while calling Web API service from jquery.XMLHttpRequest cannot loadhttp://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（起源：*，标题：Origin，X-Requested-With，Content-Type，Accept，UserToken，方法：*） ] config.EnableCors（）;[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和web api都部署在IIS 7.0中。不适用于Chrome和FireFox。UI and web api both are deployed in IIS 7.0. not working in Chrome and FireFox.推荐答案 .ajax（{ cache：false， 类型：类型， url：url， 数据：JSON.stringify（数据）， // async：false， crossDomain：true， // dataType：jsonp， processData：true， contentType：'application / json; charset = utf-8'， 标题：{ '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）; }， 成功：successCallBack }）; Web API.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（起源：*，标题：Origin，X-Requested-With，Content-Type，Accept，UserToken，方法：*） ] config.EnableCors（）;[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和web api都部署在IIS 7.0中。不适用于Chrome和FireFox。UI and web api both are deployed in IIS 7.0. not working in Chrome and FireFox. 这篇关于Web API跨浏览器问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！ 上岸，阿里云！