关于WebApi 跨域问题的解决的方式

最近在做WebApi 进行开发的时候 一直会遇到跨域方面的问题那么如何进行跨域问题其实非常的简单。

1.一直在使用WebApi的时候总是遇到跨域的问题 那么 什么是跨域?跨域,指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的,是浏览器对javascript施加的安全限制。

注:解决web API跨域其实比较简单,如果可以的话,如下的修改header即可,但是还是存在很多陷阱。首先必须保证做的更改API重新发布新的文件覆盖原有文件。我们一直调不通,就是因为发布文件中的配置并没有发生改变。另外使用Ajax调用的时候不能添加ContentType的配置。
同时使用服务端的CORS和客户端jQuery.support.cors = true;就可以解决所有的问题了。
另外一个Get和Post之外的HttpMethod我是用参数传进去的,因为有些浏览器不支持。

有的就是 CORS 跨域

让mvc  或者 webapi 支持CORS跨域的配置是:
在system.webServer节点上添加
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Max-Age" value="30"/>
<add name="Access-Control-Allow-Methods" value="GET,POST,OPTIONS"/>
<add name="Access-Control-Allow-Headers" value="Content-Type, Accept" />
</customHeaders>
</httpProtocol>

2. 服务端需要进行添加

HttpContext.Current.Response.AddHeader("Access-Control-Allow-Credentials","true");

 

客户端的jQuery:
$.ajax({
...
xhrFields: { //允许跨域访问是添加cookie
withCredentials: true
},
...

 

在做Web开发中,常常会遇到跨域的问题,到目前为止,已经有非常多的跨域解决方案。
通过自己的研究以及在网上看了一些大神的博客,写了一个Demo
首先新建一个webapi的程序,如下图所示:

 

posted @ 2017-06-13 17:03  LowKeyC  阅读(737)  评论(0编辑  收藏  举报
有志者事竟成破釜沉舟百二秦关终属楚苦心人,天不负,卧薪尝胆,三千越甲可吞吴