关于ASP.NET MVC WebApi接口跨域访问的解决方案

1.跨域问题的由来

同源策略：处于安全考虑，浏览器会限制脚本中发起的跨站请求，浏览器要求JavaScript或Cookie只能访问同域下的内容

正是由于这个原因，我们不同的项目之间的调用就会被浏览器阻止。比如我们常见的场景：WebApi作为数据服务层，它是一个单独的项目，我们的MVC项目作为Web的显示层，这个时候我们的MVC里面就需要调用WebbAPi里面的接口取数据展现在页面上。因为我们的WebApi和MVC是两个不同的项目，所以运行起来之后就存在上面说的跨域问题。

2.跨域问题的解决原理

CORS全称Cross-Origin Resource Sharing，中文全称跨域资源共享。它解决跨域问题的原理是通过http的请求报文和响应报文里面加入相应的标识告诉浏览器它能访问哪些域名的请求。比如我们向响应报文里面增加这个Access-Control-Allow-Origin：http://localhost:8081，就表示支持http://localhost:8081里面的所有请求访问系统资源。其他更多的应用我们就不一一列举。

3.跨域问题的解决细节

使用微软提供的类，在Nuget搜索“microsoft.aspnet.webapi.cors”，安装第一个

在App_Start文件夹下面的WebApiConfig.cs文件夹配置跨域

public static class WebApiConfig
    {
        public static void Register(HttpConfiguration config)
        {
            //跨域配置
            config.EnableCors(new EnableCorsAttribute("*", "*", "*"));

// Web API 路由
config.MapHttpAttributeRoutes();

            config.Routes.MapHttpRoute(
                name: "DefaultApi",
                routeTemplate: "api/{controller}/{action}/{id}",
                defaults: new { id = RouteParameter.Optional }
            );
        }
    }

4.这个在代码里面写死的配置不利于安全，最好使用配置进行处理

总结：以上支持webapi 2 的项目；框架是net framework4.0以上的项目；对于框架.net framework4.0以下的版本可以使用下面的方式进行处理。

1.一般的解决方案里面有一个Filters文件夹，需要在这个文件夹里面添加一个类文件

    public class CrossSiteAttribute: System.Web.Http.Filters.ActionFilterAttribute
    {
        private const string Origin = "Origin";
         ///
         /// Access-Control-Allow-Origin是HTML5中定义的一种服务器端返回Response header，用来解决资源（比如字体）的跨域权限问题。
         ///
         private const string AccessControlAllowOrigin = "Access-Control-Allow-Origin";
        ///
        /// originHeaderdefault的值可以使 URL 或 *，如果是 URL 则只会允许来自该 URL 的请求，* 则允许任何域的请求
        ///
        private string originHeaderdefault = "*";//"http://192.168.13.7:8002";
         ///
         /// 该方法允许api支持跨域调用
         ///
         /// 初始化 System.Web.Http.Filters.HttpActionExecutedContext 类的新实例。
         public override void OnActionExecuted(HttpActionExecutedContext actionExecutedContext)
         {
             actionExecutedContext.Response.Headers.Add(AccessControlAllowOrigin, originHeaderdefault);
         }
}

2.在WebApi接口内需要引用该文件

[CrossSite]   --是创建的类
    public class WebApiController : ApiController
    {

}

3.当前接口内就可以跨域访问了

关于ASP.NET MVC WebApi接口跨域访问的解决方案

[ 申请 ]友情链接：