一、跨域问题产生的原因:同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能。

现在所有支持JavaScript 的浏览器都会使用这个策略。
所谓同源是指,域名,协议,端口相同。
当一个浏览器的两个tab页中分别打开来 百度和谷歌的页面
当浏览器的百度tab页执行一个脚本的时候会检查这个脚本是属于哪个页面的,
即检查是否同源,只有和百度同源的脚本才会被执行。
由于同源策略的限制,JavaScript就产生了跨域的问题。
参考:同源策略
 
二、在WebApi2中的解决方法。
环境:vs2013,entity framework 6.0
后端项目:webApi 2
前端项目:
提交ajax时候用的类型:application/json
1、在nuget中搜索cors,安装

2、在文件WebApiConfig.cs中配置跨域设置

3、因为前端提交ajax请求,用的类型是application/json。发送post请求前会先发送一个预请求,就是option请求。

要在Web.config中配置下处理option请求,让后端能够正确的响应option请求,前端才会继续发送post请求。

这两个处理程序会影响option请求的正确处理。

  <system.webServer>
<handlers> <!--此处处理options请求。或去iis里面删除、添加上动作添加上OPTIONS-->
<remove name="OPTIONSVerbHandler" />
<remove name="ExtensionlessUrlHandler-Integrated-4.0" />
<add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="*" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
</handlers> </system.webServer>

1、默认的配置:

var cors = new EnableCorsAttribute("*", "*", "*");

config.EnableCors(cors);

这样设置可以实现简单请求的跨域,

但是非简单请求是那种对服务器有特殊要求的请求,比如请求方法是PUT或DELETE,或者Content-Type字段的类型是application/json。非简单请求的CORS请求,会在正式通信之前,增加一次HTTP查询请求,称为"预检"请求(preflight)。options请求。

触发options请求的条件:

1、非GET 、POST请求

  2、POST请求的content-type不是常规的三个:application/x- www-form-urlencoded(使用 HTTP 的 POST 方法提交的表单)、multipart/form-data(同上,但主要用于表单提交时伴随文件上传的场合)、text/plain(纯文本)

  3、POST请求的payload为text/html

  4、设置自定义头部

但是不能实现非简单请求的跨域。

还需要在web.config中<system.webServer>下添加

<handlers>

<remove name="ExtensionlessUrlHandler-Integrated-4.0" />

<remove name="OPTIONSVerbHandler" />

<add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="*" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />

</handlers>

注意 :

var cors = new EnableCorsAttribute("10.116.56.69:90", "*", "*");

是不行的 ,要写http://10.116.56.69:90

注意:如果写http://localhost:90  ,那浏览器访问的时候也要访问 http://localhost:90,如果访问http://10.116.56.69:90,也是不能跨域的。

WebApi2跨域问题的更多相关文章

  1. WebApi2跨域问题及解决办法

    跨域问题产生的原因 同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能.现在所有支持JavaScript的浏览器都会使用这个策略.所谓同源是指,域名,协议, ...

  2. angularjs+webapi2 跨域Basic 认证授权(二)

    在上一篇中大概演示了 整个认证授权的过程.今天在这篇博客中将结合上一篇的例子继续在跨域的情况 我们用ionic 写一个简单的页面 值得注意的是 在ionic.bundle.js 里面集成了angula ...

  3. angularjs+webapi2 跨域Basic 认证授权(一)

    如今的app,利用各种前端框架结合html5的混合开发模式已然盛极一时.其中ionic+angularjs更是如日中天.这种模式利用angularjs $http 请求数据api 以达到前后端分离深得 ...

  4. 利用nginx 反向代理解决跨域问题

    说到nginx,不得不说真的很强大,也带来很多便利用于解决一些头疼的难题. 一般来说可以用来做:静态页面的服务器.静态文件缓存服务器.网站反向代理.负载均衡服务器等等,而且实现这一切,基本只需要改改那 ...

  5. WebAPI跨域处理

    原文来自:http://www.cnblogs.com/heifengwll/p/6243374.html WebApi2跨域问题   一.跨域问题产生的原因:同源策略(Same origin pol ...

  6. WebApi2 jsonp跨域问题

    一:故事背景     以前在写WebApi2的时候,一直是用作前后端分离(WebApi2 +angularjs),可是最近自己在给WebApp写接口的时候遇到了很多坑,总结一下就是跨域问题.而跨域问题 ...

  7. ASP.NET WebAPI2复杂请求跨域设置

    ASP.Net Core的跨域设置比较简单  官方都整合了 具体的参见微软官方文档: https://docs.microsoft.com/zh-cn/aspnet/core/security/cor ...

  8. 关于WebService、WebApi的跨域问题

    随着移动互联网的发展, 传统营销模式往网站以及移动客户端转移已经成为一种趋势.接触过互联网开发的开发者肯定会很熟悉两种网络服务WebApi.WebService.在使用JavaScript进行数据交互 ...

  9. Ajax及跨域

    概念 Ajax Ajax,Asynchronous JavaScript and XML,字面意思:异步的 JavaScript 和 XML,是指一种创建交互式网页应用的网页开发技术. 用于异步地去获 ...

随机推荐

  1. springmvc的初始化参数绑定

    一.springmvc的初始化参数绑定 此种和我们之前说的类型转换非常相似,可以看作是一种类型转换 在初始化参数绑定时  重要的是参数类型 -------------------单日期的绑定 二. 配 ...

  2. jQuery iPresenter 3D图片旋转

    在线实例 效果一 效果二 使用方法 <div class="htmleaf-container"> <div class="htmleaf-conten ...

  3. 盘点国内11家已经获得融资的移动CRM平台

    盘点国内11家已经获得融资的移动CRM平台 亿欧网盘点了目前国内已经获得融资的11家移动CRM平台,它们分别是:纷享销客.红圈营销.小满科技.腾腾科技.麦客.美洽.销售易.快消总管.EC营客通.店小三 ...

  4. weblogic安装注意事项_linux

    ➠更多技术干货请戳:听云博客 一.安装过程:参考“weblogic安装截屏(linux)” 注意事项:安装weblogic时,需要注意以下两点: 1.首先在安装目录下创建weblogic12文件夹 如 ...

  5. iOS Xcode, 解决“Could not insert new outlet connection: Could not find any information for the class named”的问题。

    在Xcode中,我们可以在StoryBoard编辑界面或者是xib编辑界面中通过“Control键+拖拽“的方式将某个界面元素和对应的代码文件连接起来,在代码文件中创建outlet. 不过,如果你的运 ...

  6. (二)Maven的安装与环境配置

    想要安装 Apache Maven在Windows 系统上, 需要下载 Maven 的 zip 文件,并将其解压到你想安装的目录,并配置 Windows 环境变量. 所需工具 : 1.JDK 2.Ma ...

  7. h5滑动方向、手机拖动层

    做h5时需对手指滑动方向判断及拖动浮动层,本文代码适用于手机端h5页面,pc页面可使用onMouseDown.onMouseUp.onMouseMove.(本方法仅为功能实现原理和演示,可根据自己的需 ...

  8. JavaWeb工程中web.xml基本配置

    一.理论准备 先说下我记得xml规则,必须有且只有一个根节点,大小写敏感,标签不嵌套,必须配对. web.xml是不是必须的呢?不是的,只要你不用到里面的配置信息就好了,不过在大型web工程下使用该文 ...

  9. 15天玩转redis —— 第十一篇 让你彻底了解RDB存储结构

    接着上一篇说,这里我们来继续分析一下RDB文件存储结构,首先大家都知道RDB文件是在redis的“快照”的模式下才会产生,那么如果 我们理解了RDB文件的结构,是不是让我们对“快照”模式能做到一个心中 ...

  10. Hadoop日常维护系列——Hadoop添加删除节点

    添加节点 1.修改host    和普通的datanode一样.添加namenode的ip 2.修改namenode的配置文件conf/slaves    添加新增节点的ip或host 3.在新节点的 ...