一、跨域问题的由来
同源策略:出于安全考虑,浏览器会限制脚本中发起的跨站请求,浏览器要求JavaScript或Cookie只能访问同域下的内容。
正是由于这个原因,我们不同项目之间的调用就会被浏览器阻止。比如我们最常见的场景:WebApi作为数据服务层,它是一个单独的项目,我们的MVC项目作为Web的显示层,这个时候我们的MVC里面就需要调用WebApi里面的接口取数据展现在页面上。因为我们的WebApi和MVC是两个不同的项目,所以运行起来之后就存在上面说的跨域的问题。
二、跨域问题解决原理
CORS全称Cross-Origin Resource Sharing,中文全称跨域资源共享。它解决跨域问题的原理是通过向http的请求报文和响应报文里面加入相应的标识告诉浏览器它能访问哪些域名的请求。比如我们向响应报文里面增加这个Access-Control-Allow-Origin:http://localhost:8081,就表示支持http://localhost:8081里面的所有请求访问系统资源。其他更多的应用我们就不一一列举,可以去网上找找。
三、跨域问题解决细节
 
1、引用CORS
首先介绍下CORS如何使用,在WebApiCORS项目上面使用Nuget搜索“microsoft.aspnet.webapi.cors”,安装第一个
 
 
2、添加dll文件的引用
 
 
3、在web.config中添加配置
 
 
//代码
<!--httpProtocol为webApi跨域问题 -->
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="Content-Type" />
<add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
</customHeaders>
</httpProtocol>
 
 
 
4、下一步在web api 配置和服务中配置下
 
 
 
 
 
5、调用api的时候url写全
 
 
 

Web Api 跨域解决方案的更多相关文章

  1. Web Api跨域访问配置及调用示例

    1.Web Api跨域访问配置. 在Web.config中的system.webServer内添加以下代码: <httpProtocol> <customHeaders> &l ...

  2. ASP.NET web api 跨域请求

    1.学习文章:AJAX 跨域请求 - JSONP获取JSON数据 1.asp.net代码 参考文章:http://www.sxt.cn/info-2790-u-756.html (1).增加CorsH ...

  3. ABP框架Web API跨域问题的解决方案

    ​1.在Web Api 项目下安装 Microsoft.AspNet.WebApi.Cors 包 Install-Package Microsoft.AspNet.WebApi.Cors 2.在Web ...

  4. [转] ABP框架Web API跨域问题的解决方案

    原文地址:​https://www.cnblogs.com/farb/p/ABPWebAPICrossDomain.html 1.在Web Api 项目下安装 Microsoft.AspNet.Web ...

  5. asp.net web api 跨域问题

    缘起 以前在asp.net mvc时代,很少出现跨域问题 自从使用了asp.net web api + angular (1/2)之后,开始有跨域问题了. 简单普及下跨域: 我的理解是只要是前台页面与 ...

  6. Web API(五):Web API跨域问题

    一.什么是跨域问题 跨域:指的是浏览器不能执行其他网站的脚本.是由浏览器的同源策略造成的,是浏览器施加的安全限制.(服务端可以正常接收浏览器发生的请求,也可以正常返回,但是由于浏览器的安全策略,浏览器 ...

  7. ASP.NET Web API 跨域访问(CORS)

    一.客户端用JSONP请求数据 如果你想用JSONP来获得跨域的数据,WebAPI本身是不支持javascript的callback的,它返回的JSON是这样的: {"YourSignatu ...

  8. web api 跨域请求,ajax跨域调用webapi

    1.跨域问题仅仅发生在Javascript发起AJAX调用,或者Silverlight发起服务调用时,其根本原因是因为浏览器对于这两种请求,所给予的权限是较低的,通常只允许调用本域中的资源,除非目标服 ...

  9. Web API 跨域请求

    分布式技术在项目中会频繁用到,以前接触过WebService(可跨平台).WCF(功能强大,配置繁琐),    最近由于上层业务调整,将原来的MVC项目一分为三,将数据层提取出来,用API去访问.然后 ...

随机推荐

  1. No suitable authentication method found to complete authentication (publickey,keyboard-interactive).

    string command = Command.Text; StringBuilder result = new StringBuilder(); try { var connectionInfo ...

  2. JavaScript随机排序算法1

    1.对数组循环,每一项与随机的某一项位置调换 <ul id="listOne"></ul> <div id="tempOne"&g ...

  3. sqlserver编程基本语法

    一.定义变量 --简单赋值 declare @a int set @a=5 print @a   --使用select语句赋值 declare @user1 nvarchar(50) select @ ...

  4. ORA-02095: specified initialization parameter cannot be modified

    输入命令:alter system set utl_file_dir='/home/oracle/logmnr' scope=spfile; 报错: 出错原因:没有用spfile文件启动数据库 解决办 ...

  5. 读书笔记_Effective_C++_条款十七:以独立语句将new产生的对象置入智能指针

    int get_int(); void f(shared_ptr<int> a, int); //下面调用 f(new int(3), get_int());//如果是类而不是int就可以 ...

  6. dede后台反应特别慢-转

    找到织梦后台管理目录下的/templets/index_body.htm文件 将第25行至第35行部分js代码注释掉. 就这么简单

  7. html5标签placeholder使用

    <!DOCTYPE HTML> <html> <body> <form action="/example/html5/demo_form.asp&q ...

  8. flask开发restful api系列(1)

    在此之前,向大家说明的是,我们整个框架用的是flask + sqlalchemy + redis.如果没有开发过web,还是先去学习一下,这边只是介绍如果从开发web转换到开发移动端.如果flask还 ...

  9. 【No system images installed for this target】的解决方式

    打开eclipse,新建安卓SDK模拟器时,选择完Target之后,再选择CPU/ABI时,默认为No system images installed for this target. 且无法编辑: ...

  10. bzoj1178

    题目:http://www.lydsy.com/JudgeOnline/problem.php?id=1178 看ppt http://wenku.baidu.com/link?url=dJv6LNm ...