关于WebAPI跨域的问题,网上已经很多了,以下方案可以解决很多跨域问题,但是都不支持IE8、IE9浏览器,JSONP也只能支持Get请求

  1. 通过dll配置 Install-Package Microsoft.AspNet.WebApi.Cors
  2. 配置 Web.config

IE8,IE9跨域是通过XDomainRequest这个对象去实现,和XMLHttpRequest类似,可以参考下面文档

https://msdn.microsoft.com/zh-cn/library/dd573303(v=vs.85).aspx

使用jQuery.ajax的基础上,在jQuery下面再引用

https://github.com/MoonScript/jQuery-ajaxTransport-XDomainRequest/blob/master/jQuery.XDomainRequest.js

这样IE8、IE9跨域成功了

        public Response<string> Post()
{
Response<string> rs = new Response<string>
{
head = new ResponseHeader { errcode = , errmessage = "post" },
data = "hello"
};
return rs;
}

这样IE8、IE9跨域失败了

        public Response<string> Post(Request<Message> request)
{
Response<string> rs = new Response<string>
{
head = new ResponseHeader { errcode = , errmessage = "post" },
data = request.data.content
};
return rs;
}

后来通过排查,有对象形参的WebAPI就会遇到反序列化问题,(IE8,IE9)转换为request对象的時候报错

试了很多次,前端帶不过來Content-Type,就想到了用參数传递到后端,也修改了jQuery.XDOmainRequest.js这个文件

 /*!
* jQuery-ajaxTransport-XDomainRequest - v1.0.4 - 2015-03-05
* https://github.com/MoonScript/jQuery-ajaxTransport-XDomainRequest
* Copyright (c) 2015 Jason Moon (@JSONMOON)
* Licensed MIT (/blob/master/LICENSE.txt)
*/
(function (factory) {
if (typeof define === 'function' && define.amd) {
// AMD. Register as anonymous module.
define(['jquery'], factory);
} else if (typeof exports === 'object') {
// CommonJS
module.exports = factory(require('jquery'));
} else {
// Browser globals.
factory(jQuery);
}
}(function ($) { // Only continue if we're on IE8/IE9 with jQuery 1.5+ (contains the ajaxTransport function)
if ($.support.cors || !$.ajaxTransport || !window.XDomainRequest) {
return $;
} var httpRegEx = /^(https?:)?\/\//i;
var getOrPostRegEx = /^get|post$/i;
var sameSchemeRegEx = new RegExp('^(\/\/|' + location.protocol + ')', 'i'); // ajaxTransport exists in jQuery 1.5+
$.ajaxTransport('* text html xml json', function (options, userOptions, jqXHR) { // Only continue if the request is: asynchronous, uses GET or POST method, has HTTP or HTTPS protocol, and has the same scheme as the calling page
if (!options.crossDomain || !options.async || !getOrPostRegEx.test(options.type) || !httpRegEx.test(options.url) || !sameSchemeRegEx.test(options.url)) {
return;
} var xdr = null; return {
send: function (headers, complete) {
var postData = '';
var userType = (userOptions.dataType || '').toLowerCase(); xdr = new XDomainRequest();
if (/^\d+$/.test(userOptions.timeout)) {
xdr.timeout = userOptions.timeout;
} xdr.ontimeout = function () {
complete(500, 'timeout');
}; xdr.onload = function () {
var allResponseHeaders = 'Content-Length: ' + xdr.responseText.length + '\r\nContent-Type: ' + xdr.contentType;
var status = {
code: 200,
message: 'success'
};
var responses = {
text: xdr.responseText
};
try {
if (userType === 'html' || /text\/html/i.test(xdr.contentType)) {
responses.html = xdr.responseText;
} else if (userType === 'json' || (userType !== 'text' && /\/json/i.test(xdr.contentType))) {
try {
responses.json = $.parseJSON(xdr.responseText);
} catch (e) {
status.code = 500;
status.message = 'parseerror';
//throw 'Invalid JSON: ' + xdr.responseText;
}
} else if (userType === 'xml' || (userType !== 'text' && /\/xml/i.test(xdr.contentType))) {
var doc = new ActiveXObject('Microsoft.XMLDOM');
doc.async = false;
try {
doc.loadXML(xdr.responseText);
} catch (e) {
doc = undefined;
}
if (!doc || !doc.documentElement || doc.getElementsByTagName('parsererror').length) {
status.code = 500;
status.message = 'parseerror';
throw 'Invalid XML: ' + xdr.responseText;
}
responses.xml = doc;
}
} catch (parseMessage) {
throw parseMessage;
} finally {
complete(status.code, status.message, responses, allResponseHeaders);
}
}; // set an empty handler for 'onprogress' so requests don't get aborted
xdr.onprogress = function () { };
xdr.onerror = function () {
complete(500, 'error', {
text: xdr.responseText
});
}; if (userOptions.data) {
postData = ($.type(userOptions.data) === 'string') ? userOptions.data : $.param(userOptions.data);
}
if (options.contentType && options.contentType.length > 0) {
if (options.url.indexOf('?') > -1) {
options.url = options.url + '&_contentType=' + options.contentType;
} else {
options.url = options.url + '?_contentType=' + options.contentType;
}
}
xdr.open(options.type, options.url);
xdr.send(postData);
},
abort: function () {
if (xdr) {
xdr.abort();
}
}
};
}); return $; }));

jQuery.XDomainRequest.js

加上消息处理就可以解决

 public class CrossDomainFixIEHandler : DelegatingHandler
{
protected override System.Threading.Tasks.Task<HttpResponseMessage> SendAsync(HttpRequestMessage request, System.Threading.CancellationToken cancellationToken)
{
if (request.Method == HttpMethod.Options)
{
HttpResponseMessage response = request.CreateResponse<string>(HttpStatusCode.OK, null);
TaskCompletionSource<HttpResponseMessage> tcs = new TaskCompletionSource<HttpResponseMessage>();
tcs.SetResult(response);
return tcs.Task;
}
if (request.Content.Headers.ContentType == null || string.IsNullOrWhiteSpace(request.Content.Headers.ContentType.MediaType))
{
string contentType = this.GetContentType(string.Concat(request.RequestUri.Query, "&"));
if (string.IsNullOrWhiteSpace(contentType))
{
contentType = "application/json";
}
request.Content.Headers.ContentType = new System.Net.Http.Headers.MediaTypeHeaderValue(contentType);
}
return base.SendAsync(request, cancellationToken);
} /// <summary>
/// 獲取ContentType
/// </summary>
/// <param name="source"></param>
/// <returns></returns>
private string GetContentType(string source)
{
if (string.IsNullOrWhiteSpace(source))
{
return string.Empty;
}
Regex regex = new Regex("[&?]_contentType=(?<contentType>(.*?))&", RegexOptions.IgnoreCase);
Match match = regex.Match(source);
if (match.Success)
{
return match.Groups["contentType"].Value;
}
else
{
return string.Empty;
}
}

WebAPI IE8、IE9 跨域问题的更多相关文章

  1. 跨域调用webapi web端跨域调用webapi

    web端跨域调用webapi   在做Web开发中,常常会遇到跨域的问题,到目前为止,已经有非常多的跨域解决方案. 通过自己的研究以及在网上看了一些大神的博客,写了一个Demo 首先新建一个webap ...

  2. 使用Cors在WebApi中实现跨域请求,请求方式为angular的 $http.jsonp

    使用Cors在WebApi中实现跨域请求 第一步,在webapi项目中安装cors 在Web API配置文件中(Global.asax)进行全局配置: public class WebApiAppli ...

  3. .net core webapi搭建(2)跨域

    Core WebAPI中的跨域处理 在使用WebAPI项目的时候基本上都会用到跨域处理 Core WebAPI的项目中自带了跨域Cors的处理,不需要单独添加程序包 如图所示 修改 Configure ...

  4. 彻底解决Asp.netCore WebApi 3.1 跨域时的预检查204 options重复请求的问题

    Asp.netCore WebApi 3.1 跨域的预检查options问题 1:我们直接使用core跨域的中间件 ,注入跨域服务, services.AddCors(options => { ...

  5. IE9 IE8 ajax跨域问题的解决

    项目中用到的跨域 ,在除IE9以下的浏览器上运行都是没有问题的,IE8 IE9中报错,error :no transport; 网上解决办法均是 在发起请求之前添加 jQuery.support.co ...

  6. c# WebApi之解决跨域问题:Cors

    什么是跨域问题 出于安全考虑,浏览器会限制脚本中发起的跨站请求,浏览器要求JavaScript或Cookie只能访问同域下的内容.由于这个原因,我们不同站点之间的数据访问会被拒绝. Cors解决跨域问 ...

  7. webapi 解决ajax跨域请求问题

    webapi在配置文件中加入这几句就可以解决ajax(同源策略是JavaScript里面的限制,其他的编程语言,比如在C#,Java或者iOS等其他语言中是可以调用外部的WebService,也就是 ...

  8. IE8浏览器跨域接口访问异常的解决办法

    IE8版本以下浏览器绝对是一个神奇的存在,忙碌好久,万事具备,居然在ajax调用接口的时候直接爆炸 陈述一下问题 首先是有这样一个接口,请求类型POST,入参JSON,出参JSON,jQuery aj ...

  9. WebApi(一)-实现跨域返回格式支持json

    1.创建webapi

随机推荐

  1. [转]有道云笔记markdown

    作为半个文字工作者,一天当中,一半时间用在遣词造句,一半时间则在死磕排版.当听说“前所未有的极简语法”Markdown,不仅能简化排版.大大提高书写效率,而且上手零门槛.好奇宝宝怎么忍得住一颗蠢蠢欲动 ...

  2. 强化学习之QLearning

    注:以下第一段代码是 文章 提供的代码,但是简书的代码粘贴下来不换行,所以我在这里贴了一遍.其原理在原文中也说得很明白了. 算个旅行商问题 基本介绍 戳 代码解释与来源 代码整个计算过程使用的以下公式 ...

  3. HDU 5179 beautiful number 数位dp

    题目链接: hdu: http://acm.hdu.edu.cn/showproblem.php?pid=5179 bc(中文): http://bestcoder.hdu.edu.cn/contes ...

  4. week1 四则运算

    四则运算满足简单加减乘除,以及包含括号的复杂四则运算. 代码描述: 1.采用random随机数产生要参与计算的数字,以及运算符号 2.采用Scanner获取控制台输入的结果,与计算出来的结果进行比对, ...

  5. FreeMarker(XML模板)导出word

    在项目中使用它完成的功能是按照固定的模板将数据导出到Word.比如台账.在完成后将处理过程按照台账的要求导出,有时程序中需要实现生成标准Word文档,要求能够打印,并且保持页面样式不变. 这个功能就是 ...

  6. Mac 常用快捷键整理

    Mac下常用的快捷键: Command+W 将当前窗口关闭(可以关闭Safari标签栏,很实用) Command+Option+M 将所有窗口最小化 Command+Q 关闭当前应用程序(相当于Doc ...

  7. 探究Android中通过继承ViewGroup自定义控件的原理

    原文地址:http://www.cnblogs.com/kross/p/3378395.html 今天断断续续的折腾了一下午到现在20:38,终于有点明白了.o(╯□╰)o 在Android开发中,我 ...

  8. ViewPager、Fragment、Matrix综合使用实现Tab滑页效果

    原文地址:http://www.cnblogs.com/kross/p/3372987.html 我们实现一个上面是一个可以左右滑动的页面,下面是三个可点击切换的tab按钮,tab按钮上还有一个激活条 ...

  9. hdu mophues

    在比赛的时候,被这个题目虐死了,这一周中每当我有空闲时间我就总是思索这个题目的解题方法. 终于在自己学过了mobius反演,并且看过别人写得解题思路后自己有了思路. 下面说说我的解题思路吧. 首先题目 ...

  10. Java Servlet异步处理、非阻塞I/O和文件上传

    异步处理 应用服务器中的 web容器通常对各个客户端情求分别使用一个服务器线程.在工作负载很繁重的情况下,容器常要大量线程来为所有客户端请求服务.可扩展性限制包括内存用尽,或容器线程池耗尽.为了创建可 ...