MVC 之 WebAPI 系列二

今天，我想在此记录下 WebApi 跨域调用

1. 什么叫跨域：

跨域问题简单理解就是JavaScript同源策略的限制，其根本原因是因为浏览器对于这种请求，所给予的权限是较低的，通常只允许调用本域中的资源，除非目标服务器明确地告知它允许跨域调用。

所以，跨域的问题虽然是由于浏览器的请求产生，但是却需要在服务端来进行解决，道理很简单，不可能要求所有客户端降低安全性。

照下图，再深入了解下什么跨域：

http://www.a.com/a.js
http://www.a.com/b.js 同一域名下 允许

----------------------------------------------------------------------------------------------------
http://www.a.com/lab/a.js
http://www.a.com/script/b.js 同一域名下不同文件夹 允许

----------------------------------------------------------------------------------------------------
http://www.a.com:8000/a.js
http://www.a.com/b.js 同一域名，不同端口 不允许

----------------------------------------------------------------------------------------------------
http://www.a.com/a.js
https://www.a.com/b.js 同一域名，不同协议 不允许

----------------------------------------------------------------------------------------------------
http://www.a.com/a.js
http://70.32.92.74/b.js 域名和域名对应ip 不允许

----------------------------------------------------------------------------------------------------
http://www.a.com/a.js
http://script.a.com/b.js 主域相同，子域不同 不允许

----------------------------------------------------------------------------------------------------
http://www.a.com/a.js
http://a.com/b.js 同一域名，不同二级域名（同上） 不允许（cookie这种情况下也不允许访问）

----------------------------------------------------------------------------------------------------
http://www.cnblogs.com/a.js
http://www.a.com/b.js 不同域名 不允许

 

2. 在未做允许跨域情况下调用WebAPI

知道了什么是跨域后，我们在一开始调用Web Api 时，就知道为什么会调用不成功

下面我来演示下。我本地写了一个很简单的Webapi，并且发布到了IIS(不会发布Webapi的，请自行百度，不在本文所述范畴)

 

发布后，可以在浏览器中浏览到

然后，我写了一个Web程序来调用这个Webapi，代码如下：

 

在调用时，就会失败：

使用Chrome查看，错误如下：

 

意思很明显，就是跨域，被禁止访问加载

 

3. 解决跨域

Webapi有自己解决跨域的方法，那就是修改Web.config，来实现跨域的授权动作。

在Web.config内，写入下面代码（附图）

<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.config授权文件后，调用即可成功

 

转载于:https://www.cnblogs.com/zmoneyz/p/5076407.html