一、跨域问题的由来

同源策略：出于安全考虑，浏览器会限制脚本中发起的跨站请求，浏览器要求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里面的所有请求访问系统资源。其他更多的应用我们就不一一列举，可以去网上找找。

三、跨域问题解决细节

下面我就结合一个简单的实例来说明下如何使用CORS解决WebApi的跨域问题。

api接口地址：http://127.0.0.1:8004/api/Values/ResturnResult

[HttpGet]
public string ResturnResult()
{
      return "Success";
}

从web站点发送请求：

$(function () {
        $.ajax({
            type: "get",
            url: "http://127.0.0.1:8004/api/Values/ResturnResult",
            data: {},
            success: function (data, status) {
                if (status == "success") {
                    $("#result").html(data);
                }
            },
            error: function (e) {
                $("#result").html("Error");
            },
            complete: function () {

            }

        });
    });

结果:

使用CORS跨域