System.Web.Http.Cors配置跨域访问的两种方式

System.Web.Http.Cors配置跨域访问的两种方式

  使用System.Web.Http.Cors配置跨域访问,众多大神已经发布了很多文章,我就不在详细描述了,作为小白我只说一下自己的使用心得。在webapi中使用System.Web.Http.Cors配置跨域信息可以有两种方式。 
  一种是在App_Start.WebApiConfig.cs的Register中配置如下代码,这种方式将在所有的webapi Controller里面起作用。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web.Http;
using System.Web.Http.Cors;

namespace YDTG.Service
{
    public static class WebApiConfig
    {
        public static void Register(HttpConfiguration config)
        {
            // Web API 配置和服务

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

            config.Routes.MapHttpRoute(
                name: "DefaultApi",
                routeTemplate: "api/{controller}/{action}/{id}",
                defaults: new { id = RouteParameter.Optional }
            );
            //这是重点,从配置文件的appsettings节点中读取跨域的地址
            var cors = new EnableCorsAttribute(ConfigurationManager.AppSettings["origins"], "*", "*");
            config.EnableCors(cors);
        }
    }
}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29

配置文件如下,注意一定要加上http

<add key="origins" value="http://localhost:9012,http://192.168.1.108:9012" />
  • 1
  • 1

  第二种方式就是在每个webapiController类中设置,即每个控制器个性化配置,如下代码。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Http.Cors;
using System.Web.Mvc;

namespace Service.Controllers
{
    [EnableCors("http://localhost:9012,http://192.168.1.108:9012", "*", "*")]
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            ViewBag.Title = "Home Page";

            return View();
        }
    }
}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21

注意事项

  1. EnableCors共三个参数分别为origins、headers和methods。origins配置允许访问的域名,多个域名以逗号分隔即可,域名一定要完整,如果是ip地址前面要加上“http”,只使用IP的话一定会失效的。参数headers配置所支持的资源。参数methods配置支持的方法,get、post、put等。如果允许任意域名、任意资源、任意方法访问自己的webapi,则三个参数全部使用星号”*”即可
  2. “EnableCors(“http://localhost:9012,http://192.168.1.108:9012“, ““, ““)”中的配置如果出现错误的话不会报错,而是直接禁止未出现在配置表中的资源访问。
  3. 如果使用第一种方式那么可以从配置文件中读取网站列表,如果使用第二种方式,所有的参数只能使用常量。

http://blog.csdn.net/chaoyangzhixue/article/details/52251322

会得到CORS Access Deny,即跨域访问被拒绝。

对于C#做如下配置可允许资源的跨域访问:

<system.webServer>
...
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type" />
<add name="Access-Control-Allow-Methods" value="PUT,GET,POST,DELETE,OPTIONS"/>
</customHeaders>
</httpProtocol>
</system.webServer>

对于nodejs做如下配置可允许资源的跨域访问:

//设置CORS跨域访问
app.all(‘*‘, function (req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "X-Requested-With, accept, origin, content-type");
res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");
res.header("X-Powered-By", ‘ 3.2.1‘)
res.header("Content-Type", "application/json;charset=utf-8");
next();
});

Access-Control-Allow-Origin:*表示允许任何域发起请求,如果只允许特定的域访问,则设置Access-Control-Allow-Origin:xxx为具体域名即可。

Preflighted Requests(预检请求)

Preflighted Requests是CORS中一种透明服务器验证机制。预检请求首先需要向另外一个域名的资源发送一个 HTTP OPTIONS 请求头,其目的就是为了判断实际发送的请求是否是安全的。

下面的2种情况需要进行预检:

1、  简单请求,比如使用Content-Type 为 application/xml 或 text/xml 的 POST 请求;

2、中设置自定义头,比如 X-JSON、X-MENGXIANHUI 等。

http://blog.csdn.net/chaoyangzhixue/article/details/52251322

时间: 2024-10-12 17:29:37

System.Web.Http.Cors配置跨域访问的两种方式的相关文章

jQuery 跨域访问的三种方式 No &#39;Access-Control-Allow-Origin&#39; header is present on the reque

问题: XMLHttpRequest cannot load http://v.xxx.com. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:63342' is therefore not allowed access. test.html:1 Resource interpreted as Script but transferred

【js跨域】js实现跨域访问的几种方式

这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被当作是不同的域. 下表给出了相对http://store.company.com/dir/page.html同源检测的结果: 要解决跨域的问题,我们可以使用以下几种方法: 一.通过jsonp跨域 在js中,我们直接用XMLHttpRequest请求不同域上的数据时,是不可以的.但是,在页面上引入不同

如何跨域访问的两种方法~

1. JSONP,需要客户端与服务端配合    什么是:填充式JSON--JSON with Padding    何时: 今后跨域,首选jsonp    如何:      基本思想:用其它可以跨域请求的元素,代替ajax     程序中都是用<script>元素代替ajax发送请求     方案一:       1. 服务端: 将要返回的数据,填充进一条字符串格式的js语句中,组成一条正确的可执行的js语句,再返回      2. 客户端: 添加<script src="服务

JavaScript对象属性访问的两种方式

JavaScript对象属性访问的两种方式 object.attribute object["attribute"] 例如: var employees = [ { "firstName":"Bill" , "lastName":"Gates" }, { "firstName":"George" , "lastName":"Bush&qu

Web Api 2(Cors)Ajax跨域访问

支持Ajax跨域访问ASP.NET Web Api 2(Cors)的简单示例教程演示 随着深入使用ASP.NET Web Api,我们可能会在项目中考虑将前端的业务分得更细.比如前端项目使用Angularjs的框架来做UI,而数据则由另一个Web Api 的网站项目来支撑.注意,这里是两个Web网站项目了,前端项目主要负责界面的呈现和一些前端的相应业务逻辑处理,而Web Api则负责提供数据. 这样问题就来了,如果前端通过ajax访问Web Api项目话,就涉及到跨域了.我们知道,如果直接访问,

CORS解决跨域访问问题

简言之,CORS就是为了让AJAX可以实现可控的跨域访问而生的. Tomcat下的配置   下载cors-filter-1.7.jar,java-property-utils-1.9.jar这两个库文件,放到lib目录下.(可在http://search.maven.org上查询并下载.)工程项目(如:geoserver)中web.xml中的配置如下: <filter> <filter-name>CORS</filter-name> <filter-class&g

nginx配置跨域访问

前端要在本地测试ajax接口,无法跨域访问,所以在测试环境的nginx配置了跨域支持,方法如下: 在nginx.conf文件, http块下配置 42 #support cross domain access 43 add_header Access-Control-Allow-Origin *; 44 add_header Access-Control-Allow-Headers X-Requested-With; 45 add_header Access-Control-Allow-Meth

解决前端跨域请求的几种方式

利用 JSONP 实现跨域调用 说道跨域调用,可能大家首先想到的或者听说过的就是 JSONP 了. 1.1 什么是JSONP JSONP 是 JSON 的一种使用模式,可以解决主流浏览器的跨域数据访问问题.其原理是根据 XmlHttpRequest 对象受到同源策略的影响,而 <script> 标签元素却不受同源策略影响,可以加载跨域服务器上的脚本,网页可以从其他来源动态产生 JSON 资料.用 JSONP 获取的不是 JSON 数据,而是可以直接运行的 JavaScript 语句. 1.2

ASP.NET MVC 实现跨域请求的两种形式

一.使用jsonp请求 1 $.ajax({ 2 type: "GET", 3 url: "http://10.174.1.1/Home/Test?callback=?", 4 data: { id: "1" }, 5 dataType: "jsonp", 6 jsonp: "callback", 7 success: function (data) { 8 alert(data); 9 }, 10 err